├── .env.example ├── .github ├── FUNDING.yml ├── ISSUE_TEMPLATE │ └── ISSUE_TEMPLATE │ │ ├── bug_report.md │ │ └── enhancement-request.md ├── PULL_REQUEST_TEMPLATE.md └── workflows │ └── workflows │ └── greetings.yml ├── .gitignore ├── CODE_OF_CONDUCT.md ├── CONTRIBUTING.md ├── Faqs.html ├── Hero Section.jpg ├── Li.gif ├── RateMyResume.css ├── RateMyResume.html ├── RateMyResume.js ├── RateMyResumeData └── mohitresume.pdf ├── Resume.css ├── Resume.js ├── about.html ├── assets ├── emily_johnson.jpg ├── instant resume.jpg ├── joao-ferrao-4YzrcDNcRVg-unsplash.jpg ├── john_smith.jpg ├── jondoe.jpg ├── securedata.jpg └── support.jpg ├── ats_score_finder.html ├── backend ├── app.js ├── config │ └── databaseConfig.js ├── controller │ └── authController.js ├── index.js ├── middleware │ └── jwtAuth.js ├── model │ └── userSchema.js ├── package-lock.json ├── package.json └── router │ └── authRoute.js ├── boy.png ├── chatbot.gif ├── chatbot.html ├── colorChoice.html ├── comment.html ├── contact.html ├── contributing.md ├── cv.html ├── feedback.html ├── feedbackformimg.jpeg ├── global.css ├── images ├── Gemini_Generated_Image_52rg8r52rg8r52rg.jpg ├── Gemini_Generated_Image_fx9dejfx9dejfx9d.jpg ├── Gemini_Generated_Image_ootrdvootrdvootr.jpg ├── background-home.png ├── favicon-removebg-preview.png ├── hero.jpg ├── logo.png ├── logo.png.jpeg ├── sample-color1.png ├── sample-color2.png ├── sample-color3.png ├── sample-color4.png ├── sample-color5.png ├── sample-color6.png ├── sample-color7.png ├── sample-resume1.jpg ├── sample-resume2.jpg ├── sample-resume3.jpg ├── sample-resume4.jpg ├── sample-resume5.jpg ├── sample-resume6.jpg ├── sample-resume7.jpg └── sample-resume8.jpg ├── index.html ├── login.css ├── login.html ├── login.js ├── package-lock.json ├── package.json ├── privacy-policy.css ├── privacy-policy.html ├── privacypolicy.html ├── readme.md ├── resume.html ├── resume2.js ├── resume_tips.html ├── script.js ├── signup.html ├── style.css ├── styles.css └── templates ├── basic.html ├── basic.jpg ├── classic.html ├── classic.jpg ├── developer.html ├── developer.jpg ├── modern.html ├── modern.jpg └── templates.css /.env.example: -------------------------------------------------------------------------------- 1 | YOUR API KEY = -------------------------------------------------------------------------------- /.github/FUNDING.yml: -------------------------------------------------------------------------------- 1 | # These are supported funding model platforms 2 | 3 | github: # Replace with up to 4 GitHub Sponsors-enabled usernames e.g., [user1, user2] 4 | patreon: # Replace with a single Patreon username 5 | open_collective: # Replace with a single Open Collective username 6 | ko_fi: # Replace with a single Ko-fi username 7 | tidelift: # Replace with a single Tidelift platform-name/package-name e.g., npm/babel 8 | community_bridge: # Replace with a single Community Bridge project-name e.g., cloud-foundry 9 | liberapay: # Replace with a single Liberapay username 10 | issuehunt: # Replace with a single IssueHunt username 11 | lfx_crowdfunding: # Replace with a single LFX Crowdfunding project-name e.g., cloud-foundry 12 | polar: # Replace with a single Polar username 13 | buy_me_a_coffee: # Replace with a single Buy Me a Coffee username 14 | thanks_dev: # Replace with a single thanks.dev username 15 | custom: # Replace with up to 4 custom sponsorship URLs e.g., ['link1', 'link2'] 16 | -------------------------------------------------------------------------------- /.github/ISSUE_TEMPLATE/ISSUE_TEMPLATE/bug_report.md: -------------------------------------------------------------------------------- 1 | --- 2 | name: Bug Report 🐞 3 | about: Reporting for any bug in the project. 4 | title: '🐛: ' 5 | labels: ["Up-for-Grabs ✋", "bug 🐛"] 6 | assignees: 7 | - '' 8 | 9 | --- 10 | 11 | :red_circle: **Title** : 12 | :red_circle: **Bug** : 13 | :red_circle: **Changes** : 14 | 15 | 16 | ### Screenshots 📷 17 | 18 | 19 | 20 | *********************************************************************** 21 | :white_check_mark: **To be Mentioned while taking the issue :** 22 | - Full name : 23 | - What is your participant role? (Mention the Open Source Program name. Eg. GSOC, GSSOC, SSOC, JWOC, etc.) 24 | 25 | *********************************************************************** 26 | Happy Contributing 🚀 27 | 28 | All the best. Enjoy your open source journey ahead. 😎 -------------------------------------------------------------------------------- /.github/ISSUE_TEMPLATE/ISSUE_TEMPLATE/enhancement-request.md: -------------------------------------------------------------------------------- 1 | --- 2 | name: Enhancement Request 🧑‍💻 3 | about: Improving any styling or documentation of the project. 4 | title: '🧑‍💻: ' 5 | labels: ["Up-for-Grabs ✋", "enhancement 🧑‍💻"] 6 | assignees: 7 | - '' 8 | 9 | --- 10 | 11 | :red_circle: **Title** : 12 | :red_circle: **Enhancement Aim** : 13 | :red_circle: **Changes** : 14 | 15 | 16 | ### Screenshots 📷 17 | 18 | 19 | 20 | *********************************************************************** 21 | :white_check_mark: **To be Mentioned while taking the issue :** 22 | - Full name : 23 | - What is your participant role? (Mention the Open Source Program name. Eg. GSOC, GSSOC, SSOC, JWOC, etc.) 24 | 25 | *********************************************************************** 26 | Happy Contributing 🚀 27 | 28 | All the best. Enjoy your open source journey ahead. 😎 -------------------------------------------------------------------------------- /.github/PULL_REQUEST_TEMPLATE.md: -------------------------------------------------------------------------------- 1 | # Pull Request for Resum-Resume 💡 2 | 3 | 4 | ## Issue Title : 5 | 6 | - **Info about the related issue (Aim of the project)** : 7 | - **Name:** 8 | - **GitHub ID:** 9 | - **Email ID:** 10 | 11 | 12 | 13 | 14 | Closes: #issue number that will be closed through this PR 15 | 16 | ### Describe the add-ons or changes you've made 📃 17 | 18 | Give a clear description of what have you added or modifications made 19 | 20 | ## Type of change ☑️ 21 | 22 | What sort of change have you made: 23 | 27 | - [ ] Bug fix (non-breaking change which fixes an issue) 28 | - [ ] New feature (non-breaking change which adds functionality) 29 | - [ ] Code style update (formatting, local variables) 30 | - [ ] Breaking change (fix or feature that would cause existing functionality to not work as expected) 31 | - [ ] This change requires a documentation update 32 | 33 | ## How Has This Been Tested? ⚙️ 34 | 35 | Describe how it has been tested 36 | Describe how have you verified the changes made 37 | 38 | ## Checklist: ☑️ 39 | 43 | - [ ] My code follows the guidelines of this project. 44 | - [ ] I have performed a self-review of my own code. 45 | - [ ] I have commented my code, particularly wherever it was hard to understand. 46 | - [ ] I have made corresponding changes to the documentation. 47 | - [ ] My changes generate no new warnings. 48 | - [ ] I have added things that prove my fix is effective or that my feature works. 49 | - [ ] Any dependent changes have been merged and published in downstream modules. -------------------------------------------------------------------------------- /.github/workflows/workflows/greetings.yml: -------------------------------------------------------------------------------- 1 | name: Greetings 🐦‍🔥 2 | on: [pull_request_target, issues] 3 | 4 | jobs: 5 | greeting: 6 | runs-on: ubuntu-latest 7 | permissions: 8 | issues: write 9 | pull-requests: write 10 | steps: 11 | - uses: actions/first-interaction@v1 12 | with: 13 | repo-token: ${{ secrets.GITHUB_TOKEN }} 14 | issue-message: "Hi there! Thanks for opening this issue. We appreciate your contribution to this open-source project. We aim to respond or assign your issue as soon as possible." 15 | pr-message: "Thank you, ${{ github.actor }}, for creating this pull request and contributing to Resum-Resume! 💗\n\n The maintainers will review this Pull Request and provide feedback as soon as possible! 😇\nWe appreciate your patience and contribution, Keep up the great work! 😀" -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # Ignore node_modules directory 2 | node_modules/ 3 | 4 | # Ignore build directories 5 | dist/ 6 | build/ 7 | 8 | # Ignore log files 9 | *.log 10 | 11 | # Ignore environment variables 12 | .env 13 | .env.local 14 | .env.*.local 15 | 16 | # Ignore OS-specific files 17 | .DS_Store 18 | Thumbs.db 19 | 20 | # Ignore IDE/editor settings 21 | .vscode/ 22 | .idea/ 23 | 24 | # Ignore package lock files 25 | 26 | yarn.lock 27 | 28 | # Ignore coverage reports 29 | coverage/ 30 | 31 | # Ignore compiled files 32 | *.out 33 | *.exe 34 | *.dll 35 | 36 | # Ignore temporary files 37 | *.tmp 38 | *.temp 39 | *.swp 40 | 41 | # Ignore dependency directories for Python 42 | __pycache__/ 43 | *.py[cod] 44 | -------------------------------------------------------------------------------- /CODE_OF_CONDUCT.md: -------------------------------------------------------------------------------- 1 | # Contributor Covenant Code of Conduct 2 | 3 | ## Our Pledge 4 | 5 | We, as contributors and maintainers of this project, pledge to make participation in our community a respectful, harassment-free, and inclusive experience for everyone. We commit to fostering a collaborative environment regardless of age, body size, disability, ethnicity, gender identity and expression, level of experience, nationality, personal appearance, race, religion, or sexual identity and orientation. 6 | 7 | ## Our Standards 8 | 9 | Examples of behavior that contributes to a positive environment include: 10 | 11 | - Using welcoming and inclusive language 12 | - Respecting differing viewpoints and experiences 13 | - Giving and gracefully accepting constructive feedback 14 | - Focusing on what is best for the community 15 | - Showing empathy and kindness toward other community members 16 | 17 | Examples of unacceptable behavior include: 18 | 19 | - The use of sexualized language or imagery and unwelcome sexual attention or advances 20 | - Trolling, insulting or derogatory comments, and personal or political attacks 21 | - Public or private harassment 22 | - Publishing others’ private information, such as a physical or electronic address, without explicit permission 23 | - Any other conduct which could reasonably be considered inappropriate in a professional setting 24 | 25 | ## Our Responsibilities 26 | 27 | Project maintainers are responsible for clarifying the standards of acceptable behavior and are expected to take appropriate and fair corrective action in response to any instances of unacceptable behavior. 28 | 29 | Project maintainers have the right and responsibility to remove, edit, or reject comments, commits, code, wiki edits, issues, and other contributions that do not align with this Code of Conduct. They may also temporarily or permanently ban any contributor for behaviors they deem inappropriate, threatening, offensive, or harmful. 30 | 31 | ## Scope 32 | 33 | This Code of Conduct applies to all project spaces, including but not limited to the repository, issue trackers, social media, and any other platform used by the project. It also applies to interactions both within project spaces and in public spaces when an individual is representing the project or its community. 34 | 35 | ## Enforcement 36 | 37 | Instances of abusive, harassing, or otherwise unacceptable behavior may be reported by contacting the project team at garimasingh11203@gmail.com. All complaints will be reviewed and investigated promptly and fairly. 38 | 39 | All project team members are obligated to maintain confidentiality regarding the reporter of an incident. Further details of specific enforcement policies may be posted separately. 40 | 41 | ## Enforcement Guidelines 42 | 43 | Project maintainers will follow these Community Impact Guidelines in determining the consequences for any action they deem in violation of this Code of Conduct: 44 | 45 | ### 1. Correction 46 | **Impact**: Use of inappropriate language or other behavior deemed unprofessional or unwelcome. 47 | **Consequence**: A private, written warning from project maintainers. Further violations may result in more severe consequences. 48 | 49 | ### 2. Warning 50 | **Impact**: A violation through a single serious incident or a pattern of inappropriate behavior. 51 | **Consequence**: A warning with consequences for continued behavior, including temporary or permanent removal from interactions with the community. 52 | 53 | ### 3. Temporary Ban 54 | **Impact**: A serious violation of community standards, including sustained inappropriate behavior. 55 | **Consequence**: A temporary ban from any form of interaction or public communication with the community. 56 | 57 | ### 4. Permanent Ban 58 | **Impact**: Demonstrating a pattern of sustained inappropriate behavior or harassment. 59 | **Consequence**: A permanent ban from the community. 60 | 61 | ## Attribution 62 | 63 | This Code of Conduct is adapted from the [Contributor Covenant](https://www.contributor-covenant.org), version 2.1, available at https://www.contributor-covenant.org/version/2/1/code_of_conduct.html. 64 | 65 | For answers to common questions about this code of conduct, see https://www.contributor-covenant.org/faq. 66 | -------------------------------------------------------------------------------- /CONTRIBUTING.md: -------------------------------------------------------------------------------- 1 | Here's the revised `CONTRIBUTING.md` file with your additional instructions: 2 | 3 | --- 4 | 5 | # Contributing to LinkedIn Resume Builder 🤝 6 | 7 | Thank you for your interest in contributing to the LinkedIn Resume Builder project! We appreciate your help in making this project better. Please follow the guidelines below to ensure a smooth contribution process. 8 | 9 | ## Table of Contents 📚 10 | 11 | - [Forking the Repository](#forking-the-repository) 12 | - [Setting Up the Development Environment](#setting-up-the-development-environment) 13 | - [Submitting Issues](#submitting-issues) 14 | - [Submitting Pull Requests](#submitting-pull-requests) 15 | - [Coding Style and Best Practices](#coding-style-and-best-practices) 16 | - [Running Tests](#running-tests) 17 | - [Code of Conduct](#code-of-conduct) 18 | 19 | ## Forking the Repository 🍴 20 | 21 | 1. Click on the **Fork** button at the top right corner of the repository page. 22 | 2. Clone your forked repository to your local machine: 23 | 24 | ```bash 25 | git clone https://github.com/your-username/linkedin-resume-builder.git 26 | ``` 27 | 28 | 3. Navigate to the project directory: 29 | 30 | ```bash 31 | cd linkedin-resume-builder 32 | ``` 33 | 34 | 35 | ## Submitting Issues 🐛 36 | 37 | If you find a bug or have a feature request, please submit an issue by following these steps: 38 | 39 | 1. Navigate to the **Issues** tab of the repository. 40 | 2. Click on the **New Issue** button. 41 | 3. Fill out the issue template with the necessary details. Please include: 42 | - A brief description of the issue. 43 | - Screenshots (if applicable) to illustrate the problem. 44 | 45 | ## Submitting Pull Requests 🔄 46 | 47 | To submit a pull request: 48 | 49 | 1. **Star the Repository** ⭐: If you find this project helpful, please star the repository to show your support! 50 | 51 | 2. Ensure your fork is up to date with the main repository: 52 | 53 | ```bash 54 | git checkout main 55 | git pull upstream main 56 | ``` 57 | 58 | 3. Create a new branch for your feature or fix: 59 | 60 | ```bash 61 | git checkout -b your-branch-name 62 | ``` 63 | 64 | 4. Make your changes and commit them: 65 | 66 | ```bash 67 | git add . 68 | git commit -m "Add a brief description of your changes" 69 | ``` 70 | 71 | 5. Push your branch to your forked repository: 72 | 73 | ```bash 74 | git push origin your-branch-name 75 | ``` 76 | 77 | 6. Go to the original repository and create a pull request. In your pull request: 78 | - Write a brief description of the changes. 79 | - Include before and after screenshots (if applicable). 80 | - Mention the issue number that your pull request addresses. 81 | 82 | 7. After your pull request is merged, please delete your forked repository and fork it again to avoid clashes when merging other issues. 83 | 84 | ## Coding Style and Best Practices 💻 85 | 86 | - Follow the [JavaScript Standard Style](https://standardjs.com/) for coding conventions. 87 | - Write clear and concise commit messages. 88 | - Ensure your code is well-documented and easy to understand. 89 | - Add screenshot in issue and pr description. 90 | 91 | 92 | 93 | 94 | ## Code of Conduct 📜 95 | 96 | By participating in this project, you agree to abide by the [Code of Conduct](CODE_OF_CONDUCT.md). Please treat everyone with respect and kindness. 97 | 98 | --- 99 | 100 | Thank you for contributing to the LinkedIn Resume Builder project! We appreciate your help in making it a better resource for everyone. If you have any questions, feel free to reach out! 101 | 102 | -------------------------------------------------------------------------------- /Faqs.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | FAQs - LinkedIn Resume Builder 8 | 9 | 10 | 11 | 12 | 114 | 115 | 116 | 117 |
118 | 119 | 120 | 121 | 122 | 123 | 124 | 131 | 132 |
133 | 134 | 135 | 136 |
137 |
138 |
139 |

Frequently Asked Questions

140 | 141 |
142 |
What is LinkedIn Resume Builder?
143 |

LinkedIn Resume Builder is a tool that allows users to create professional resumes quickly by importing their LinkedIn profile data and formatting it into a polished, job-ready document.

144 |
145 | 146 |
147 |
How can I use this tool?
148 |

You can use LinkedIn Resume Builder by signing in with your LinkedIn account, selecting the data you want to include in your resume, and choosing one of our pre-designed templates to generate your resume.

149 |
150 | 151 |
152 |
Is LinkedIn Resume Builder free to use?
153 |

Yes, LinkedIn Resume Builder offers free templates and tools to create your resume. However, premium templates and features may require a subscription.

154 |
155 | 156 |
157 |
Can I customize my resume?
158 |

Yes, you can customize your resume by editing the sections, changing the layout, and selecting different templates to fit your style and professional needs.

159 |
160 | 161 |
162 |
How do I download my resume?
163 |

Once you’ve completed your resume, you can download it in PDF format directly from the platform.

164 |
165 |
166 | Go Back to Home 167 |
168 | 169 |
170 | 171 | 172 | 173 | 174 | 177 | 178 | 205 | 206 | 207 | 208 | -------------------------------------------------------------------------------- /Hero Section.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GarimaSingh0109/Resum-Resume/55d9c52e2001c9d3ef4ee59cf7968646f4c19136/Hero Section.jpg -------------------------------------------------------------------------------- /Li.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GarimaSingh0109/Resum-Resume/55d9c52e2001c9d3ef4ee59cf7968646f4c19136/Li.gif -------------------------------------------------------------------------------- /RateMyResume.css: -------------------------------------------------------------------------------- 1 | body{ 2 | background: linear-gradient(135deg, #dedfe0, #e7ebf0); 3 | } 4 | .icons{ 5 | display: flex; 6 | align-items: center; 7 | } 8 | .icons i{ 9 | margin-left: 1.5rem; 10 | } 11 | .icons p{ 12 | display: inline; 13 | color: white; 14 | font-size: 2.3rem; 15 | margin-left: 1rem; 16 | line-height: 2.3rem; 17 | } 18 | .hero-section { 19 | padding: 60px 20px; 20 | text-align: center; 21 | width: 100vw; 22 | height: 70vh; 23 | position: relative; 24 | } 25 | 26 | .hero-content { 27 | width: 70%; 28 | margin: 0 auto; 29 | } 30 | 31 | .hero-content h1 { 32 | font-size: 4rem; 33 | color: #003d4d; 34 | margin-bottom: 15px; 35 | } 36 | 37 | .hero-content p { 38 | font-size: 1.2em; 39 | color: #003d4d; 40 | margin-bottom: 25px; 41 | line-height: 1.6; 42 | } 43 | 44 | .features-list { 45 | list-style: none; 46 | padding: 0; 47 | font-size: 1.1em; 48 | color: #003d4d; 49 | margin-bottom: 30px; 50 | } 51 | 52 | .features-list li { 53 | margin: 10px 0; 54 | } 55 | .fa-coins{ 56 | font-size: 2rem; 57 | color: rgb(246, 180, 0); 58 | } 59 | .hero-content p{ 60 | font: 2.5rem; 61 | font-weight: 500; 62 | line-height: 3rem; 63 | } 64 | .hero-content ul li{ 65 | font: 2.5rem; 66 | } 67 | .panel1{ 68 | width: 100%; 69 | height: auto; 70 | position: relative; 71 | display: flex; 72 | justify-content: center; 73 | } 74 | .ratingBox{ 75 | width: 90%; 76 | position: relative; 77 | border-radius: 3rem; 78 | border: 2px solid black 79 | } 80 | .ratingHead{ 81 | width: 100%; 82 | height: 5rem; 83 | display: flex; 84 | position: relative; 85 | } 86 | .myrating{ 87 | width: 50%; 88 | height: 100%; 89 | display: flex; 90 | justify-content: center; 91 | align-items: center; 92 | background-color: gray; 93 | border-radius: 3rem 0 0 0; 94 | border-right: 1px solid white; 95 | border-bottom: 2px solid black; 96 | cursor: pointer; 97 | } 98 | .ratingboardhead{ 99 | width: 50%; 100 | height: 100%; 101 | display: flex; 102 | justify-content: center; 103 | align-items: center; 104 | background-color: blue; 105 | border-radius: 0 3rem 0 0; 106 | border-left: 1px solid white; 107 | border-bottom: 2px solid black; 108 | cursor: pointer; 109 | } 110 | .ratingHead h1{ 111 | color: white; 112 | } 113 | .rating{ 114 | width: 100%; 115 | min-height: 50vh; 116 | padding: 3rem; 117 | border-radius: 0 0 3rem 3rem; 118 | display: flex; 119 | justify-content: center; 120 | align-items: center; 121 | } 122 | .ratingboard{ 123 | width: 100%; 124 | min-height: 50vh; 125 | padding: 3rem; 126 | position: relative; 127 | display: flex; 128 | gap: 2rem; 129 | justify-content: space-evenly; 130 | } 131 | .card{ 132 | width: 30%; 133 | height: auto; 134 | background-color: #003d4d; 135 | border-radius: 2rem; 136 | padding: 0 2rem; 137 | position: relative; 138 | color: white; 139 | display: flex; 140 | flex-direction: column; 141 | justify-content: space-evenly; 142 | align-items: center; 143 | } 144 | .card img{ 145 | width: 100%; 146 | height: 50%; 147 | object-fit: cover; 148 | object-position: top; 149 | border-radius: 2rem; 150 | } 151 | .card .personinfo{ 152 | text-align: center; 153 | display: flex; 154 | flex-direction: column; 155 | gap: 10px; 156 | } 157 | .card h2{ 158 | font-size: 1.7rem; 159 | font-weight: 700; 160 | } 161 | .card h3{ 162 | font: 1.3rem; 163 | font-weight: 400; 164 | } 165 | .card .star-rating{ 166 | display: flex; 167 | justify-content: space-evenly; 168 | align-items: center; 169 | width: 100%; 170 | } 171 | .card .star-rating i{ 172 | font-size: 2.5rem; 173 | color: rgb(236, 236, 236); 174 | } 175 | .submitbtn{ 176 | background-color: blue; 177 | padding: 0.8rem 1.5rem; 178 | border-radius: 1rem; 179 | font-size: 1.3rem; 180 | font-weight: 600; 181 | border: 2px solid white; 182 | cursor: pointer; 183 | &:hover{ 184 | background-color: rgb(0, 0, 198); 185 | } 186 | } 187 | form { 188 | background-color: #003d4d; 189 | padding: 20px; 190 | border-radius: 8px; 191 | box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1); 192 | width: 50%; 193 | display: flex; 194 | flex-direction: column; 195 | align-items: center; 196 | } 197 | form h2 { 198 | font-size: 1.7rem; 199 | text-align: center; 200 | color: white; 201 | } 202 | .form-group { 203 | margin-bottom: 15px; 204 | width: 100%; 205 | } 206 | label { 207 | display: block; 208 | margin-bottom: 5px; 209 | color: white; 210 | font-size: 1.3rem; 211 | } 212 | input[type="text"], 213 | input[type="file"] { 214 | width: 100%; 215 | padding: 8px; 216 | border: 1px solid white; 217 | border-radius: 4px; 218 | box-sizing: border-box; 219 | color: white; 220 | background-color: transparent; 221 | } 222 | button { 223 | width: 40%; 224 | padding: 10px; 225 | background-color: #4CAF50; 226 | color: white; 227 | border: none; 228 | border-radius: 4px; 229 | cursor: pointer; 230 | font-size: 16px; 231 | } 232 | button:hover { 233 | background-color: #45a049; 234 | } 235 | .download-button { 236 | padding: 5px 10px; 237 | background-color: #4CAF50; 238 | color: white; 239 | text-decoration: none; 240 | border-radius: 4px; 241 | font-size: 16px; 242 | cursor: pointer; 243 | } 244 | .download-button:hover { 245 | background-color: #37913b; 246 | } 247 | 248 | /* panel 2 css */ 249 | .panel2{ 250 | width: 100%; 251 | height: 80vh; 252 | position: relative; 253 | display: flex; 254 | flex-direction: column; 255 | justify-content: center; 256 | align-items: center; 257 | margin-top: 7rem; 258 | } 259 | .boxcontent{ 260 | width: 100%; 261 | height: 40%; 262 | text-align: center; 263 | display: flex; 264 | flex-direction: column; 265 | align-items: center; 266 | padding: 3rem; 267 | position: relative; 268 | border-bottom: 2px solid gainsboro; 269 | } 270 | .boxcontent h2{ 271 | color: #003d4d; 272 | font-size: 3rem; 273 | margin-bottom: 2rem; 274 | } 275 | .boxcontent p{ 276 | color: #003d4d; 277 | width: 70%; 278 | font-size: 1.7rem; 279 | margin-bottom: 1.3rem; 280 | } 281 | .boxcontent #p2{ 282 | font-size: 1.4rem; 283 | font-weight: 600; 284 | color: #4CAF50; 285 | } 286 | .keywordbox{ 287 | width: 90%; 288 | height: 100%; 289 | position: relative; 290 | border-radius: 3rem; 291 | border: 2px solid black; 292 | display: flex; 293 | flex-direction: column; 294 | } 295 | .mainbox{ 296 | width: 100%; 297 | height: 60%; 298 | display: flex; 299 | padding: 5rem; 300 | position: relative; 301 | justify-content: space-between; 302 | } 303 | .keyleft{ 304 | width: 45%; 305 | height: 100%; 306 | padding: 3rem; 307 | border: 2px solid #333; 308 | border-radius: 2rem; 309 | display: flex; 310 | flex-direction: column; 311 | justify-content: space-between; 312 | } 313 | .keyright{ 314 | width: 45%; 315 | height: 100%; 316 | padding: 3rem; 317 | border: 2px solid #333; 318 | border-radius: 2rem; 319 | position: relative; 320 | } 321 | .jobrole{ 322 | color: black; 323 | display: flex; 324 | justify-content: space-between; 325 | } 326 | .jobrole label{ 327 | color: #003d4d; 328 | font-size: 2rem; 329 | font-weight: 600; 330 | } 331 | #job-role{ 332 | font-size: 1.7rem; 333 | padding-left: 1.5rem; 334 | padding-right: 1.5rem; 335 | border-radius: 1rem; 336 | background-color: rgb(185, 185, 185); 337 | } 338 | .keyleft button{ 339 | width: 100%; 340 | } 341 | #keyword-suggestions{ 342 | width: 100%; 343 | height: 100%; 344 | display: flex; 345 | flex-direction: column; 346 | justify-content: space-between; 347 | } 348 | #keyword-suggestions p{ 349 | color: #003d4d; 350 | font-size: 1.5rem; 351 | line-height: 3rem; 352 | } 353 | #keyword-suggestions button{ 354 | background-color: blue; 355 | font-size: 1.7rem; 356 | width: auto; 357 | } -------------------------------------------------------------------------------- /RateMyResume.js: -------------------------------------------------------------------------------- 1 | // Initialize skill coins in localStorage if not already set 2 | if (!localStorage.getItem('skillCoins')) { 3 | localStorage.setItem('skillCoins', 0); 4 | } 5 | 6 | // Select the element to display the skill coins 7 | const coinsdata = document.querySelector('#SkillCoins'); 8 | 9 | // Function to get skill coins from localStorage 10 | const getSkillCoins = () => parseInt(localStorage.getItem('skillCoins'), 10); 11 | 12 | // Function to update the displayed skill coins on the page 13 | const updateCoinsDisplay = () => { 14 | coinsdata.textContent = getSkillCoins(); 15 | }; 16 | 17 | // Function to update skill coins in localStorage and refresh the display 18 | const updateCoins = (newAmount) => { 19 | localStorage.setItem('skillCoins', newAmount); 20 | updateCoinsDisplay(); 21 | }; 22 | 23 | // Update the displayed skill coins when the page loads 24 | updateCoinsDisplay(); 25 | 26 | // Listen for changes in localStorage across tabs/pages 27 | window.addEventListener('storage', (event) => { 28 | if (event.key === 'skillCoins') { 29 | updateCoinsDisplay(); 30 | } 31 | }); 32 | 33 | // Handle form submission and display alert 34 | document.getElementById('resumeForm').addEventListener('submit', function(event) { 35 | event.preventDefault(); 36 | 37 | const username = document.getElementById('username').value; 38 | const jobRole = document.getElementById('jobRole').value; 39 | const resume = document.getElementById('resume').files[0]; 40 | 41 | if (resume) { 42 | alert(`Your resume has been successfully uploaded and will appear on the Rating Board within 8 hours. Thank you!\nUsername: ${username}\nJob Role: ${jobRole}\nResume: ${resume.name}`); 43 | } else { 44 | alert('Please select a PDF file.'); 45 | } 46 | }); 47 | 48 | // Toggle rating board and my rating sections 49 | const myratinghead = document.querySelector('.myrating'); 50 | const ratingboardhead = document.querySelector('.ratingboardhead'); 51 | const rating = document.querySelector('.rating'); 52 | const ratingboard = document.querySelector('.ratingboard'); 53 | ratingboard.style.display = 'none'; 54 | 55 | ratingboardhead.addEventListener('click', () => { 56 | rating.style.display = 'none'; 57 | ratingboard.style.display = ''; 58 | ratingboardhead.style.backgroundColor = 'gray'; 59 | myratinghead.style.backgroundColor = 'blue'; 60 | }); 61 | 62 | myratinghead.addEventListener('click', () => { 63 | rating.style.display = ''; 64 | ratingboard.style.display = 'none'; 65 | myratinghead.style.backgroundColor = 'gray'; 66 | ratingboardhead.style.backgroundColor = 'blue'; 67 | }); 68 | 69 | // Star rating functionality 70 | const cards = document.querySelectorAll('.card'); 71 | cards.forEach(card => { 72 | const stars = card.querySelectorAll('.star'); 73 | let numstar = 0; 74 | 75 | stars.forEach(star => { 76 | star.addEventListener('click', () => { 77 | numstar = parseInt(star.getAttribute('data-rating')); 78 | stars.forEach((s, index) => { 79 | const starIcon = s.querySelector('i'); 80 | if (index < numstar) { 81 | starIcon.classList.remove('fa-regular'); 82 | starIcon.classList.add('fa-solid'); 83 | } else { 84 | starIcon.classList.remove('fa-solid'); 85 | starIcon.classList.add('fa-regular'); 86 | } 87 | }); 88 | }); 89 | }); 90 | }); 91 | 92 | // Update skill coins when submit buttons are clicked 93 | const submitButtons = document.querySelectorAll('.submitbtn'); 94 | submitButtons.forEach(button => { 95 | button.addEventListener('click', () => { 96 | if (!button.disabled) { 97 | const currentCoins = getSkillCoins(); 98 | updateCoins(currentCoins + 5); 99 | button.disabled = true; 100 | } 101 | }); 102 | }); 103 | 104 | // Panel 2 logic for showing keywords based on job role 105 | const keywords = { 106 | "Software Developer": ["JavaScript", "React", "Node.js", "API", "Agile", "Version Control"], 107 | "Data Analyst": ["SQL", "Python", "Excel", "Data Visualization", "Machine Learning", "Tableau"], 108 | "Graphic Designer": ["Adobe Photoshop", "Illustrator", "InDesign", "Branding", "Typography", "Creative Suite"] 109 | }; 110 | 111 | function showKeywords() { 112 | if (getSkillCoins() < 5) { 113 | alert("You don't have enough Skill coins to use this feature!"); 114 | } else { 115 | const role = document.getElementById("job-role").value; 116 | const suggestions = keywords[role] || []; 117 | const keywordDisplay = document.getElementById("keyword-suggestions"); 118 | 119 | if (suggestions.length) { 120 | keywordDisplay.innerHTML = ` 121 |

Suggested Keywords:
${suggestions.join(", ")}

122 | 123 | `; 124 | updateCoins(getSkillCoins() - 5); // Deduct 5 skill coins 125 | } else { 126 | keywordDisplay.innerHTML = "

No keywords available for this role.

"; 127 | } 128 | } 129 | } 130 | 131 | function copyKeywords() { 132 | const keywordText = document.getElementById("keyword-text").innerText; 133 | navigator.clipboard.writeText(keywordText) 134 | .then(() => alert("Keywords copied to clipboard!")) 135 | .catch(err => console.error("Failed to copy keywords:", err)); 136 | } 137 | -------------------------------------------------------------------------------- /RateMyResumeData/mohitresume.pdf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GarimaSingh0109/Resum-Resume/55d9c52e2001c9d3ef4ee59cf7968646f4c19136/RateMyResumeData/mohitresume.pdf -------------------------------------------------------------------------------- /Resume.css: -------------------------------------------------------------------------------- 1 | body { 2 | font-family: Arial, sans-serif; 3 | background-color: #f4f4f4; 4 | margin: 0; 5 | padding: 20px; 6 | } 7 | body{ 8 | background: linear-gradient(135deg, #dedfe0, #e7ebf0); 9 | } 10 | .icons{ 11 | display: flex; 12 | align-items: center; 13 | } 14 | .icons i{ 15 | margin-left: 1.5rem; 16 | } 17 | .icons p{ 18 | display: inline; 19 | color: white; 20 | font-size: 2.3rem; 21 | margin-left: 1rem; 22 | line-height: 2.3rem; 23 | } 24 | /* hero section */ 25 | .herosection{ 26 | height: 100vh; 27 | width: 100%; 28 | background-image: url(images/hero.jpg); 29 | background-position: center; 30 | background-repeat: no-repeat; 31 | background-size: cover; 32 | margin-bottom: 5rem; 33 | position: relative; 34 | } 35 | .herocontent{ 36 | height: 40%; 37 | display: flex; 38 | flex-direction: column; 39 | justify-content: center; 40 | align-items: center; 41 | position: relative; 42 | text-align: center; 43 | gap: 1.5rem; 44 | } 45 | .herocontent h1{ 46 | width: 60%; 47 | font-size: 5rem; 48 | font-weight: 800; 49 | color: white; 50 | margin-bottom: 0; 51 | border: 0; 52 | } 53 | .herocontent p{ 54 | width: 60%; 55 | font-size: 2rem; 56 | font-weight: 400; 57 | color: white; 58 | } 59 | .herostep{ 60 | height: 20%; 61 | display: flex; 62 | justify-content: space-evenly; 63 | align-items: center; 64 | } 65 | .heros{ 66 | background-color: #5cb85c; 67 | display: flex; 68 | justify-content: center; 69 | align-items: center; 70 | border-radius: 2rem; 71 | padding: 1.5rem 1.5rem; 72 | } 73 | .herostep h2{ 74 | font-size: 2rem; 75 | font-weight: 500; 76 | color: white; 77 | line-height: 2rem; 78 | margin: 0; 79 | line-height: 2.5rem; 80 | border: 0; 81 | } 82 | .herostep i{ 83 | font-size: 3rem; 84 | margin-right: 1rem; 85 | color: white; 86 | } 87 | .herobtn{ 88 | display: flex; 89 | height: 40%; 90 | justify-content: center; 91 | align-items: center; 92 | gap: 2.5rem; 93 | text-align: center; 94 | } 95 | .herobtn .button{ 96 | background-color: blue; 97 | font-size: 1.5rem; 98 | font-weight: 600; 99 | border-radius: 3rem; 100 | padding: 1.5rem; 101 | color: white; 102 | border: 2px solid white; 103 | cursor: pointer; 104 | } 105 | .herobtn .button:hover{ 106 | scale: 105%; 107 | } 108 | .herobtn #manulbtn{ 109 | background-color: rgb(74, 74, 74); 110 | } 111 | .panel1{ 112 | position: relative; 113 | } 114 | .panel2{ 115 | height: 100vh; 116 | width: 100%; 117 | display: flex; 118 | justify-content: center; 119 | align-items: center; 120 | flex-direction: column; 121 | gap: 3rem; 122 | } 123 | .panel2 h1{ 124 | font-size: 4rem; 125 | } 126 | .panel2 p{ 127 | font-size: 2rem; 128 | } 129 | /* progress bar section css */ 130 | .progressSec{ 131 | height: 15rem; 132 | width: 100%; 133 | position: relative; 134 | display: flex; 135 | justify-content: center; 136 | margin-bottom: 5rem; 137 | } 138 | .progress-bar { 139 | width: 70%; 140 | display: flex; 141 | align-items: center; 142 | justify-content: space-between; 143 | margin: 20px 0; 144 | } 145 | 146 | .step { 147 | display: flex; 148 | flex-direction: column; 149 | align-items: center; 150 | } 151 | 152 | .circle { 153 | width: 30px; 154 | height: 30px; 155 | border-radius: 50%; 156 | background-color: lightgray; 157 | display: flex; 158 | align-items: center; 159 | justify-content: center; 160 | font-size: 18px; 161 | font-weight: bold; 162 | color: #fff; 163 | } 164 | 165 | .line { 166 | width: 100px; 167 | height: 2px; 168 | background-color: lightgray; 169 | } 170 | 171 | .label { 172 | margin-top: 5px; 173 | font-size: 14px; 174 | } 175 | 176 | /* Active step */ 177 | .step.active .circle { 178 | background-color: #007bff; 179 | } 180 | 181 | @media (max-width: 768px) { 182 | .progress-bar { 183 | flex-direction: column; 184 | } 185 | 186 | .line { 187 | width: 2px; 188 | height: 50px; 189 | } 190 | } 191 | 192 | 193 | /* step 1 css */ 194 | .form-container { 195 | width: 90%; 196 | margin: auto; 197 | background: #f4f4f4; 198 | padding: 20px; 199 | border-radius: 8px; 200 | box-shadow: 0 0 10px rgba(0,0,0,0.1); 201 | } 202 | .pInfo{ 203 | display: flex; 204 | justify-content: space-between; 205 | position: relative; 206 | } 207 | .pInfoLeft{ 208 | width: 40%; 209 | } 210 | .pInfoRight{ 211 | width: 50%; 212 | } 213 | #profile{ 214 | height: 17rem; 215 | } 216 | #education-fields{ 217 | position: relative; 218 | display: flex; 219 | justify-content: space-between; 220 | gap: 2rem; 221 | flex-wrap: wrap; 222 | } 223 | .education-entry{ 224 | width: 40%; 225 | } 226 | #skillsinput{ 227 | width: 40%; 228 | } 229 | .experience-entry{ 230 | display: flex; 231 | justify-content: space-between; 232 | position: relative; 233 | } 234 | .expLeft{ 235 | display: flex; 236 | flex-direction: column; 237 | width: 40%; 238 | } 239 | .expRight{ 240 | width: 40%; 241 | } 242 | #expdes{ 243 | height: 25rem; 244 | } 245 | .achive{ 246 | display: flex; 247 | flex-direction: column; 248 | justify-content: space-between; 249 | position: relative; 250 | } 251 | .achive-entry{ 252 | display: flex; 253 | justify-content: space-between; 254 | } 255 | .achiveLeft{ 256 | width: 40%; 257 | } 258 | .achiveRight{ 259 | width: 40%; 260 | } 261 | .project-entry{ 262 | display: flex; 263 | justify-content: space-between; 264 | position: relative; 265 | } 266 | .projectLeft{ 267 | width: 40%; 268 | } 269 | .projectRight{ 270 | width: 40%; 271 | } 272 | #projectdesc{ 273 | height: 20rem; 274 | } 275 | #languages-input{ 276 | width: 40%; 277 | } 278 | #pinfodesc{ 279 | display: flex; 280 | justify-content: right; 281 | } 282 | #expdesc{ 283 | display: flex; 284 | justify-content: right; 285 | } 286 | #achivedesc{ 287 | display: flex; 288 | justify-content: right; 289 | } 290 | #projdesc{ 291 | display: flex; 292 | justify-content: right; 293 | } 294 | #limitwarning{ 295 | width: 90%; 296 | font-size: 1.15rem; 297 | color: red; 298 | align-self: center; 299 | text-align: center; 300 | } 301 | #dummy1{ 302 | opacity: 50%; 303 | } 304 | h2, h3 { 305 | color: #333; 306 | } 307 | h2{ 308 | font-size: 2.5rem; 309 | margin-bottom: 2rem; 310 | } 311 | h3{ 312 | font-size: 2rem; 313 | margin-bottom: 1rem; 314 | font-weight: 400; 315 | } 316 | 317 | .section { 318 | margin-bottom: 20px; 319 | } 320 | 321 | label { 322 | font-size: 1.5rem; 323 | display: block; 324 | margin-bottom: 5px; 325 | font-weight: bold; 326 | } 327 | input[type="text"], 328 | input[type="email"], 329 | input[type="tel"], 330 | input[type="url"], 331 | 332 | textarea { 333 | width: 100%; 334 | padding: 10px; 335 | margin-bottom: 10px; 336 | border: 1px solid #ccc; 337 | border-radius: 4px; 338 | } 339 | textarea { 340 | resize: vertical; 341 | } 342 | button { 343 | padding: 10px 15px; 344 | border: none; 345 | background-color: #007bff; 346 | color: white; 347 | border-radius: 4px; 348 | cursor: pointer; 349 | margin-top: 10px; 350 | transition: background-color 0.3s, transform 0.3s; /* Added transition for scaling effect */ 351 | } 352 | 353 | button:hover { 354 | background-color: #0056b3; 355 | transform: scale(1.05); /* Added scaling effect on hover */ 356 | } 357 | 358 | button:focus { 359 | outline: none; /* Remove default outline */ 360 | box-shadow: 0 0 0 3px rgba(0, 123, 255, 0.5); /* Add custom focus style */ 361 | } 362 | 363 | /* Step 2 CSS */ 364 | #step-2{ 365 | width: 90%; 366 | margin: auto; 367 | background: #f4f4f4; 368 | padding: 20px; 369 | border-radius: 8px; 370 | box-shadow: 0 0 10px rgba(0,0,0,0.1); 371 | } 372 | .template-section { 373 | display: flex; 374 | flex-wrap: wrap; /* Allow wrapping on smaller screens */ 375 | justify-content: space-around; 376 | margin-top: 20px; 377 | gap: 2rem; 378 | } 379 | 380 | .template-card { 381 | border: 1px solid #ccc; 382 | padding: 20px; 383 | border-radius: 10px; 384 | text-align: center; 385 | width: 25%; 386 | cursor: pointer; 387 | transition: transform 0.3s, box-shadow 0.3s; /* Added box-shadow transition */ 388 | } 389 | 390 | .template-card:hover { 391 | transform: scale(1.05); 392 | box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2); /* Added shadow on hover */ 393 | } 394 | 395 | .template-card img { 396 | max-width: 100%; 397 | height: auto; 398 | margin-bottom: 10px; 399 | } 400 | .template-card p{ 401 | font-size: 1.5rem; 402 | font-weight: 500; 403 | margin-top: 1rem; 404 | color: black; 405 | } 406 | .buttons { 407 | margin-top: 20px; 408 | display: flex; 409 | justify-content: space-between; 410 | } 411 | 412 | .buttons button { 413 | padding: 10px 20px; 414 | background-color: #007bff; 415 | color: white; 416 | border: none; 417 | border-radius: 5px; 418 | cursor: pointer; 419 | } 420 | 421 | .buttons button:hover { 422 | background-color: #0056b3; 423 | } 424 | .step1btns{ 425 | display: flex; 426 | justify-content: right; 427 | } 428 | .premium{ 429 | margin-top: 1rem; 430 | display: flex; 431 | justify-content: space-between; 432 | } 433 | #coinicon{ 434 | display: flex; 435 | justify-content: center; 436 | align-items: center; 437 | gap: 4px; 438 | } 439 | #coinicon p{ 440 | font-size: 2rem; 441 | margin: 0; 442 | } 443 | .fa-coins{ 444 | font-size: 2rem; 445 | color: rgb(246, 180, 0); 446 | } 447 | /* Step 3 Styles */ 448 | #step-3{ 449 | width: 90%; 450 | margin: auto; 451 | background: #f4f4f4; 452 | padding: 20px; 453 | border-radius: 8px; 454 | box-shadow: 0 0 10px rgba(0,0,0,0.1); 455 | } 456 | .step-section { 457 | padding: 20px; 458 | border: 1px solid #ccc; 459 | border-radius: 8px; 460 | background-color: #f9f9f9; 461 | margin-top: 20px; 462 | } 463 | 464 | #resume-display { 465 | margin-top: 20px; 466 | padding: 10px; 467 | border: 1px solid #ddd; 468 | border-radius: 8px; 469 | background-color: #fff; 470 | } 471 | 472 | #resume-display h1 { 473 | font-size: 2em; 474 | margin-bottom: 10px; 475 | } 476 | 477 | #resume-display h2 { 478 | font-size: 1.5em; 479 | margin: 15px 0 5px; 480 | } 481 | 482 | #resume-display h3 { 483 | font-size: 1.2em; 484 | margin: 10px 0 5px; 485 | } 486 | 487 | #resume-display p { 488 | margin: 5px 0; 489 | } 490 | 491 | /* Button Styles */ 492 | button { 493 | margin: 10px 5px; 494 | padding: 10px 15px; 495 | font-size: 1em; 496 | border: none; 497 | border-radius: 5px; 498 | cursor: pointer; 499 | } 500 | 501 | #prev-step-3 { 502 | background-color: #f0ad4e; /* Bootstrap warning color */ 503 | color: white; 504 | } 505 | 506 | #download-resume { 507 | background-color: #5cb85c; /* Bootstrap success color */ 508 | color: white; 509 | } 510 | .ui-autocomplete { 511 | max-height: 150px; 512 | overflow-y: auto; 513 | overflow-x: hidden; 514 | border: 1px solid #ddd; 515 | background-color: #fff; 516 | } 517 | -------------------------------------------------------------------------------- /assets/emily_johnson.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GarimaSingh0109/Resum-Resume/55d9c52e2001c9d3ef4ee59cf7968646f4c19136/assets/emily_johnson.jpg -------------------------------------------------------------------------------- /assets/instant resume.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GarimaSingh0109/Resum-Resume/55d9c52e2001c9d3ef4ee59cf7968646f4c19136/assets/instant resume.jpg -------------------------------------------------------------------------------- /assets/joao-ferrao-4YzrcDNcRVg-unsplash.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GarimaSingh0109/Resum-Resume/55d9c52e2001c9d3ef4ee59cf7968646f4c19136/assets/joao-ferrao-4YzrcDNcRVg-unsplash.jpg -------------------------------------------------------------------------------- /assets/john_smith.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GarimaSingh0109/Resum-Resume/55d9c52e2001c9d3ef4ee59cf7968646f4c19136/assets/john_smith.jpg -------------------------------------------------------------------------------- /assets/jondoe.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GarimaSingh0109/Resum-Resume/55d9c52e2001c9d3ef4ee59cf7968646f4c19136/assets/jondoe.jpg -------------------------------------------------------------------------------- /assets/securedata.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GarimaSingh0109/Resum-Resume/55d9c52e2001c9d3ef4ee59cf7968646f4c19136/assets/securedata.jpg -------------------------------------------------------------------------------- /assets/support.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GarimaSingh0109/Resum-Resume/55d9c52e2001c9d3ef4ee59cf7968646f4c19136/assets/support.jpg -------------------------------------------------------------------------------- /ats_score_finder.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Resume ATS Score Finder 7 | 8 | 9 | 10 | 61 | 62 | 63 |
64 |


65 |

Resume ATS Score Finder

66 |
67 | 68 |
69 |

Resume ATS Score Finder

70 | 71 | 72 | 73 | 74 | 75 | 76 | 77 | 78 | 79 | 80 | 81 |
ATS Compatibility Score: 0%
82 |
83 |
84 | 85 | 197 | 198 | 199 | 200 | -------------------------------------------------------------------------------- /backend/app.js: -------------------------------------------------------------------------------- 1 | const express = require('express'); 2 | const app = express(); 3 | 4 | const authRouter = require('./router/authRoute.js'); 5 | const databaseconnect = require('./config/databaseConfig.js'); 6 | const cookieParser = require('cookie-parser'); 7 | const cors = require('cors'); 8 | 9 | // connect to db 10 | databaseconnect(); 11 | 12 | app.use(express.json()); // Built-in middleware 13 | app.use(cookieParser()); // Third-party middleware 14 | 15 | app.use(cors({ origin: [process.env.CLIENT_URL], credentials: true })); //Third-party middleware 16 | 17 | // Auth router 18 | app.use('/auth', authRouter); 19 | 20 | app.use('/', (req, res) => { 21 | res.status(200).json({ data: 'JWTauth server ;)' }); 22 | }); 23 | 24 | module.exports = app; 25 | -------------------------------------------------------------------------------- /backend/config/databaseConfig.js: -------------------------------------------------------------------------------- 1 | const mongoose = require("mongoose"); 2 | require('dotenv').config(); 3 | const MONGODB_URL = 4 | process.env.MONGODB_URL || "mongodb://localhost:27017/my_database"; 5 | 6 | // mongoDb database connection 7 | const databaseconnect = () => { 8 | mongoose 9 | .connect(MONGODB_URL) 10 | .then((conn) => console.log(`connected to DB: ${conn.connection.host}`)) 11 | .catch((err) => console.log(err.message)); 12 | }; 13 | 14 | module.exports = databaseconnect; 15 | -------------------------------------------------------------------------------- /backend/controller/authController.js: -------------------------------------------------------------------------------- 1 | const userModel = require("../model/userSchema.js"); 2 | const bcrypt = require("bcrypt"); 3 | 4 | const emailValidator = require("email-validator"); 5 | 6 | /****************************************************** 7 | * @SIGNUP 8 | * @route /api/auth/signup 9 | * @method POST 10 | * @description singUp function for creating new user 11 | * @body name, email, password, confirmPassword 12 | * @returns User Object 13 | ******************************************************/ 14 | 15 | const signUp = async (req, res, next) => { 16 | const { name, email, password, confirmPassword } = req.body; 17 | 18 | /// every field is required 19 | if (!name || !email || !password || !confirmPassword) { 20 | return res.status(400).json({ 21 | success: false, 22 | message: "Every field is required" 23 | }); 24 | } 25 | 26 | //validate email using npm package "email-validator" 27 | const validEmail = emailValidator.validate(email); 28 | if (!validEmail) { 29 | return res.status(400).json({ 30 | success: false, 31 | message: "Please provide a valid email address 📩" 32 | }); 33 | } 34 | 35 | try { 36 | /// send password not match err if password !== confirmPassword 37 | if (password !== confirmPassword) { 38 | return res.status(400).json({ 39 | success: false, 40 | message: "password and confirm Password does not match ❌" 41 | }); 42 | } 43 | 44 | const userInfo = new userModel(req.body); 45 | 46 | // userSchema "pre" middleware functions for "save" will hash the password using bcrypt 47 | // before saving the data into the database 48 | const result = await userInfo.save(); 49 | return res.status(200).json({ 50 | success: true, 51 | data: result 52 | }); 53 | } catch (error) { 54 | /// send the message of the email is not unique. 55 | if (error.code === 11000) { 56 | return res.status(400).json({ 57 | success: false, 58 | message: `Account already exist with the provided email ${email} 😒` 59 | }); 60 | } 61 | 62 | return res.status(400).json({ 63 | message: error.message 64 | }); 65 | } 66 | }; 67 | 68 | /****************************************************** 69 | * @SIGNIN 70 | * @route /api/auth/signin 71 | * @method POST 72 | * @description verify user and send cookie with jwt token 73 | * @body email , password 74 | * @returns User Object , cookie 75 | ******************************************************/ 76 | 77 | const signIn = async (req, res, next) => { 78 | const { email, password } = req.body; 79 | 80 | // send response with error message if email or password is missing 81 | if (!email || !password) { 82 | return res.status(400).json({ 83 | success: false, 84 | message: "email and password are required" 85 | }); 86 | } 87 | 88 | try { 89 | // check user exist or not 90 | const user = await userModel 91 | .findOne({ 92 | email 93 | }) 94 | .select("+password"); 95 | 96 | // If user is null or the password is incorrect return response with error message 97 | if (!user || !(await bcrypt.compare(password, user.password))) { 98 | // bcrypt.compare returns boolean value 99 | return res.status(400).json({ 100 | success: true, 101 | message: "invalid credentials" 102 | }); 103 | } 104 | 105 | // Create jwt token using userSchema method( jwtToken() ) 106 | const token = user.jwtToken(); 107 | user.password = undefined; 108 | 109 | const cookieOption = { 110 | secure:true, 111 | maxAge: 24 * 60 * 60 * 1000, //24hr 112 | httpOnly: true // not able to modify the cookie in client side 113 | }; 114 | 115 | res.cookie("token", token, cookieOption); 116 | res.status(200).json({ 117 | success: true, 118 | data: user 119 | }); 120 | } catch (error) { 121 | return res.status(400).json({ 122 | success: false, 123 | message: error.message 124 | }); 125 | } 126 | }; 127 | 128 | 129 | /****************************************************** 130 | * @LOGOUT 131 | * @route /api/auth/logout 132 | * @method GET 133 | * @description Remove the token form cookie 134 | * @returns logout message and cookie without token 135 | ******************************************************/ 136 | 137 | const logout = async (req, res, next) => { 138 | try { 139 | const cookieOption = { 140 | expires: new Date(Date.now()), // current expiry date 141 | httpOnly: true // not able to modify the cookie in client side 142 | }; 143 | 144 | // return response with cookie without token 145 | res.cookie("token", null, cookieOption); 146 | res.status(200).json({ 147 | success: true, 148 | message: "Logged Out" 149 | }); 150 | } catch (error) { 151 | res.stats(400).json({ 152 | success: false, 153 | message: error.message 154 | }); 155 | } 156 | }; 157 | 158 | /****************************************************** 159 | * @GETUSER 160 | * @route /api/auth/user 161 | * @method GET 162 | * @description retrieve user data from mongoDb if user is valid(jwt auth) 163 | * @returns User Object 164 | ******************************************************/ 165 | 166 | const getUser = async (req, res, next) => { 167 | const userId = req.user.id; 168 | try { 169 | const user = await userModel.findById(userId); 170 | return res.status(200).json({ 171 | success: true, 172 | data: user 173 | }); 174 | } catch (error) { 175 | return res.status(400).json({ 176 | success: false, 177 | message: error.message 178 | }); 179 | } 180 | }; 181 | 182 | module.exports = { 183 | signUp, 184 | signIn, 185 | 186 | getUser, 187 | 188 | logout 189 | }; 190 | -------------------------------------------------------------------------------- /backend/index.js: -------------------------------------------------------------------------------- 1 | require('dotenv').config(); 2 | const PORT = process.env.PORT || 5000; 3 | 4 | 5 | const app = require('./app'); 6 | 7 | app.listen(PORT,()=>{ 8 | console.log(`server is listening at http://localhost:${PORT}`); 9 | }) -------------------------------------------------------------------------------- /backend/middleware/jwtAuth.js: -------------------------------------------------------------------------------- 1 | const JWT = require("jsonwebtoken"); 2 | 3 | // router level middleware function 4 | const jwtAuth = (req, res, next) => { 5 | 6 | // get cookie token(jwt token generated using json.sign()) form the request 7 | const token = ( req.cookies?.token) || null; 8 | 9 | // return response if there is no token(jwt token attached with cookie) 10 | if (!token) { 11 | return res.status(400).json({ success: false, message: "NOT authorized" }); 12 | } 13 | 14 | // verify the token 15 | try { 16 | const payload = JWT.verify(token, process.env.SECRET); 17 | req.user = { id: payload.id, email: payload.email }; 18 | } catch (error) { 19 | return res.status(400).json({ success: false, message: error.message }); 20 | } 21 | next(); 22 | }; 23 | 24 | module.exports = jwtAuth; 25 | -------------------------------------------------------------------------------- /backend/model/userSchema.js: -------------------------------------------------------------------------------- 1 | const mongoose = require('mongoose'); 2 | const { Schema } = mongoose; 3 | const crypto = require('crypto'); 4 | const bcrypt = require('bcrypt'); 5 | const JWT = require('jsonwebtoken'); 6 | 7 | const userSchema = new Schema( 8 | { 9 | name: { 10 | type: String, 11 | require: [true, 'user name is Required'], 12 | 13 | trim: true, 14 | }, 15 | email: { 16 | type: String, 17 | required: [true, 'user email is required'], 18 | unique: true, 19 | lowercase: true, 20 | unique: [true, 'already registered'], 21 | }, 22 | password: { 23 | type: String, 24 | select: false, 25 | }, 26 | forgotPasswordToken: { 27 | type: String, 28 | }, 29 | forgotPasswordExpiryDate: { 30 | type: Date, 31 | }, 32 | }, 33 | { timestamps: true } 34 | ); 35 | 36 | // Hash password before saving to the database 37 | userSchema.pre('save', async function (next) { 38 | // If password is not modified then do not hash it 39 | if (!this.isModified('password')) return next(); 40 | this.password = await bcrypt.hash(this.password, 10); 41 | return next(); 42 | }); 43 | 44 | // FIXME: Check if these methods are working as expected 45 | userSchema.methods = { 46 | //method for generating the jwt token 47 | jwtToken() { 48 | return JWT.sign( 49 | { id: this._id, email: this.email }, 50 | process.env.SECRET, 51 | { expiresIn: '24h' } // 24 hours 52 | ); 53 | }, 54 | 55 | //userSchema method for generating and return forgotPassword token 56 | getForgotPasswordToken() { 57 | const forgotToken = crypto.randomBytes(20).toString('hex'); 58 | //step 1 - save to DB 59 | this.forgotPasswordToken = crypto 60 | .createHash('sha256') 61 | .update(forgotToken) 62 | .digest('hex'); 63 | 64 | /// forgot password expiry date 65 | this.forgotPasswordExpiryDate = Date.now() + 20 * 60 * 1000; // 20min 66 | 67 | //step 2 - return values to user 68 | return forgotToken; 69 | }, 70 | }; 71 | 72 | const userModel = mongoose.model('user', userSchema); 73 | module.exports = userModel; 74 | -------------------------------------------------------------------------------- /backend/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "backend", 3 | "version": "1.0.0", 4 | "description": "", 5 | "main": "index.js", 6 | "scripts": { 7 | "start":"nodemon ./index.js", 8 | "test": "echo \"Error: no test specified\" && exit 1" 9 | }, 10 | "keywords": [], 11 | "author": "", 12 | "license": "ISC", 13 | "dependencies": { 14 | "bcrypt": "^5.1.1", 15 | "cookie-parser": "^1.4.6", 16 | "cors": "^2.8.5", 17 | "dotenv": "^16.4.5", 18 | "email-validator": "^2.0.4", 19 | "express": "^4.21.0", 20 | "jsonwebtoken": "^9.0.2", 21 | "mongoose": "^8.6.3", 22 | "nodemon": "^3.1.5" 23 | } 24 | } 25 | -------------------------------------------------------------------------------- /backend/router/authRoute.js: -------------------------------------------------------------------------------- 1 | const express = require("express"); 2 | const authRouter = express.Router(); 3 | const jwtAuth = require("../middleware/jwtAuth.js"); 4 | 5 | const { 6 | signUp, 7 | signIn, 8 | forgotPassword, 9 | resetPassword, 10 | getUser, 11 | logout 12 | } = require("../controller/authController.js"); 13 | 14 | authRouter.post("/signup", signUp); 15 | authRouter.post("/signin", signIn); 16 | 17 | 18 | authRouter.get("/user", jwtAuth, getUser); 19 | authRouter.get("/logout", jwtAuth, logout); 20 | 21 | module.exports = authRouter; 22 | -------------------------------------------------------------------------------- /boy.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GarimaSingh0109/Resum-Resume/55d9c52e2001c9d3ef4ee59cf7968646f4c19136/boy.png -------------------------------------------------------------------------------- /chatbot.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GarimaSingh0109/Resum-Resume/55d9c52e2001c9d3ef4ee59cf7968646f4c19136/chatbot.gif -------------------------------------------------------------------------------- /chatbot.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Resum Resume - Chat Bot 8 | 12 | 16 | 17 | 18 | 22 | 23 | 24 | 25 |
26 |
29 |
30 | Chat Bot 35 |
36 | 37 |
38 |
39 | How can I help you today? 40 |
41 |
46 |
47 |
48 | 63 |
64 | 71 | 90 | 91 | 92 |
93 |
94 |
95 | 96 | 109 | 110 | 117 | 118 | 360 | 366 | 367 | 368 | -------------------------------------------------------------------------------- /colorChoice.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Resum-Resume. 8 | 9 | 17 | 18 |

More Samples

19 | color5 20 | color6 21 | color7 22 | 23 | 24 | -------------------------------------------------------------------------------- /comment.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Comment Page 7 | 8 | 9 | 10 |
11 |

Comments

12 |
13 |
14 | 15 | 16 |
17 | 18 |
19 | 20 | 21 | 22 | -------------------------------------------------------------------------------- /contact.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Contact Us 7 | 8 | 9 | 10 | 11 |
12 |
13 |

Contact US

14 |
15 |
16 |
17 |
18 |

Find Us

19 |

Email: example@gmail.com

20 |

Phone:1234567891

21 |
22 |
23 |
24 |
25 |
26 | 27 | 28 |
29 | 30 |
31 | 32 | 33 |
34 | 35 | 36 |
37 |
38 | 39 | -------------------------------------------------------------------------------- /contributing.md: -------------------------------------------------------------------------------- 1 | 2 | # LinkedIn Resume Builder ✨ 3 | 4 | This project is a LinkedIn Resume Builder that allows users to generate professional resumes from their LinkedIn profiles in just a few clicks. The website is designed with a clean and responsive UI using Bootstrap, focusing on simplicity and ease of use. 5 | 6 | ## Features 🚀 7 | 8 | - **Easy-to-Use Interface:** A user-friendly interface allows users to effortlessly create a resume. 9 | - **Instant Resume Generation:** Quickly build a resume by entering your LinkedIn profile URL. 10 | - **Secure Data:** Personal information is protected through encrypted communication 🔒. 11 | - **Responsive Design:** The website is mobile-first and adjusts seamlessly to different screen sizes 📱. 12 | - **24/7 Support:** Support is available around the clock to assist users 💬. 13 | 14 | ## Project Structure 📁 15 | 16 | The website consists of the following key sections: 17 | 18 | - **Navbar:** A top navigation bar with links to the homepage, resume builder, sign-up, and login pages. 19 | - **Hero Section:** A CTA section encouraging users to start building their resume. 20 | - **Features Section:** Highlights core features of the platform. 21 | - **Testimonials Section:** Displays user feedback and testimonials to boost credibility. 22 | - **Footer:** A simple footer providing basic information about the website. 23 | 24 | ## Technologies Used 💻 25 | 26 | - **HTML5:** Structure of the webpage. 27 | - **CSS3:** Styling and layout, using Google Font Roboto for typography. 28 | - **Bootstrap 4.5:** Ensures responsiveness and aesthetic appeal. 29 | - **JavaScript/jQuery:** Handles dynamic behavior. 30 | 31 | ## Screenshots 📸 32 | 33 | - **Desktop and Mobile View:** Available to preview on both desktop and mobile screens. 34 | 35 | ## Getting Started 🏁 36 | 37 | ### Prerequisites 38 | 39 | - A modern web browser (Chrome, Firefox, Safari, etc.) 40 | - Internet connection to load external resources (Bootstrap, fonts) 41 | 42 | ### Installation 43 | 44 | 1. **Clone the repository:** 45 | ```bash 46 | git clone https://github.com/your-username/linkedin-resume-builder.git 47 | cd linkedin-resume-builder 48 | ``` 49 | 50 | 2. **Open the index.html file:** 51 | ```bash 52 | open index.html 53 | ``` 54 | 55 | ### File Structure 📂 56 | 57 | ```plaintext 58 | ├── index.html # Main homepage 59 | ├── resume.html # Resume builder page 60 | ├── signup.html # Sign-up page 61 | ├── login.html # Log-in page 62 | ├── about.html # About page 63 | ├── Hero Section.jpg # Image displayed in the hero section 64 | ├── styles.css # Custom CSS styles (inlined in HTML) 65 | ``` 66 | 67 | ## Developer Setup 🛠️ 68 | 69 | For developers who want to contribute: 70 | 71 | 1. Clone the repository: 72 | ```bash 73 | git clone https://github.com/your-username/linkedin-resume-builder.git 74 | cd linkedin-resume-builder 75 | ``` 76 | 77 | 2. Install necessary dependencies if applicable (e.g., Node.js, Python). 78 | 3. Run the development server: 79 | ```bash 80 | npm start 81 | ``` 82 | 83 | ## Contributing 🤝 84 | 85 | We welcome contributions in various forms, including code, documentation, and feedback. Here’s how you can get started: 86 | 87 | ### How to Contribute 88 | 89 | 1. **Fork the Repository** 90 | 91 | Navigate to the [GitHub repository](https://github.com/your-username/linkedin-resume-builder) and click **Fork** to create your copy. 92 | 93 | 2. **Clone Your Fork** 94 | 95 | ```bash 96 | git clone https://github.com/your-username/linkedin-resume-builder.git 97 | cd linkedin-resume-builder 98 | ``` 99 | 100 | 3. **Create a Branch** 101 | 102 | ```bash 103 | git checkout -b feature/your-feature-name 104 | ``` 105 | 106 | 4. **Make Changes** 107 | 108 | Implement changes or new features following the project's coding style. 109 | 110 | 5. **Commit Your Changes** 111 | 112 | ```bash 113 | git add . 114 | git commit -m "Add description of your changes" 115 | ``` 116 | 117 | 6. **Push to Your Branch** 118 | 119 | ```bash 120 | git push origin feature/your-feature-name 121 | ``` 122 | 123 | 7. **Open a Pull Request** 124 | 125 | In the original repository, click **Pull Requests** and submit a pull request with a detailed description of your changes. 126 | 127 | ### Reporting Issues 128 | 129 | If you encounter issues, please report them in the [Issues section](https://github.com/your-username/linkedin-resume-builder/issues) with a detailed description. 130 | 131 | ### Code of Conduct 132 | 133 | By participating in this project, you agree to adhere to a respectful and inclusive code of conduct. 134 | 135 | ## Usage 📄 136 | 137 | - **Home Page:** Introduces users to the service with a description and CTA button. 138 | - **Build Resume:** Users enter their LinkedIn URL to create a resume. 139 | - **Sign-Up/Login:** Users can create an account or log in to manage their resume. 140 | - **Features & Testimonials:** Displays platform features and user feedback. 141 | 142 | ## Responsive Design 📏 143 | 144 | This project uses Bootstrap’s grid system to ensure full responsiveness across screen sizes, with additional media queries for layout fine-tuning on mobile devices. 145 | 146 | ## Thank You! 147 | 148 | Thank you for contributing to the LinkedIn Resume Builder! Your contributions help us build a better tool for users. Happy coding! 149 | 150 | --- 151 | 152 | **Screenshot Discord Link:** [Join Discord](https://discord.gg/GJ5BfwVd) 153 | ``` 154 | 155 | Replace `your-username` in the GitHub links with the actual username if this will be published in your repository. This combined format keeps everything accessible in a single file for simplicity and easy access for contributors. 156 | -------------------------------------------------------------------------------- /cv.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 100 | 101 | 102 |
103 |

CV Templates

104 |
105 |
106 |
107 | CV Template 1 108 |
109 |
110 | CV Template 2 111 |
112 |
113 | CV Template 3 114 |
115 |
116 | CV Template 4 117 |
118 |
119 | CV Template 5 120 |
121 |
122 | CV Template 6 123 |
124 |
125 | CV Template 7 126 |
127 |
128 | CV Template 8 129 |
130 |
131 | CV Template 9 132 |
133 |
134 | CV Template 10 135 |
136 |
137 | CV Template 11 138 |
139 |
140 | CV Template 12 141 |
142 |
143 | CV Template 13 144 |
145 |
146 | CV Template 14 147 |
148 |
149 | CV Template 15 150 |
151 |
152 | CV Template 16 153 |
154 |
155 |
156 | 157 | 161 | 162 | 194 | 195 | 196 | -------------------------------------------------------------------------------- /feedback.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Feedback Page 7 | 13 | 20 | 21 | 22 | 287 | 288 | 289 |
290 |
291 | 292 | 293 |
294 |
295 |
296 |

How would you rate your overall experience?

297 |
298 | 302 | 306 | 310 | 314 | 318 |
319 |

320 | How satisfied are you overall with the support of our website? 321 |

322 |
323 | 0 324 | 2 325 | 4 326 | 6 327 | 8 328 | 10 329 |
330 | 331 | 335 |

When did you start using our learning platform?

336 | 352 | 360 | 361 |
362 |
363 |
364 | 365 | 405 | 406 | 413 | 414 | 415 | -------------------------------------------------------------------------------- /feedbackformimg.jpeg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GarimaSingh0109/Resum-Resume/55d9c52e2001c9d3ef4ee59cf7968646f4c19136/feedbackformimg.jpeg -------------------------------------------------------------------------------- /global.css: -------------------------------------------------------------------------------- 1 | * { 2 | margin: 0; 3 | padding: 0; 4 | box-sizing: border-box; 5 | 6 | } 7 | body { 8 | font-family: Arial, sans-serif; 9 | height: 100%; 10 | width: 100%; 11 | font-family: "Poppins", sans-serif; 12 | } 13 | 14 | 15 | .poppins-thin { 16 | font-family: "Poppins", sans-serif; 17 | font-weight: 100; 18 | font-style: normal; 19 | } 20 | 21 | .poppins-regular { 22 | font-family: "Poppins", sans-serif; 23 | font-weight: 400; 24 | font-style: normal; 25 | } 26 | -------------------------------------------------------------------------------- /images/Gemini_Generated_Image_52rg8r52rg8r52rg.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GarimaSingh0109/Resum-Resume/55d9c52e2001c9d3ef4ee59cf7968646f4c19136/images/Gemini_Generated_Image_52rg8r52rg8r52rg.jpg -------------------------------------------------------------------------------- /images/Gemini_Generated_Image_fx9dejfx9dejfx9d.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GarimaSingh0109/Resum-Resume/55d9c52e2001c9d3ef4ee59cf7968646f4c19136/images/Gemini_Generated_Image_fx9dejfx9dejfx9d.jpg -------------------------------------------------------------------------------- /images/Gemini_Generated_Image_ootrdvootrdvootr.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GarimaSingh0109/Resum-Resume/55d9c52e2001c9d3ef4ee59cf7968646f4c19136/images/Gemini_Generated_Image_ootrdvootrdvootr.jpg -------------------------------------------------------------------------------- /images/background-home.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GarimaSingh0109/Resum-Resume/55d9c52e2001c9d3ef4ee59cf7968646f4c19136/images/background-home.png -------------------------------------------------------------------------------- /images/favicon-removebg-preview.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GarimaSingh0109/Resum-Resume/55d9c52e2001c9d3ef4ee59cf7968646f4c19136/images/favicon-removebg-preview.png -------------------------------------------------------------------------------- /images/hero.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GarimaSingh0109/Resum-Resume/55d9c52e2001c9d3ef4ee59cf7968646f4c19136/images/hero.jpg -------------------------------------------------------------------------------- /images/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GarimaSingh0109/Resum-Resume/55d9c52e2001c9d3ef4ee59cf7968646f4c19136/images/logo.png -------------------------------------------------------------------------------- /images/logo.png.jpeg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GarimaSingh0109/Resum-Resume/55d9c52e2001c9d3ef4ee59cf7968646f4c19136/images/logo.png.jpeg -------------------------------------------------------------------------------- /images/sample-color1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GarimaSingh0109/Resum-Resume/55d9c52e2001c9d3ef4ee59cf7968646f4c19136/images/sample-color1.png -------------------------------------------------------------------------------- /images/sample-color2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GarimaSingh0109/Resum-Resume/55d9c52e2001c9d3ef4ee59cf7968646f4c19136/images/sample-color2.png -------------------------------------------------------------------------------- /images/sample-color3.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GarimaSingh0109/Resum-Resume/55d9c52e2001c9d3ef4ee59cf7968646f4c19136/images/sample-color3.png -------------------------------------------------------------------------------- /images/sample-color4.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GarimaSingh0109/Resum-Resume/55d9c52e2001c9d3ef4ee59cf7968646f4c19136/images/sample-color4.png -------------------------------------------------------------------------------- /images/sample-color5.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GarimaSingh0109/Resum-Resume/55d9c52e2001c9d3ef4ee59cf7968646f4c19136/images/sample-color5.png -------------------------------------------------------------------------------- /images/sample-color6.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GarimaSingh0109/Resum-Resume/55d9c52e2001c9d3ef4ee59cf7968646f4c19136/images/sample-color6.png -------------------------------------------------------------------------------- /images/sample-color7.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GarimaSingh0109/Resum-Resume/55d9c52e2001c9d3ef4ee59cf7968646f4c19136/images/sample-color7.png -------------------------------------------------------------------------------- /images/sample-resume1.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GarimaSingh0109/Resum-Resume/55d9c52e2001c9d3ef4ee59cf7968646f4c19136/images/sample-resume1.jpg -------------------------------------------------------------------------------- /images/sample-resume2.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GarimaSingh0109/Resum-Resume/55d9c52e2001c9d3ef4ee59cf7968646f4c19136/images/sample-resume2.jpg -------------------------------------------------------------------------------- /images/sample-resume3.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GarimaSingh0109/Resum-Resume/55d9c52e2001c9d3ef4ee59cf7968646f4c19136/images/sample-resume3.jpg -------------------------------------------------------------------------------- /images/sample-resume4.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GarimaSingh0109/Resum-Resume/55d9c52e2001c9d3ef4ee59cf7968646f4c19136/images/sample-resume4.jpg -------------------------------------------------------------------------------- /images/sample-resume5.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GarimaSingh0109/Resum-Resume/55d9c52e2001c9d3ef4ee59cf7968646f4c19136/images/sample-resume5.jpg -------------------------------------------------------------------------------- /images/sample-resume6.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GarimaSingh0109/Resum-Resume/55d9c52e2001c9d3ef4ee59cf7968646f4c19136/images/sample-resume6.jpg -------------------------------------------------------------------------------- /images/sample-resume7.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GarimaSingh0109/Resum-Resume/55d9c52e2001c9d3ef4ee59cf7968646f4c19136/images/sample-resume7.jpg -------------------------------------------------------------------------------- /images/sample-resume8.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GarimaSingh0109/Resum-Resume/55d9c52e2001c9d3ef4ee59cf7968646f4c19136/images/sample-resume8.jpg -------------------------------------------------------------------------------- /login.css: -------------------------------------------------------------------------------- 1 | /* Reset default margin and padding */ 2 | *, 3 | *::before, 4 | *::after { 5 | box-sizing: border-box; 6 | padding: 0; 7 | margin: 0; 8 | } 9 | a { 10 | text-decoration: none; 11 | color: inherit; 12 | } 13 | 14 | #menu-toggle { 15 | background: none; 16 | border: none; 17 | color: white; 18 | font-size: 1.5rem; 19 | cursor: pointer; 20 | margin-left: 15px; 21 | display: none; 22 | } 23 | 24 | .container { 25 | display: flex; 26 | flex-direction: column; 27 | align-items: center; 28 | justify-content: center; 29 | width: 90%; 30 | max-width: 500px; 31 | background: #fff; 32 | border-radius: 10px; 33 | margin: 20px auto; 34 | padding: 20px; 35 | box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15); 36 | margin-top: 5rem; 37 | margin-bottom: 5rem; 38 | } 39 | 40 | .forms-container { 41 | display: flex; 42 | flex-direction: column; 43 | align-items: left; 44 | padding: 2rem; 45 | width: 100%; 46 | min-height: 580px; 47 | } 48 | 49 | form { 50 | display: flex; 51 | flex-direction: column; 52 | gap: 1rem; 53 | width: 100%; 54 | } 55 | 56 | .title { 57 | text-align: center; 58 | margin: 20px 0; 59 | } 60 | 61 | .input-field { 62 | position: relative; 63 | display: flex; 64 | align-items: center; 65 | border: 2px solid #ccc; 66 | border-radius: 20px; 67 | width: 100%; 68 | padding: 0.5rem; 69 | margin-top: 15px; 70 | } 71 | 72 | .input-field i { 73 | color: #625e5e; 74 | margin-right: 10px; 75 | } 76 | 77 | .input-field input { 78 | font-size: 15px; 79 | width: 100%; 80 | padding: 0.75rem; 81 | border: none; 82 | outline: none; 83 | } 84 | 85 | .btn { 86 | background-color: #6e8efb; 87 | color: #fff; 88 | padding: 18px; 89 | font-weight: 600; 90 | border: none; 91 | border-radius: 18px; 92 | cursor: pointer; 93 | width: 60%; 94 | margin-left:95px; 95 | transition: background-color 0.3s ease; 96 | } 97 | 98 | .btn:hover { 99 | background-color: #a777e3; 100 | } 101 | 102 | /* Social Media */ 103 | .social-media { 104 | display: flex; 105 | justify-content: space-between; 106 | align-items: center; 107 | } 108 | 109 | .social-icon-frame { 110 | display: inline-flex; 111 | justify-content: center; 112 | align-items: center; 113 | border: 2px solid #333; 114 | border-radius: 50%; 115 | padding: 15px; 116 | margin: 5px; 117 | background-color: transparent; 118 | width: 45px; 119 | height: 45px; 120 | transition: transform 0.3s; 121 | } 122 | 123 | .social-icon:hover { 124 | transform: scale(1.5); 125 | } 126 | 127 | .social-icon { 128 | font-size: 22px; 129 | color: inherit; 130 | transition: none; 131 | } 132 | 133 | 134 | /* Responsive Styles */ 135 | @media (max-width: 768px) { 136 | nav ul { 137 | flex-direction: column; 138 | display: none; 139 | width: 100%; 140 | position: absolute; 141 | background-color: #00796b; 142 | top: 100%; 143 | left: 0; 144 | padding: 15px 0; 145 | z-index: 9999; 146 | } 147 | nav ul li { 148 | margin: 10px 0; 149 | text-align: center; 150 | } 151 | #menu-toggle { 152 | display: block; /* Show menu toggle button */ 153 | } 154 | 155 | .container { 156 | width: 100%; 157 | margin-top: 20px; 158 | } 159 | 160 | .forms-container { 161 | padding: 1.5rem; 162 | } 163 | } 164 | 165 | /* Footer */ 166 | .footer { 167 | background-color: #00796b; 168 | color: #ffffff; 169 | padding: 40px 20px; 170 | margin-top: 20px; 171 | } 172 | 173 | .footer-content { 174 | display: flex; 175 | flex-wrap: wrap; 176 | justify-content: space-between; 177 | max-width: 1200px; 178 | margin: 0 auto; 179 | } 180 | 181 | .footer-section { 182 | flex: 1; 183 | min-width: 200px; 184 | margin-bottom: 20px; 185 | } 186 | 187 | .footer-section h3 { 188 | font-size: 1.3rem; 189 | margin-bottom: 15px; 190 | } 191 | 192 | .footer-section ul { 193 | list-style-type: none; 194 | padding: 0; 195 | margin: 0; 196 | } 197 | 198 | .footer-section ul li { 199 | margin-bottom: 10px; 200 | } 201 | 202 | .footer-section ul li a { 203 | color: #ffffff; 204 | text-decoration: none; 205 | transition: color 0.3s; 206 | } 207 | 208 | .footer-section ul li a:hover { 209 | color: #b2dfdb; 210 | } 211 | 212 | .social-icons { 213 | display: flex; 214 | gap: 10px; 215 | } 216 | 217 | .social-icons a { 218 | color: #ffffff; 219 | font-size: 1.5rem; 220 | transition: color 0.3s; 221 | } 222 | 223 | .social-icons a:hover { 224 | color: #b2dfdb; 225 | } 226 | 227 | .footer-bottom { 228 | text-align: center; 229 | padding-top: 20px; 230 | font-size: 0.9rem; 231 | border-top: 1px solid rgba(255, 255, 255, 0.1); 232 | margin-top: 20px; 233 | color: #e0f2f1; 234 | } 235 | 236 | /* Responsive Footer Styles */ 237 | @media (max-width: 768px) { 238 | .footer-content { 239 | flex-direction: column; 240 | align-items: center; 241 | } 242 | 243 | .footer-section { 244 | width: 100%; 245 | text-align: center; 246 | margin-bottom: 30px; 247 | } 248 | 249 | .footer-section h3 { 250 | font-size: 1.2rem; 251 | } 252 | } 253 | -------------------------------------------------------------------------------- /login.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Register & Login 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 |
16 | 17 | 18 | 26 | 27 |
28 | 29 | 30 | 31 |

32 |
33 | 86 | 87 | 88 |
89 |
90 | 138 |
139 |
140 | 141 | 157 | 158 | 159 | 199 | 293 | 294 | 295 | 296 | 297 | 298 | -------------------------------------------------------------------------------- /login.js: -------------------------------------------------------------------------------- 1 | document.addEventListener("DOMContentLoaded", function () { 2 | const container = document.querySelector(".container"); 3 | const signUpBtn = document.getElementById("sign-up-btn"); 4 | const signInBtn = document.getElementById("sign-in-btn"); 5 | 6 | signUpBtn.addEventListener("click", () => { 7 | container.classList.add("show-signup"); 8 | }); 9 | 10 | signInBtn.addEventListener("click", () => { 11 | container.classList.remove("show-signup"); 12 | }); 13 | }); 14 | 15 | 16 | document.addEventListener("DOMContentLoaded", function () { 17 | const container = document.querySelector(".container"); 18 | const menuToggle = document.getElementById("menu-toggle"); 19 | const navMenu = document.getElementById("nav-menu"); 20 | 21 | // Toggle menu functionality 22 | menuToggle.addEventListener("click", () => { 23 | navMenu.classList.toggle("show-menu"); 24 | }); 25 | 26 | // Progress bar functionality 27 | window.addEventListener("scroll", () => { 28 | const scrollY = window.scrollY; 29 | const documentHeight = document.documentElement.scrollHeight - window.innerHeight; 30 | const scrollPercent = (scrollY / documentHeight) * 100; 31 | document.getElementById("progress-bar").style.width = `${scrollPercent}%`; 32 | }); 33 | }); 34 | 35 | -------------------------------------------------------------------------------- /package-lock.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "resum-resume", 3 | "version": "1.0.0", 4 | "lockfileVersion": 3, 5 | "requires": true, 6 | "packages": { 7 | "": { 8 | "name": "resum-resume", 9 | "version": "1.0.0", 10 | "license": "ISC" 11 | } 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "resum-resume", 3 | "version": "1.0.0", 4 | "description": "This project is a **LinkedIn Resume Builder** that allows users to generate professional resumes from their LinkedIn profiles in just a few clicks. The website is designed with a clean and responsive UI using **Bootstrap**, and it focuses on simplicity and ease of use. Users can sign up, log in, and create a polished resume using their LinkedIn URL.", 5 | "main": "script.js", 6 | "scripts": { 7 | "test": "echo \"Error: no test specified\" && exit 1" 8 | }, 9 | "keywords": [], 10 | "author": "", 11 | "license": "ISC" 12 | } 13 | -------------------------------------------------------------------------------- /privacy-policy.css: -------------------------------------------------------------------------------- 1 | body { 2 | font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; 3 | background-color: white; 4 | color: #333; 5 | line-height: 1.6; 6 | margin: 0; 7 | padding: 0; 8 | overflow: auto; 9 | } 10 | 11 | .header { 12 | background-color: #00424F; 13 | color: white; 14 | padding: 1rem 1%; 15 | text-align: center; 16 | justify-content: space-between; 17 | 18 | top: 0; 19 | left: 0; 20 | right: 0; 21 | z-index: 1000; 22 | } 23 | 24 | .content { 25 | max-width: 800px; 26 | margin: 20px auto; 27 | background: white; 28 | padding: 39px; 29 | padding-bottom: 114px; 30 | border-radius: 8px; 31 | box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.1); 32 | } 33 | 34 | .content h2 { 35 | color: #00424F; 36 | margin-top: 20px; 37 | font-size: 1.5rem; 38 | } 39 | 40 | .content p { 41 | margin: 10px 0; 42 | } 43 | 44 | .content ul { 45 | list-style-type: disc; 46 | margin: 10px 0 10px 20px; 47 | padding: 0; 48 | } 49 | 50 | .content li { 51 | margin-bottom: 10px; 52 | } 53 | 54 | .content a { 55 | color: #4A90E2; 56 | text-decoration: none; 57 | } 58 | 59 | .content a:hover { 60 | text-decoration: underline; 61 | } 62 | 63 | .footer { 64 | text-align: center; 65 | padding: 10px; 66 | background-color: #00424F; 67 | color: white; 68 | position: fixed; 69 | bottom: 0; 70 | width: 100%; 71 | } 72 | -------------------------------------------------------------------------------- /privacy-policy.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Privacy Policy 7 | 8 | 9 | 10 |
11 |

Privacy Policy

12 |
13 |
14 |

Introduction

15 |

We at Resum-Resume value your privacy and are committed to protecting your personal information. This privacy policy outlines how we collect, use, store, and share your information when you use our resume generation service.

16 | 17 |

Information We Collect

18 |

When you use our service, we may collect the following types of information:

19 | 23 | 24 |

How We Use Your Information

25 |

We use the information collected in the following ways:

26 | 31 | 32 |

Data Storage and Security

33 |

Your data is processed in real-time for the sole purpose of generating a downloadable resume. We do not store your LinkedIn profile information or any data entered in the resume generation process on our servers.

34 |

We implement industry-standard security measures to protect your information from unauthorized access, disclosure, alteration, or destruction. However, please note that no method of transmission over the internet is 100% secure, and we cannot guarantee absolute security.

35 | 36 |

Sharing Your Information

37 |

We do not sell, trade, or rent your personal information to third parties. Your data is used exclusively for generating the resume as requested. We may share non-personal, aggregated information with third-party analytics providers to help us understand how users engage with our website.

38 | 39 |

Your Rights

40 |

You have the following rights regarding your personal information:

41 | 46 | 47 |

Cookies and Tracking Technologies

48 |

We may use cookies and similar tracking technologies to collect and store information about your usage of our website. Cookies help us provide a better user experience by remembering your preferences and analyzing how our service is used. You can adjust your browser settings to disable cookies, but this may affect the functionality of our website.

49 | 50 |

Third-Party Links

51 |

Our website may contain links to third-party websites. Please be aware that we are not responsible for the privacy practices of these external sites. We encourage you to read the privacy policies of any third-party websites you visit.

52 | 53 |

Changes to This Policy

54 |

We reserve the right to update or modify this privacy policy at any time. Any changes will be effective immediately upon posting the revised policy on this page. We encourage you to review this privacy policy periodically to stay informed about how we are protecting your information.

55 | 56 |

Contact Us

57 |

If you have any questions, concerns, or feedback regarding this privacy policy or our practices, please contact us at support@resume.com. We are here to help and will do our best to address your inquiries promptly.

58 |
59 | 62 | 63 | 70 | 74 | 75 |
76 | 77 | 84 | 85 | 89 | 90 | 91 | -------------------------------------------------------------------------------- /privacypolicy.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Privacy Policy - LinkedIn Resume Builder 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 311 | 312 | 313 | 314 | 315 | 330 |
331 |
332 |
333 | 334 |

Introduction

335 |

336 | Welcome to Resum Resume. We are committed to protecting your privacy and ensuring that your personal information is handled responsibly. This Privacy Policy outlines how we collect, use, and protect your information when you visit our website and use our services. 337 |

338 |
339 | 340 |

Information We Collect

341 |

Personal Information

342 |

343 |

352 |

353 |

Non-Personal Information

354 |

355 |

363 |

364 |

How We Use Your Information

365 |

366 | We may use your information for the following purposes: 367 |

368 | 374 |

Third-Party Links

375 |

Our website may contain links to third-party websites. We do not control these sites and are not responsible for their content or privacy practices. We encourage you to review the privacy policies of any third-party sites you visit.

376 | 377 |

Data Security

378 |

We take reasonable measures to protect your information from unauthorized access, disclosure, alteration, and destruction. However, no method of transmission over the internet or electronic storage is 100% secure. While we strive to use commercially acceptable means to protect your personal information, we cannot guarantee its absolute security.

379 |

Changes to This Privacy Policy

380 |

381 | We may update this Privacy Policy from time to time. We will notify you of any changes by posting the new Privacy Policy on our website with a new effective date. We encourage you to review this Privacy Policy periodically for any updates. 382 |

383 |
384 |
385 |
386 | Go Back To Home. 387 |
388 |
389 |

Powered by Resume Builder © 2024

390 |
391 | 392 | 393 | -------------------------------------------------------------------------------- /readme.md: -------------------------------------------------------------------------------- 1 | 2 | # LinkedIn Resume Builder ✨ 3 | 4 | This project is a **LinkedIn Resume Builder** that allows users to generate professional resumes from their LinkedIn profiles in just a few clicks. The website is designed with a clean and responsive UI using **Bootstrap**, and it focuses on simplicity and ease of use. Users can sign up, log in, and create a polished resume using their LinkedIn URL. 5 | 6 |
7 | 8 | Screenshot 9 | 10 |
11 | 12 | --- 13 | 14 | **Discord Link:-** https://discord.gg/GJ5BfwVd 15 | 16 | ## Features 🚀 17 | 18 | - **Easy-to-Use Interface**: A user-friendly interface allows users to effortlessly create a resume. 19 | - **Instant Resume Generation**: Quickly build a resume by entering your LinkedIn profile URL. 20 | - **Secure Data**: Your personal information is protected through encrypted communication 🔒. 21 | - **Responsive Design**: The website is mobile-first and adjusts seamlessly to different screen sizes 📱. 22 | - **24/7 Support**: Support is available around the clock to assist users 💬. 23 | 24 | --- 25 | 26 | ## Project Structure 📁 27 | 28 | The website consists of the following key sections: 29 | 30 | 1. **Navbar**: A top navigation bar with links to the homepage, resume builder, sign-up, and login pages. 31 | 2. **Hero Section**: A call-to-action (CTA) section encouraging users to get started with building their resume. 32 | 3. **Features Section**: A section highlighting the core features of the platform. 33 | 4. **Testimonials Section**: A section displaying user feedback and testimonials to boost credibility. 34 | 5. **Footer**: A simple footer providing basic information about the website. 35 | 36 | --- 37 | 38 | ## Technologies Used 💻 39 | 40 | - **HTML5**: For the structure of the webpage. 41 | - **CSS3**: For styling and layout, using the Google Font **Roboto** for typography. 42 | - **Bootstrap 4.5**: To make the website responsive and aesthetically pleasing. 43 | - **JavaScript/jQuery**: To handle dynamic behavior (included via CDN). 44 | 45 | --- 46 | 47 | ## 📸 Screenshots 48 | 49 | **💻Desktop and📱Mobile View** 50 | 51 |
52 | First Image 53 | Second Image 54 |
55 | 56 | --- 57 | 58 | ## Getting Started 🏁 59 | 60 | ### Prerequisites 61 | 62 | - A modern web browser (Chrome, Firefox, Safari, etc.) 63 | - Internet connection to load external resources (Bootstrap, fonts) 64 | 65 | ### Installation 66 | 67 | 1. Clone the repository: 68 | 69 | ```bash 70 | git clone https://github.com/your-username/linkedin-resume-builder.git 71 | cd linkedin-resume-builder 72 | ``` 73 | 74 | 2. Open the `index.html` file in your preferred browser: 75 | 76 | ```bash 77 | open index.html 78 | ``` 79 | 80 | 3. Start using the LinkedIn Resume Builder. 81 | 82 | ## File Structure 📂 83 | 84 | ``` 85 | ├── index.html # Main homepage 86 | ├── resume.html # Resume builder page 87 | ├── signup.html # Sign-up page 88 | ├── login.html # Log-in page 89 | ├── about.html # About page 90 | ├── Hero Section.jpg # Image displayed in the hero section 91 | ├── styles.css # Custom CSS styles (inlined in HTML) 92 | ``` 93 | 94 | ### Developer Setup 🛠️ 95 | For developers who want to contribute: 96 | 97 | 1. Clone the repository: 98 | ```bash 99 | git clone https://github.com/your-username/linkedin-resume-builder.git 100 | cd linkedin-resume-builder 101 | ``` 102 | 2. Install necessary dependencies (if using Node.js, Python, etc.). 103 | 104 | 3. Run the development server: 105 | ```bash 106 | npm start # Or appropriate command 107 | ``` 108 | 109 | --- 110 | ### Contributing 🤝 111 | Contributions are welcome! Here’s how to get started: 112 | 113 | 1. Fork the repository. 114 | 2. Create a new branch: `git checkout -b feature/your-feature-name`. 115 | 3. Make your changes and commit them. 116 | 4. Push to the branch: `git push origin feature/your-feature-name`. 117 | 5. Open a pull request with a detailed description. 118 | 119 | 120 | ## Usage 📄 121 | 122 | 1. **Home Page**: Introduces users to the service with a description and a call-to-action button. 123 | 2. **Build Resume**: Users enter their LinkedIn URL to create a resume. 124 | 3. **Sign-Up/Login**: Users can create an account or log in to manage their resume. 125 | 4. **Features & Testimonials**: Displays the platform’s features and user feedback. 126 | 127 | ## Responsive Design 📏 128 | 129 | The project uses Bootstrap’s grid system to ensure the website is fully responsive across different screen sizes. Additional media queries are included for further fine-tuning the layout for mobile devices. 130 | 131 | ## License 📜 132 | 133 | This project is licensed under the MIT License. See the `LICENSE` file for more information. 134 | 135 | Thank you for visiting this...... 136 | -------------------------------------------------------------------------------- /script.js: -------------------------------------------------------------------------------- 1 | const toggleSwitch = document.getElementById('dark-mode-toggle'); 2 | 3 | // Check for saved user preference in local storage 4 | const currentTheme = localStorage.getItem('theme') ? localStorage.getItem('theme') : null; 5 | 6 | if (currentTheme) { 7 | document.body.classList.toggle('dark-mode', currentTheme === 'dark'); 8 | toggleSwitch.checked = currentTheme === 'dark'; 9 | } 10 | 11 | toggleSwitch.addEventListener('change', () => { 12 | document.body.classList.toggle('dark-mode'); 13 | // Save preference to local storage 14 | if (document.body.classList.contains('dark-mode')) { 15 | localStorage.setItem('theme', 'dark'); 16 | } else { 17 | localStorage.setItem('theme', 'light'); 18 | } 19 | }); 20 | 21 | const express = require('express'); 22 | const bodyParser = require('body-parser'); 23 | const cors = require('cors'); 24 | 25 | const app = express(); 26 | const PORT = 3000; 27 | 28 | let comments = []; 29 | 30 | app.use(cors()); 31 | app.use(bodyParser.json()); 32 | 33 | app.get('/comments', (req, res) => { 34 | res.json(comments); 35 | }); 36 | 37 | app.post('/comments', (req, res) => { 38 | const newComment = req.body.comment; 39 | comments.push(newComment); 40 | res.status(201).json(newComment); 41 | }); 42 | 43 | app.listen(PORT, () => { 44 | console.log(`Server is running on http://localhost:${PORT}`); 45 | }); 46 | 47 | document.addEventListener('DOMContentLoaded', () => { 48 | const commentForm = document.getElementById('comment-form'); 49 | const commentInput = document.getElementById('comment-input'); 50 | const commentsDiv = document.getElementById('comments'); 51 | 52 | // Load comments from the server 53 | fetch('http://localhost:3000/comments') 54 | .then(response => response.json()) 55 | .then(comments => { 56 | comments.forEach(comment => { 57 | const div = document.createElement('div'); 58 | div.textContent = comment; 59 | commentsDiv.appendChild(div); 60 | }); 61 | }); 62 | 63 | // Handle form submission 64 | commentForm.addEventListener('submit', (e) => { 65 | e.preventDefault(); 66 | const comment = commentInput.value; 67 | 68 | fetch('http://localhost:3000/comments', { 69 | method: 'POST', 70 | headers: { 71 | 'Content-Type': 'application/json' 72 | }, 73 | body: JSON.stringify({ comment }) 74 | }) 75 | .then(response => response.json()) 76 | .then(newComment => { 77 | const div = document.createElement('div'); 78 | div.textContent = newComment; 79 | commentsDiv.appendChild(div); 80 | commentInput.value = ''; // Clear the input 81 | }); 82 | }); 83 | 84 | }); 85 | 86 | // animations.js 87 | 88 | // Navbar Animation 89 | gsap.from(".navbar", { 90 | duration: 1, 91 | y: -50, 92 | opacity: 0, 93 | ease: "power2.out", 94 | delay: 0.5 95 | }); 96 | 97 | // Header Logo Animation 98 | gsap.from(".logo", { 99 | duration: 1, 100 | opacity: 0, 101 | x: -50, 102 | ease: "power2.out", 103 | delay: 0.7 104 | }); 105 | 106 | // Header Icons Animation 107 | gsap.from(".icons a", { 108 | duration: 1, 109 | opacity: 0, 110 | scale: 0, 111 | stagger: 0.2, 112 | ease: "back.out(1.7)", 113 | delay: 0.9 114 | }); 115 | 116 | // Home Section Content Animation 117 | gsap.from(".home .content h3", { 118 | duration: 1, 119 | opacity: 0, 120 | y: 30, 121 | ease: "power2.out", 122 | delay: 1.2 123 | }); 124 | 125 | gsap.from(".home .content p", { 126 | duration: 1, 127 | opacity: 0, 128 | y: 20, 129 | ease: "power2.out", 130 | delay: 1.4 131 | }); 132 | 133 | // Get Started Button Animation 134 | gsap.from(".home .content .btn", { 135 | duration: 1, 136 | opacity: 0, 137 | scale: 0, 138 | ease: "back.out(1.7)", 139 | delay: 1.6 140 | }); 141 | 142 | // Features Cards Animation 143 | gsap.from(".features-card", { 144 | scrollTrigger: { 145 | trigger: ".features", 146 | start: "top 75%", 147 | toggleActions: "play none none reverse" 148 | }, 149 | duration: 1, 150 | opacity: 0, 151 | y: 20, 152 | stagger: 0.2, 153 | ease: "power2.out" 154 | }); 155 | 156 | // Testimonials Animation 157 | gsap.from(".testimonial-card", { 158 | scrollTrigger: { 159 | trigger: ".testimonials", 160 | start: "top 75%", 161 | toggleActions: "play none none reverse" 162 | }, 163 | duration: 1, 164 | opacity: 0, 165 | y: 20, 166 | stagger: 0.2, 167 | ease: "power2.out" 168 | }); 169 | 170 | 171 | 172 | // var typed = new Typed('#newlogo', { 173 | // strings: ['EnhanCV.'], 174 | // typeSpeed: 50, 175 | // }); 176 | 177 | 178 | 179 | 180 | 181 | 182 | 183 | -------------------------------------------------------------------------------- /signup.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Sign Up - LinkedIn Resume Builder 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 19 | 20 | 27 | 28 | 29 | 30 | 144 | 145 | 146 | 147 |
148 | 149 | 150 | 158 | 159 |
160 | 161 | 162 | 163 |

164 |
165 | 218 | 219 | 220 |
221 | 222 |

Create Your Account

223 | 224 | 225 | 231 | 232 | 233 |
234 | 235 | 236 | 237 | 238 | 239 | 240 |
241 | 242 |
243 | 244 | 245 | 285 | 379 | 380 | 445 | 446 | 447 | 448 | 449 | -------------------------------------------------------------------------------- /style.css: -------------------------------------------------------------------------------- 1 | :root { 2 | --soft-teal: #003d4d; 3 | } 4 | 5 | * { 6 | margin: 0; 7 | padding: 0; 8 | box-sizing: border-box; 9 | font-family: Verdana, Geneva, Tahoma, sans-serif; 10 | outline: none; 11 | border: none; 12 | text-decoration: none; 13 | text-transform: capitalize; 14 | transition: .2s linear; 15 | } 16 | 17 | html { 18 | font-size: 62.5%; 19 | scroll-behavior: smooth; 20 | scroll-padding-top: 6rem; 21 | overflow-x: hidden; 22 | } 23 | 24 | section { 25 | padding: 2rem 9%; 26 | } 27 | 28 | .heading { 29 | text-align: center; 30 | font-size: 4rem; 31 | color: var(--dark-slate); 32 | /* Dark Slate color */ 33 | padding: 1rem; 34 | margin: 2rem 0; 35 | background: var(--deep-teal); 36 | /* Changed background to Deep Teal */ 37 | } 38 | 39 | .heading span { 40 | color: var(--soft-gold); 41 | /* Soft Gold for span */ 42 | } 43 | 44 | .btn { 45 | display: inline-block; 46 | margin-top: 1rem; 47 | border-radius: 5rem; 48 | background: var(--soft-gold); 49 | /* Soft Gold button background */ 50 | color: var(--dark-slate); 51 | /* Dark Slate text color */ 52 | padding: 0.9rem 3.5rem; 53 | cursor: pointer; 54 | font-size: 1.7rem; 55 | } 56 | 57 | .btn:hover { 58 | background: var(--deep-teal); 59 | /* Deep Teal on hover */ 60 | } 61 | 62 | .btn { 63 | display: inline-block; 64 | margin-top: 1rem; 65 | border-radius: 5rem; 66 | background: #ffffff; 67 | color: #fff; 68 | padding: 0.9rem 3.5rem; 69 | cursor: pointer; 70 | font-size: 1.7rem; 71 | background-color: #3f10ea; 72 | } 73 | 74 | .btn:hover { 75 | background: var(--purple); 76 | background-color: #f03c0b; 77 | color: white; 78 | } 79 | 80 | header { 81 | position: fixed; 82 | top: 0; 83 | left: 0; 84 | right: 0; 85 | z-index: 1000; 86 | display: flex; 87 | justify-content: space-between; 88 | align-items: center; 89 | padding: 15px 30px; 90 | background-color: var(--deep-teal); 91 | } 92 | 93 | .logo { 94 | font-size: 28px; 95 | font-weight: bold; 96 | transition: color 0.3s; 97 | color: var(--off-white); 98 | } 99 | 100 | .logo:hover { 101 | color: var(--soft-gold); 102 | transform: translateY(-2px); 103 | text-decoration: none; 104 | } 105 | 106 | .navbar { 107 | display: flex; 108 | justify-content: center; 109 | align-items: center; 110 | flex: 1; 111 | padding-top: 10px; 112 | } 113 | 114 | /* Links in navbar */ 115 | .navbar a { 116 | margin: 0 15px; 117 | text-decoration: none; 118 | color: var(--off-white); 119 | font-size: 18px; 120 | font-weight: 600; 121 | transition: color 0.3s; 122 | } 123 | 124 | .navbar a:hover { 125 | color: var(--soft-gold); 126 | } 127 | 128 | .auth-and-theme { 129 | display: flex; 130 | align-items: center; 131 | } 132 | 133 | #auth-links { 134 | display: flex; 135 | margin-right: 20px; 136 | } 137 | 138 | #auth-links a { 139 | margin-left: 15px; 140 | text-decoration: none; 141 | color: var(--off-white); 142 | font-size: 18px; 143 | font-weight: 600; 144 | transition: color 0.3s; 145 | } 146 | 147 | #auth-links a:hover { 148 | color: var(--soft-gold); 149 | } 150 | 151 | .hamburger{ 152 | display: none; 153 | } 154 | .dark-mod{ 155 | width: 20px; 156 | margin-top: -11px; 157 | cursor: pointer; 158 | } 159 | 160 | .dark-mode-toggle { 161 | margin-left: 15px; 162 | opacity: 0; 163 | } 164 | .menu-toggle{ 165 | opacity: 0; 166 | } 167 | 168 | .menu-icon { 169 | padding-top: 6px; 170 | font-size: 24px; 171 | cursor: pointer; 172 | color: var(--off-white); 173 | 174 | } 175 | 176 | label[for="toggler"] { 177 | font-size: 20px; 178 | cursor: pointer; 179 | margin-left: 10px; 180 | color: var(--off-white); 181 | } 182 | 183 | .mobile-navbar{ 184 | width: 100%; 185 | height: 290px; 186 | background-color: var(--deep-teal); 187 | position: fixed; 188 | display: none; 189 | justify-content: space-around; 190 | align-items: flex-start; 191 | z-index: 999; 192 | top: 71px; 193 | border-top: 2px solid wheat; 194 | transform: translateY(-100%); /* Initially hidden off-screen */ 195 | transition: transform 0.4s ease; /* Smooth transition */ 196 | } 197 | 198 | .mobile-navbar .main-links,.auth-links{ 199 | display: flex; 200 | flex-direction: column; 201 | } 202 | .mobile-navbar .main-links > a, .auth-links > a{ 203 | color: var(--off-white); 204 | margin: 10px; 205 | font-size: 24px; 206 | font-weight: bold; 207 | text-decoration: none; 208 | border: 1px dashed var(--soft-gold); 209 | padding: 10px; 210 | } 211 | 212 | 213 | @media (max-width: 900px) { 214 | .navbar, #auth-links{ 215 | display: none; 216 | } 217 | 218 | .hamburger{ 219 | display: block; 220 | } 221 | 222 | .mobile-navbar{ 223 | display: flex; 224 | } 225 | 226 | } 227 | 228 | 229 | .home { 230 | display: flex; 231 | align-items: center; 232 | min-height: 100vh; 233 | background: url(images/background-home.png) no-repeat; 234 | background-size: cover; 235 | background-position: center; 236 | animation: floatInFromRight 2s ease-out forwards; 237 | /* Image floats from right */ 238 | } 239 | 240 | .home { 241 | display: flex; 242 | align-items: center; 243 | min-height: 100vh; 244 | background: url(images/background-home.png) no-repeat; 245 | background-size: cover; 246 | background-position: center; 247 | min-height: 110vh; 248 | } 249 | 250 | /* Dark mode styles */ 251 | .dark-mode { 252 | background-color: #121212; 253 | color: #ffffff; 254 | } 255 | 256 | .home .content { 257 | max-width: 50rem; 258 | opacity: 0; 259 | /* Ensure the text is hidden initially */ 260 | animation: floatInFromTop 2s ease-out forwards; 261 | /* Text floats from top */ 262 | } 263 | 264 | .home .content h3, 265 | .home .content p, 266 | .home .content a { 267 | opacity: 0; 268 | /* Initially hidden */ 269 | animation: floatInFromTop 2s ease-out forwards; 270 | /* Text enters from the top */ 271 | animation-delay: 0.5s; 272 | /* Delay for a smooth entrance */ 273 | } 274 | 275 | .home .content p { 276 | font-size: 1.5rem; 277 | color: #999; 278 | padding: 1rem 0; 279 | line-height: 1.5; 280 | margin-bottom: 2rem; 281 | color: grey; 282 | } 283 | 284 | .home .content h3 { 285 | font-size: 5rem; 286 | color: var(--dark-slate); 287 | /* Changed from #333 to Dark Slate */ 288 | } 289 | 290 | .home .content span { 291 | font-size: 3.5rem; 292 | color: var(--soft-gold); 293 | /* Changed from var(--purple) to Soft Gold */ 294 | padding: 1rem 0; 295 | line-height: 1.5; 296 | } 297 | 298 | .home .content p { 299 | font-size: 1.5rem; 300 | color: #666; 301 | /* Changed from #999 to a darker gray for better readability */ 302 | padding: 1rem 0; 303 | line-height: 1.5; 304 | } 305 | 306 | @keyframes floatInFromTop { 307 | 0% { 308 | opacity: 0; 309 | transform: translateY(0); 310 | /* Starting position from above */ 311 | } 312 | 313 | 100% { 314 | opacity: 1; 315 | transform: translateY(0); 316 | /* Final position */ 317 | } 318 | } 319 | 320 | @keyframes floatInFromRight { 321 | 0% { 322 | opacity: 0; 323 | transform: translateX(50px); 324 | /* Starting position from the right */ 325 | } 326 | 327 | 100% { 328 | opacity: 1; 329 | transform: translateX(0); 330 | /* Final position */ 331 | } 332 | } 333 | 334 | /* footer section styles */ 335 | 336 | :root { 337 | --deep-teal: #003d4d; 338 | --off-white: #f8f9fa; 339 | --dark-slate: #2f4f4f; 340 | --soft-gold: #d9c79e; 341 | } 342 | 343 | .footer { 344 | width: 100%; 345 | background-color: var(--deep-teal); 346 | color: white; 347 | padding: 13px 0; 348 | } 349 | 350 | .footer-content { 351 | display: flex; 352 | flex-wrap: wrap; 353 | justify-content: space-around; 354 | 355 | } 356 | 357 | 358 | .footer .footer-section h3 { 359 | font-size: 18px; 360 | margin-bottom: 20px; 361 | font-weight: 600; 362 | color: #fff; 363 | border-bottom: 2px solid #3f10ea; 364 | padding-bottom: 10px; 365 | } 366 | 367 | .ul{ 368 | padding: 0; 369 | list-style: none; 370 | font-family: Verdana, Geneva, Tahoma, sans-serif; 371 | text-align: center; 372 | 373 | .ul { 374 | padding: 0; 375 | list-style: none; 376 | font-family: Verdana, Geneva, Tahoma, sans-serif; 377 | text-align: center; 378 | 379 | 380 | } 381 | 382 | .footer-bottom { 383 | text-align: center; 384 | color: #fff; 385 | font-size: 14px; 386 | margin: 0px; 387 | margin-top: 10px; 388 | } 389 | 390 | 391 | .footer .footer-section ul li a { 392 | 393 | color: rgb(88, 88, 88); 394 | 395 | color: #2f4f4f; 396 | text-decoration: none; 397 | transition: color 0.3s ease; 398 | } 399 | 400 | .footer .footer-section ul li a:hover { 401 | color: white; 402 | text-decoration: none; 403 | 404 | color: #3f10ea; 405 | } 406 | 407 | .footer .footer-section .social-icons a { 408 | margin-right: 10px; 409 | color: #2f4f4f; 410 | text-decoration: none; 411 | font-size: 18px; 412 | transition: color 0.3s ease; 413 | } 414 | 415 | .footer .footer-section .social-icons a:hover { 416 | color: #3f10ea; 417 | text-decoration: none; 418 | } 419 | 420 | .footer a { 421 | color: var(--soft-gold); 422 | text-decoration: none; 423 | font-size: 16px; 424 | } 425 | 426 | .social-icons { 427 | display: flex; 428 | justify-content: space-between; 429 | margin-top: 20px 430 | } 431 | 432 | .social-icons a:hover { 433 | color: var(--light-grey); 434 | transform: scale(1.2) translateY(-5px); 435 | } 436 | 437 | 438 | 439 | .footer a:hover { 440 | text-decoration: underline; 441 | } 442 | 443 | .footer-section h3 { 444 | margin-bottom: 14px; 445 | font-size: 28px; 446 | } 447 | 448 | /* footer section style ends */ 449 | 450 | 451 | /* media queries */ 452 | @media (max-width: 991px) { 453 | html { 454 | font-size: 55%; 455 | } 456 | 457 | header { 458 | padding: 2rem; 459 | background-color: 003d4d; 460 | } 461 | 462 | section { 463 | padding: 2rem; 464 | } 465 | 466 | .home { 467 | background-position: left; 468 | } 469 | 470 | } 471 | 472 | @media (max-width: 768px) { 473 | html .fa-bars { 474 | display: block; 475 | } 476 | 477 | header .navbar { 478 | position: absolute; 479 | top: 100%; 480 | left: 0; 481 | right: 0; 482 | background: #f9f9f9; 483 | /* Updated background to a softer light color */ 484 | border-top: 0.1rem solid rgba(0, 0, 0, 0.1); 485 | clip-path: polygon(0 0, 100% 0, 100% 0, 0 0); 486 | } 487 | 488 | header #toggler:checked~.navbar { 489 | clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%); 490 | } 491 | 492 | header .navbar a { 493 | margin: 1.5rem; 494 | padding: 1.5rem; 495 | background: #ffffff; 496 | /* Updated to a cleaner white */ 497 | border: 0.1rem solid rgba(0, 0, 0, 0.1); 498 | color: var(--dark-slate); 499 | /* Changed text color to Dark Slate */ 500 | display: block; 501 | } 502 | 503 | header .navbar a:hover { 504 | color: var(--soft-gold); 505 | /* Hover color set to Soft Gold */ 506 | } 507 | 508 | .home .content h3 { 509 | font-size: 5rem; 510 | } 511 | 512 | .home .content span { 513 | font-size: 2.5rem; 514 | } 515 | 516 | .icons-container .icons h3 { 517 | font-size: 2rem; 518 | } 519 | 520 | .icons-container .icons span { 521 | font-size: 1.7rem; 522 | } 523 | 524 | .footer-section h3 { 525 | font-size: 18px; 526 | } 527 | 528 | .footer a { 529 | font-size: 13px; 530 | } 531 | 532 | .footer-section { 533 | margin-bottom: 0; 534 | gap: 18px; 535 | } 536 | 537 | .footer-bottom { 538 | font-size: 12px; 539 | margin: 0px; 540 | margin-top: 8px; 541 | } 542 | 543 | 544 | } 545 | 546 | @media (max-width: 450px) { 547 | html { 548 | font-size: 50%; 549 | } 550 | 551 | .heading { 552 | font-size: 3rem; 553 | } 554 | 555 | 556 | .footer-section h3 { 557 | font-size: 14px; 558 | } 559 | 560 | .footer a { 561 | font-size: 11px; 562 | } 563 | 564 | .footer-section { 565 | margin-bottom: 0; 566 | 567 | } 568 | 569 | .footer-bottom { 570 | font-size: 10px; 571 | margin: 0px; 572 | margin-top: 5px; 573 | } 574 | } 575 | 576 | 577 | .tab:hover { 578 | background-color: rgba(0, 0, 0, 0.8); 579 | color: blue; 580 | } 581 | 582 | 583 | .tab.active { 584 | color: blue; 585 | font-weight: bold; 586 | } 587 | 588 | .navbar { 589 | position: relative; 590 | } 591 | 592 | #tabs { 593 | padding: 0; 594 | margin: 0; 595 | list-style: none; 596 | display: flex; 597 | } 598 | 599 | .tab { 600 | position: relative; 601 | cursor: pointer; 602 | padding: 10px 20px; 603 | font-size: 19px; 604 | color: black; 605 | 606 | 607 | border-radius: 4px; 608 | transition: background-color 0.3s; 609 | } 610 | 611 | .tab:hover { 612 | background-color: black; 613 | } 614 | 615 | .cursor { 616 | position: absolute; 617 | height: 24px; 618 | width: 24px; 619 | background: black; 620 | border-radius: 50%; 621 | pointer-events: none; 622 | transition: all 0.3s ease; 623 | opacity: 0; 624 | } 625 | 626 | /* Features section */ 627 | .features h2 { 628 | font-weight: 600; 629 | } 630 | 631 | .features-card img { 632 | width: 80%; 633 | height: 40%; 634 | object-fit: cover; 635 | } 636 | 637 | .features-card h3 { 638 | color: #003d4d; 639 | } 640 | 641 | .features-card p { 642 | margin-bottom: 0; 643 | color: grey; 644 | } 645 | 646 | /* testimonials features section */ 647 | .testimonials h2 { 648 | font-weight: 600; 649 | } 650 | 651 | .testimonial-card img { 652 | height: 9rem; 653 | width: 9rem; 654 | border: 0.3rem solid white; 655 | } 656 | 657 | .testimonial-card h3 { 658 | color: #003d4d; 659 | font-size: 2rem; 660 | } 661 | 662 | .testimonial-card p { 663 | color: grey; 664 | 665 | } 666 | 667 | /* Footer section */ 668 | .footer { 669 | background-color: #003d4d; 670 | padding-bottom: 2rem; 671 | } 672 | 673 | .footer-section h3 { 674 | font-size: 2.5rem; 675 | } 676 | 677 | .footer-section ul li { 678 | font-size: 1.5rem; 679 | font-weight: 500; 680 | } 681 | 682 | .footer-section ul li a { 683 | color: #000; 684 | } 685 | 686 | .footer-bottom p { 687 | font-size: 1.5rem; 688 | font-weight: 500; 689 | } 690 | 691 | .footer-bottom { 692 | display: flex; 693 | justify-content: center; 694 | align-content: center; 695 | } -------------------------------------------------------------------------------- /styles.css: -------------------------------------------------------------------------------- 1 | * { 2 | margin: 0; 3 | padding: 0; 4 | box-sizing: border-box; 5 | } 6 | body{ 7 | background-color: rgb(174, 168, 168); 8 | } 9 | .contact h2,h3{ 10 | max-width: 50rem; 11 | margin: 0 auto; 12 | text-align: center; 13 | margin-bottom: 2rem; 14 | } 15 | .top_header{ 16 | background-color: #aca7eb; 17 | height: 8rem 18 | } 19 | .top_header h2{ 20 | font-size: 4rem; 21 | font-weight: 490; 22 | padding-top: 30px; 23 | } 24 | 25 | .col{ 26 | max-width: 50rem; 27 | margin: 0 auto; 28 | text-align: center; 29 | margin-bottom: 1.5rem; 30 | } 31 | .contact_info{ 32 | margin-top: 7rem; 33 | position: relative; 34 | display: flex; 35 | flex-direction: column; 36 | justify-content: center; 37 | align-items: center; 38 | padding: 20px 30px; 39 | width: 52vw; 40 | height:22vh; 41 | background-color:black; 42 | border-radius: 0.8rem; 43 | border: 0.5px solid white; 44 | overflow: hidden; 45 | cursor: pointer; 46 | } 47 | .contact_info>h2{ 48 | margin-bottom: 20px; 49 | color: white; 50 | } 51 | .contact_info>p{ 52 | display: flex; 53 | align-items: center; 54 | gap:10px; 55 | margin-block: 5px; 56 | cursor:auto; 57 | color: white; 58 | } 59 | .contact_info p>i{ 60 | font-weight: 600; 61 | } 62 | .contact_info p>a{ 63 | color:white; 64 | } 65 | .contact_info::after{ 66 | content: ""; 67 | position: absolute; 68 | bottom: -100%; 69 | background: #aca7eb; 70 | width:100%; 71 | height: 100%; 72 | transition: 0.4s; 73 | z-index: 1; 74 | } 75 | .contact_info:hover.contact_info::after{ 76 | bottom: 0; 77 | } 78 | .contact_info:hover.contact_info h2, 79 | .contact_info:hover.contact_info p, 80 | .contact_info:hover.contact_info i, 81 | .contact_info:hover.contact_info a{ 82 | color: black; 83 | z-index: 2; 84 | } 85 | 86 | .contact form{ 87 | max-width: 50rem; 88 | margin: 0.9rem auto; 89 | text-align: center; 90 | margin-bottom: 2rem; 91 | } 92 | .contact form .input_box{ 93 | display: flex; 94 | justify-content: space-between; 95 | flex-wrap: wrap; 96 | } 97 | .contact form .input_box input, 98 | .contact form textarea{ 99 | width: 100%; 100 | padding: 1.2rem; 101 | font-size: 1rem; 102 | color: white; 103 | background-color:black; 104 | border-radius: .8rem; 105 | margin: 0.5rem 0; 106 | } 107 | .contact form .input_box input{ 108 | width: 49%; 109 | } 110 | .contact form textarea{ 111 | resize: none; 112 | } 113 | 114 | .contact form .btn{ 115 | text-align: center; 116 | margin-top: 2rem; 117 | cursor: pointer; 118 | width: 10rem; 119 | border-radius: 25px; 120 | border: 0.5px solid white; 121 | height: 2.5rem; 122 | font-size: 1.5rem; 123 | font-weight: 400; 124 | background-color: #111; 125 | color: white; 126 | transition: 0.5s; 127 | } 128 | .contact form .btn:hover{ 129 | background-color:blue; 130 | color: black; 131 | border: black; 132 | box-shadow: 0 0 5px 4px black; 133 | font-weight: 600; 134 | } -------------------------------------------------------------------------------- /templates/basic.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Basic Template 8 | 9 | 10 |
11 |

[Name]

12 |

[Profile]

13 |

14 |

Contact Information

15 |

Email: [Email]

16 |

Contact No: [Contact]

17 |

Location: [Location]

18 |
19 |

Education

20 |
21 | 22 |
23 | 24 |

Skills

25 |

[Skills]

26 | 27 |

Experience

28 |
29 | 30 |
31 | 32 |

Achievements and Certifications

33 |
34 | 35 |
36 | 37 |

Projects

38 |
39 | 40 |
41 |
42 | 43 | 44 | -------------------------------------------------------------------------------- /templates/basic.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GarimaSingh0109/Resum-Resume/55d9c52e2001c9d3ef4ee59cf7968646f4c19136/templates/basic.jpg -------------------------------------------------------------------------------- /templates/classic.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Classic Template 8 | 9 | 10 |
11 |

${name}

12 |
13 |
14 |

${profile}

15 |

Contact Information

16 |

Email: ${email}

17 |

Contact No: ${contact}

18 |

Location: ${location}

19 |

Skills

20 |

${skills}

21 |

Education

22 |
23 | ${educationHTML} 24 |
25 |
26 |
27 |
28 |

Experience

29 |
30 | ${experienceHTML} 31 |
32 | 33 |

Achievements and Certifications

34 |
35 | 36 |
37 | 38 |

Projects

39 |
40 | ${projectHTML} 41 |
42 |
43 |
44 |
45 | 78 | 79 | 80 | -------------------------------------------------------------------------------- /templates/classic.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GarimaSingh0109/Resum-Resume/55d9c52e2001c9d3ef4ee59cf7968646f4c19136/templates/classic.jpg -------------------------------------------------------------------------------- /templates/developer.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Develper Template 7 | 8 | 9 |
10 |
11 |
12 |

${name}

13 |

${profile}

14 |
15 |
16 |
17 |

Contact Info

18 |

Email: ${email}

19 |

Contact No: ${contact}

20 |

Location: ${location}

21 |
22 |
23 |
24 |

${githubid}

25 | 31 |

Most used Lang.

32 | 35 |

Top 5 Repos

36 | 39 |
40 |
41 |

Skills

42 |

${skills}

43 |
44 |
45 |
46 |

Education

47 |
48 | ${educationHTML} 49 |
50 |
51 |
52 |
53 |

Experience

54 |
55 | ${experienceHTML} 56 |
57 |
58 |
59 |
60 | 144 | 145 | 146 | -------------------------------------------------------------------------------- /templates/developer.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GarimaSingh0109/Resum-Resume/55d9c52e2001c9d3ef4ee59cf7968646f4c19136/templates/developer.jpg -------------------------------------------------------------------------------- /templates/modern.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | Modern Template 9 | 10 | 11 |
12 |

[Name]

13 |

[Profile]

14 |

Contact Information

15 |

Email: [Email]

16 |

Contact No: [Contact]

17 |

Location: [Location]

18 | 19 |

Education

20 |
21 | 22 |
23 | 24 |

Skills

25 |

[Skills]

26 | 27 |

Experience

28 |
29 | 30 |
31 | 32 |

Achievements and Certifications

33 |
34 | 35 |
36 | 37 |

Projects

38 |
39 | 40 |
41 |
42 | 79 | 80 | 81 | -------------------------------------------------------------------------------- /templates/modern.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GarimaSingh0109/Resum-Resume/55d9c52e2001c9d3ef4ee59cf7968646f4c19136/templates/modern.jpg -------------------------------------------------------------------------------- /templates/templates.css: -------------------------------------------------------------------------------- 1 | body { 2 | font-family: Arial, sans-serif; 3 | margin: 20px; 4 | padding: 0; 5 | } 6 | 7 | .resume { 8 | border: 1px solid #ddd; 9 | padding: 20px; 10 | border-radius: 8px; 11 | background-color: #f9f9f9; 12 | } 13 | 14 | h1, h2 { 15 | color: #333; 16 | } 17 | 18 | h1 { 19 | border-bottom: 2px solid #007bff; 20 | padding-bottom: 10px; 21 | } 22 | 23 | h2 { 24 | margin-top: 20px; 25 | border-bottom: 1px solid #ccc; 26 | padding-bottom: 5px; 27 | } 28 | 29 | p { 30 | margin: 5px 0; 31 | } 32 | 33 | .classic { 34 | background-color: #e9e9e9; 35 | } 36 | 37 | .modern { 38 | background-color: #fff; 39 | box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); 40 | } 41 | 42 | .template-card { 43 | cursor: pointer; 44 | } 45 | 46 | .template-card.selected { 47 | border: 2px solid #007bff; 48 | background-color: #e6f7ff; 49 | } 50 | .template-cards { 51 | display: flex; 52 | justify-content: space-around; 53 | margin: 20px 0; 54 | } 55 | 56 | .template-card { 57 | border: 1px solid #ddd; 58 | border-radius: 8px; 59 | padding: 10px; 60 | text-align: center; 61 | cursor: pointer; 62 | transition: 0.3s; 63 | } 64 | 65 | .template-card:hover { 66 | box-shadow: 0 0 10px rgba(0, 0, 0, 0.2); 67 | } 68 | 69 | /* Selected card styles */ 70 | .template-card.selected { 71 | border: 2px solid #007bff; /* Highlighted border */ 72 | background-color: #e6f7ff; /* Optional background for selection */ 73 | } 74 | --------------------------------------------------------------------------------