Skip to content

Commit

Permalink
Merge pull request #43 from Vivy24/main
Browse files Browse the repository at this point in the history 
Format code GitHub Workflow
  • Loading branch information
@piyushkdas0611
piyushkdas0611 authored Oct 19, 2023
2 parents 49ccb29 + 00bb3d5 commit 968716b
Show file tree
Hide file tree
Showing 15 changed files with 595 additions and 373 deletions.
23 changes: 23 additions & 0 deletions .github/workflows/format.yml
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,23 @@
name: Format
on:
pull_request:
branches:
- main
push:
branches:
- main

jobs:
format:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v3
with:
ref: ${{ github.head_ref }}
- run: npm install --ci
- run: npm run format-code
- name: Commit code after format
uses: stefanzweifel/git-auto-commit-action@v4
with:
commit_message: Apply formatting changes
branch: ${{ github.head_ref }}
2 changes: 2 additions & 0 deletions .gitignore
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,2 @@
node_modules/
package-lock.json
10 changes: 10 additions & 0 deletions README.md
View file
Original file line number Diff line number Diff line change
@@ -1,11 +1,17 @@
# Profile-Card-Generator

A Profile Card Generator for generating profile cards to display on websites.

# Fork, Clone, Make Changes, and Create a Pull Request

This guide will walk you through the process of contributing to this repository by forking it, cloning your fork, making changes, checking out a new branch, committing those changes, pushing them to your fork, and finally, creating a pull request to suggest your changes to the original repository.

## Fork the Repository

Click the "Fork" button at the top right corner of this repository's page. This action will create a copy of the repository under your GitHub account.

## Clone Your Fork

Open your terminal (command prompt or Git Bash on Windows, or a terminal on macOS and Linux).

Navigate to the directory where you want to store the project (use cd to change directories).
Expand All @@ -23,6 +29,7 @@ cd repository-name
```

## Make Changes

Create a new branch for your changes, giving it a meaningful name related to the issue or feature you're working on:

```
Expand All @@ -32,6 +39,7 @@ git checkout -b feature-or-fix-name
Make your desired changes to the project using your preferred code editor or IDE.

## Commit Your Changes

Add the changes you made to the staging area:

```
Expand All @@ -47,13 +55,15 @@ git commit -m "Add a brief description of your changes"
```

## Push Your Changes

Push your changes to your fork on GitHub:

```
git push origin feature-or-fix-name
```

## Create a Pull Request

Visit the original repository on GitHub.

You will see a green "Compare & pull request" button. Click it.
Expand Down
177 changes: 103 additions & 74 deletions form.html
View file
Original file line number Diff line number Diff line change
@@ -1,71 +1,103 @@
<!DOCTYPE html>
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link href="https://fonts.googleapis.com/css?family=Montserrat'\" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Rajdhani" rel="stylesheet">
<link rel="stylesheet" href="./stylesheets/index.css" />
<link rel="stylesheet" href="./stylesheets/cards/card.css" />
<link rel="stylesheet" href="./stylesheets/cards/card1.css" />
<link rel="stylesheet" href="./stylesheets/cards/card2.css" />
<link rel="stylesheet" href="./stylesheets/cards/card3.css" />
<link rel="stylesheet" href="./stylesheets/cards/card4.css" />
<link rel="stylesheet" href="./stylesheets/cards/card5.css" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.2/css/all.min.css"
integrity="sha512-z3gLpd7yknf1YoNbCzqRKc4qyor8gaKU1qmn+CShxbuBusANI9QpRohGBreCFkKxLhei6S9CQXFEbbKuqLg0DA=="
crossorigin="anonymous" referrerpolicy="no-referrer" />
<title>Profile Card Generator</title>
</head>

<body class="dark-mode">
<div class="dark-mode-button">
<button id="dark-mode-toggle" onclick="toggleMode()"><i id="mode-icon" class="fa fa-moon"></i></button>
</div>
<div class="input-form">
<h1>Profile Card Generator</h1>
<form action="">
<label for="image">Image URL:</label>
<input type="text" id="image" required placeholder="Attach your Image URL" />

<label for="name">Name:</label>
<input type="text" id="name" required placeholder="Write your name" />

<label for="bio">Bio:</label>
<input type="text" id="bio" required placeholder="Write something about you " />

<label for="twitter">Twitter Link:</label>
<input type="text" id="twitter" required placeholder="twitter.com/xyz" />

<label for="github">GitHub Link:</label>
<input type="text" id="github" required placeholder="github.com/xyz" />

<label for="linkedin">LinkedIn Link:</label>
<input type="text" id="linkedin" required placeholder="linkedin.com/xyz" />

<label for="email">Email:</label>
<input type="email" id="email" required placeholder="[email protected]" />

<button id="generate">Generate Card</button>
</form>
</div>

<div class="container">
<div id="output" class="card-container">
<!-- Generated profile card will be displayed here -->
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link
href="https://fonts.googleapis.com/css?family=Montserrat'\"
rel="stylesheet"
/>
<link
href="https://fonts.googleapis.com/css2?family=Rajdhani"
rel="stylesheet"
/>
<link rel="stylesheet" href="./stylesheets/index.css" />
<link rel="stylesheet" href="./stylesheets/cards/card.css" />
<link rel="stylesheet" href="./stylesheets/cards/card1.css" />
<link rel="stylesheet" href="./stylesheets/cards/card2.css" />
<link rel="stylesheet" href="./stylesheets/cards/card3.css" />
<link rel="stylesheet" href="./stylesheets/cards/card4.css" />
<link rel="stylesheet" href="./stylesheets/cards/card5.css" />
<link
rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.2/css/all.min.css"
integrity="sha512-z3gLpd7yknf1YoNbCzqRKc4qyor8gaKU1qmn+CShxbuBusANI9QpRohGBreCFkKxLhei6S9CQXFEbbKuqLg0DA=="
crossorigin="anonymous"
referrerpolicy="no-referrer"
/>
<title>Profile Card Generator</title>
</head>

<body class="dark-mode">
<div class="dark-mode-button">
<button id="dark-mode-toggle" onclick="toggleMode()">
<i id="mode-icon" class="fa fa-moon"></i>
</button>
</div>

<div id="output1" class="card-container">
<!-- Generated profile card will be displayed here -->
<div class="input-form">
<h1>Profile Card Generator</h1>
<form action="">
<label for="image">Image URL:</label>
<input
type="text"
id="image"
required
placeholder="Attach your Image URL"
/>

<label for="name">Name:</label>
<input type="text" id="name" required placeholder="Write your name" />

<label for="bio">Bio:</label>
<input
type="text"
id="bio"
required
placeholder="Write something about you "
/>

<label for="twitter">Twitter Link:</label>
<input
type="text"
id="twitter"
required
placeholder="twitter.com/xyz"
/>

<label for="github">GitHub Link:</label>
<input type="text" id="github" required placeholder="github.com/xyz" />

<label for="linkedin">LinkedIn Link:</label>
<input
type="text"
id="linkedin"
required
placeholder="linkedin.com/xyz"
/>

<label for="email">Email:</label>
<input type="email" id="email" required placeholder="[email protected]" />

<button id="generate">Generate Card</button>
</form>
</div>

<div id="output2" class="card-container">
<!-- Generated profile card will be displayed here -->
</div>
<div class="container">
<div id="output" class="card-container">
<!-- Generated profile card will be displayed here -->
</div>

<div id="output3" class="card-container">
<!-- Generated profile card will be displayed here -->
</div>
<div id="output1" class="card-container">
<!-- Generated profile card will be displayed here -->
</div>

<div id="output2" class="card-container">
<!-- Generated profile card will be displayed here -->
</div>

<div id="output3" class="card-container">
<!-- Generated profile card will be displayed here -->
</div>
<div id="output4" class="card-container">
<!-- Generated profile card will be displayed here -->
</div>
Expand All @@ -74,14 +106,11 @@ <h1>Profile Card Generator</h1>
<!-- Generated profile card will be displayed here -->
</div>
</div>
<footer>
<p>This project is participating in Hacktoberfest.</p>
<p>&copy; 2023</p>
</footer>



<script src="script.js"></script>
</body>

</html>
<footer>
<p>This project is participating in Hacktoberfest.</p>
<p>&copy; 2023</p>
</footer>

<script src="script.js"></script>
</body>
</html>
63 changes: 39 additions & 24 deletions index.html
View file
Original file line number Diff line number Diff line change
@@ -1,34 +1,49 @@
<!DOCTYPE html>
<!doctype html>
<html>

<head>
<head>
<title>Profile Card Generator</title>
<link rel="stylesheet" href="./stylesheets/styles.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.2/css/all.min.css"
integrity="sha512-z3gLpd7yknf1YoNbCzqRKc4qyor8gaKU1qmn+CShxbuBusANI9QpRohGBreCFkKxLhei6S9CQXFEbbKuqLg0DA=="
crossorigin="anonymous" referrerpolicy="no-referrer" />
</head>
<link rel="stylesheet" href="./stylesheets/styles.css" />
<link
rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.2/css/all.min.css"
integrity="sha512-z3gLpd7yknf1YoNbCzqRKc4qyor8gaKU1qmn+CShxbuBusANI9QpRohGBreCFkKxLhei6S9CQXFEbbKuqLg0DA=="
crossorigin="anonymous"
referrerpolicy="no-referrer"
/>
</head>

<body class="dark-mode">
<body class="dark-mode">
<nav>
<div class="topnav">
<div class="left"><a class="active" href="#home">Profile Card Generator</a></div>
<div class="right">
<a class="gitlink" href="https://github.com/piyushkdas0611/Profile-Card-Generator">Contribute</a>
<button id="dark-mode-toggle" onclick="toggleMode()"><i id="mode-icon" class="fa fa-moon"></i></button>
</div>
<div class="topnav">
<div class="left">
<a class="active" href="#home">Profile Card Generator</a>
</div>
<div class="right">
<a
class="gitlink"
href="https://github.com/piyushkdas0611/Profile-Card-Generator"
>Contribute</a
>
<button id="dark-mode-toggle" onclick="toggleMode()">
<i id="mode-icon" class="fa fa-moon"></i>
</button>
</div>
</div>
</nav>
<div class="container">
<h1>Welcome to Our Profile Card Generator</h1>
<p>Create your own customized profile card with just a click of the button below.</p>
<button class="form-button" onclick="window.location.href='form.html'">Generate Profile</button>
<h1>Welcome to Our Profile Card Generator</h1>
<p>
Create your own customized profile card with just a click of the button
below.
</p>
<button class="form-button" onclick="window.location.href='form.html'">
Generate Profile
</button>
</div>
<footer>
<p>This project is participating in Hacktoberfest.</p>
<p>&copy; 2023</p>
<p>This project is participating in Hacktoberfest.</p>
<p>&copy; 2023</p>
</footer>
</body>
<script src="script.js"></script>

</html>
</body>
<script src="script.js"></script>
</html>
29 changes: 29 additions & 0 deletions package.json
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,29 @@
{
"name": "profile-card-generator",
"version": "1.0.0",
"description": "An application help to generate a profile card",
"main": "index.html",
"scripts": {
"format-code": "npx prettier . --write",
"test": "echo \"Error: no test specified\" && exit 1"
},
"repository": {
"type": "git",
"url": "git+https://github.com/piyushkdas0611/Profile-Card-Generator.git"
},
"keywords": [
"profile",
"card",
"web",
"application"
],
"author": "Piyush K. Das",
"license": "ISC",
"bugs": {
"url": "https://github.com/piyushkdas0611/Profile-Card-Generator/issues"
},
"homepage": "https://github.com/piyushkdas0611/Profile-Card-Generator#readme",
"devDependencies": {
"prettier": "^3.0.3"
}
}
Loading

0 comments on commit 968716b

Please sign in to comment.