├── components ├── temp ├── saved-jobs.js ├── footer.css ├── skill.css ├── loading.html ├── firebase.js ├── skill.js ├── landing.html ├── events.js ├── events.css ├── homePage.css └── style.css ├── _redirects ├── OIP.jpg ├── OIPP.jpg ├── assets ├── admin.jpg ├── logo.webp ├── user1.jpg ├── seeker.webp ├── employer.webp ├── favicon.webp ├── homepage.webp ├── login-bg.webp ├── meta-logo.webp ├── regi_final.png ├── amazon-logo.webp ├── apple-logo.webp ├── github-logo.webp ├── google-logo.webp ├── insta-logo.webp ├── login_final.png ├── udemy-logo.webp ├── ChatGPT-logo.webp ├── linkedin-logo.webp ├── netflix-logo.webp ├── samsung-logo.webp ├── about-us-background.webp └── screenshots │ ├── user-role.webp │ ├── landing-page.webp │ ├── seeker-dashboard.webp │ └── employer-dashboard.webp ├── gssoc-logo.png ├── script.min.js ├── finpro_company.png ├── green_earth_company.png ├── healthplus_comapany.png ├── tech_solutions_company.jpg ├── job-application.js ├── .gitignore ├── .github ├── ISSUE_TEMPLATE │ ├── feature_request.md │ └── bug_report.md └── PULL_REQUEST_TEMPLATE.md ├── job-application.css ├── forgot-password.html ├── LICENSE ├── forgot-password.js ├── structure.txt ├── 404.html ├── from.html ├── CODE_OF_CONDUCT.md ├── response.html ├── forgot-password.css ├── application.html ├── skilltag.html ├── jobcards.html ├── jobapplication.html ├── style.min.css ├── README.md ├── masthead.s.html ├── dynamic.html ├── CONTRIBUTING.md ├── job-application.html ├── salary-insights.html ├── networking-events.html ├── skill-development.html ├── sitemap.html ├── interview-prep.html ├── tandc.html ├── faq.css ├── success-stories.html ├── open-source.html └── workplace-communication.html /components/temp: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /_redirects: -------------------------------------------------------------------------------- 1 | /* /404.html 404 -------------------------------------------------------------------------------- /OIP.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SurajSG23/Job-Portal/HEAD/OIP.jpg -------------------------------------------------------------------------------- /OIPP.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SurajSG23/Job-Portal/HEAD/OIPP.jpg -------------------------------------------------------------------------------- /assets/admin.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SurajSG23/Job-Portal/HEAD/assets/admin.jpg -------------------------------------------------------------------------------- /assets/logo.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SurajSG23/Job-Portal/HEAD/assets/logo.webp -------------------------------------------------------------------------------- /assets/user1.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SurajSG23/Job-Portal/HEAD/assets/user1.jpg -------------------------------------------------------------------------------- /gssoc-logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SurajSG23/Job-Portal/HEAD/gssoc-logo.png -------------------------------------------------------------------------------- /script.min.js: -------------------------------------------------------------------------------- 1 | function Redirect(){window.location.href="components/homepage.html"} 2 | -------------------------------------------------------------------------------- /assets/seeker.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SurajSG23/Job-Portal/HEAD/assets/seeker.webp -------------------------------------------------------------------------------- /finpro_company.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SurajSG23/Job-Portal/HEAD/finpro_company.png -------------------------------------------------------------------------------- /assets/employer.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SurajSG23/Job-Portal/HEAD/assets/employer.webp -------------------------------------------------------------------------------- /assets/favicon.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SurajSG23/Job-Portal/HEAD/assets/favicon.webp -------------------------------------------------------------------------------- /assets/homepage.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SurajSG23/Job-Portal/HEAD/assets/homepage.webp -------------------------------------------------------------------------------- /assets/login-bg.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SurajSG23/Job-Portal/HEAD/assets/login-bg.webp -------------------------------------------------------------------------------- /assets/meta-logo.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SurajSG23/Job-Portal/HEAD/assets/meta-logo.webp -------------------------------------------------------------------------------- /assets/regi_final.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SurajSG23/Job-Portal/HEAD/assets/regi_final.png -------------------------------------------------------------------------------- /assets/amazon-logo.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SurajSG23/Job-Portal/HEAD/assets/amazon-logo.webp -------------------------------------------------------------------------------- /assets/apple-logo.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SurajSG23/Job-Portal/HEAD/assets/apple-logo.webp -------------------------------------------------------------------------------- /assets/github-logo.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SurajSG23/Job-Portal/HEAD/assets/github-logo.webp -------------------------------------------------------------------------------- /assets/google-logo.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SurajSG23/Job-Portal/HEAD/assets/google-logo.webp -------------------------------------------------------------------------------- /assets/insta-logo.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SurajSG23/Job-Portal/HEAD/assets/insta-logo.webp -------------------------------------------------------------------------------- /assets/login_final.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SurajSG23/Job-Portal/HEAD/assets/login_final.png -------------------------------------------------------------------------------- /assets/udemy-logo.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SurajSG23/Job-Portal/HEAD/assets/udemy-logo.webp -------------------------------------------------------------------------------- /green_earth_company.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SurajSG23/Job-Portal/HEAD/green_earth_company.png -------------------------------------------------------------------------------- /healthplus_comapany.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SurajSG23/Job-Portal/HEAD/healthplus_comapany.png -------------------------------------------------------------------------------- /assets/ChatGPT-logo.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SurajSG23/Job-Portal/HEAD/assets/ChatGPT-logo.webp -------------------------------------------------------------------------------- /assets/linkedin-logo.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SurajSG23/Job-Portal/HEAD/assets/linkedin-logo.webp -------------------------------------------------------------------------------- /assets/netflix-logo.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SurajSG23/Job-Portal/HEAD/assets/netflix-logo.webp -------------------------------------------------------------------------------- /assets/samsung-logo.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SurajSG23/Job-Portal/HEAD/assets/samsung-logo.webp -------------------------------------------------------------------------------- /tech_solutions_company.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SurajSG23/Job-Portal/HEAD/tech_solutions_company.jpg -------------------------------------------------------------------------------- /assets/about-us-background.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SurajSG23/Job-Portal/HEAD/assets/about-us-background.webp -------------------------------------------------------------------------------- /assets/screenshots/user-role.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SurajSG23/Job-Portal/HEAD/assets/screenshots/user-role.webp -------------------------------------------------------------------------------- /assets/screenshots/landing-page.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SurajSG23/Job-Portal/HEAD/assets/screenshots/landing-page.webp -------------------------------------------------------------------------------- /assets/screenshots/seeker-dashboard.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SurajSG23/Job-Portal/HEAD/assets/screenshots/seeker-dashboard.webp -------------------------------------------------------------------------------- /assets/screenshots/employer-dashboard.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SurajSG23/Job-Portal/HEAD/assets/screenshots/employer-dashboard.webp -------------------------------------------------------------------------------- /job-application.js: -------------------------------------------------------------------------------- 1 | document.getElementById('jobApplicationForm').addEventListener('submit', function(e) { 2 | e.preventDefault(); 3 | 4 | const name = document.getElementById('fullname').value; 5 | 6 | const email = document.getElementById('email').value; 7 | 8 | document.getElementById('responseMessage').innerText = `Thank you, ${name}! Your application has been submitted.`; 9 | 10 | this.reset(); 11 | }); 12 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # Ignore environment files 2 | .env 3 | .env.* 4 | 5 | # Ignore sensitive JS config 6 | components/firebaseauth.js 7 | 8 | # Node modules 9 | node_modules/ 10 | 11 | # Build output 12 | dist/ 13 | build/ 14 | 15 | # System files 16 | .DS_Store 17 | Thumbs.db 18 | 19 | # Logs 20 | *.log 21 | 22 | # VS Code settings 23 | .vscode/ 24 | 25 | # OS generated files 26 | *.swp 27 | *.swo 28 | 29 | # Temp files 30 | temp/ 31 | 32 | # Firebase local emulators 33 | .firebase/ 34 | 35 | # Misc 36 | *.bak 37 | *.tmp 38 | 39 | # Ignore screenshots if not needed in repo 40 | # assets/screenshots/ -------------------------------------------------------------------------------- /.github/ISSUE_TEMPLATE/feature_request.md: -------------------------------------------------------------------------------- 1 | --- 2 | name: "✨ Feature Request" 3 | about: Suggest an idea for this project 4 | labels: enhancement 5 | --- 6 | 7 | **Is your feature request related to a problem? Please describe.** 8 | A clear and concise description of what the problem is. 9 | 10 | **Describe the solution you'd like** 11 | A clear and concise description of what you want to happen. 12 | 13 | **Describe alternatives you've considered** 14 | A clear and concise description of any alternative solutions or features you've considered. 15 | 16 | **Additional context** 17 | Add any other context or screenshots about the feature request here. 18 | -------------------------------------------------------------------------------- /components/saved-jobs.js: -------------------------------------------------------------------------------- 1 | 2 | 3 | const jobsContainer = document.querySelector(".jobs-container"); 4 | let savedJobs = JSON.parse(localStorage.getItem("savedJobs")) || []; 5 | 6 | if (savedJobs.length === 0) { 7 | jobsContainer.innerHTML = "

No jobs saved yet.

"; 8 | } else { 9 | savedJobs.forEach(job => { 10 | jobsContainer.innerHTML += ` 11 |
12 | 13 | 14 |

${job.position}

15 |

${job.salary}

16 |
17 |

${job.type}

18 |
19 | 20 |
`; 21 | }); 22 | } 23 | -------------------------------------------------------------------------------- /.github/ISSUE_TEMPLATE/bug_report.md: -------------------------------------------------------------------------------- 1 | --- 2 | name: "🐞 Bug Report" 3 | about: Report a bug to help us improve 4 | labels: bug 5 | --- 6 | 7 | **Describe the bug** 8 | A clear and concise description of what the bug is. 9 | 10 | **To Reproduce** 11 | Steps to reproduce the behavior: 12 | 1. Go to '...' 13 | 2. Click on '...' 14 | 3. Scroll down to '...' 15 | 4. See error 16 | 17 | **Expected behavior** 18 | A clear and concise description of what you expected to happen. 19 | 20 | **Screenshots** 21 | If applicable, add screenshots to help explain your problem. 22 | 23 | **Environment (please complete the following information):** 24 | - OS: [e.g. Windows, MacOS, Linux] 25 | - Browser [e.g. Chrome, Firefox] 26 | - Version [e.g. 22] 27 | 28 | **Additional context** 29 | Add any other context about the problem here. 30 | -------------------------------------------------------------------------------- /.github/PULL_REQUEST_TEMPLATE.md: -------------------------------------------------------------------------------- 1 | # Pull Request 2 | 3 | ## Description 4 | Please include a summary of the change and which issue is fixed. Also include relevant motivation and context. 5 | 6 | Fixes # (issue) 7 | 8 | ## Type of change 9 | - [ ] Bug fix 10 | - [ ] New feature 11 | - [ ] Breaking change 12 | - [ ] Documentation update 13 | 14 | ## Checklist 15 | - [ ] My code follows the style guidelines of this project 16 | - [ ] I have performed a self-review of my own code 17 | - [ ] I have commented my code, particularly in hard-to-understand areas 18 | - [ ] I have made corresponding changes to the documentation 19 | - [ ] My changes generate no new warnings 20 | - [ ] I have added tests that prove my fix is effective or that my feature works 21 | - [ ] New and existing unit tests pass locally with my changes 22 | - [ ] Any dependent changes have been merged and published in downstream modules 23 | -------------------------------------------------------------------------------- /job-application.css: -------------------------------------------------------------------------------- 1 | body { 2 | font-family: Arial, sans-serif; 3 | background-color: #f3f3f3; 4 | margin: 0; 5 | padding: 0; 6 | } 7 | 8 | .form-container { 9 | max-width: 600px; 10 | margin: 50px auto; 11 | background-color: #fff; 12 | padding: 30px; 13 | border-radius: 8px; 14 | box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); 15 | } 16 | 17 | 18 | h1 { 19 | text-align: center; 20 | margin-bottom: 20px; 21 | } 22 | 23 | form label { 24 | display: block; 25 | margin-top: 15px; 26 | font-weight: bold; 27 | } 28 | 29 | form input, form textarea { 30 | width: 100%; 31 | padding: 10px; 32 | margin-top: 5px; 33 | border: 1px solid #ccc; 34 | border-radius: 4px; 35 | } 36 | 37 | button { 38 | margin-top: 20px; 39 | width: 100%; 40 | padding: 12px; 41 | background-color: #007bff; 42 | color: white; 43 | border: none; 44 | font-size: 16px; 45 | cursor: pointer; 46 | border-radius: 4px; 47 | } 48 | 49 | button:hover { 50 | background-color: #0056b3; 51 | } 52 | 53 | #responseMessage { 54 | margin-top: 20px; 55 | text-align: center; 56 | color: green; 57 | } 58 | -------------------------------------------------------------------------------- /forgot-password.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Forgot Password | Job Junction 7 | 8 | 9 | 10 | 11 | 12 |
13 |
14 |

Forgot Password?

15 |

Enter your email address and we'll send you a link to reset your password.

16 |
17 |
18 | 19 |
20 | 21 | 22 |
23 | 24 |
25 | Back to Login 26 |
27 | 28 |
29 | 30 | 31 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2024 Suraj S G Dhanva 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /components/footer.css: -------------------------------------------------------------------------------- 1 | .footer { 2 | background-color: #2f66d4; /* Blue */ 3 | color: #fff; 4 | text-align: center; 5 | padding: 40px 20px; 6 | font-family: Arial, sans-serif; 7 | } 8 | 9 | .footer-tagline { 10 | margin-bottom: 30px; 11 | font-size: 18px; 12 | font-weight: 500; 13 | } 14 | 15 | .footer-links { 16 | display: flex; 17 | justify-content: center; 18 | gap: 80px; 19 | margin-bottom: 30px; 20 | flex-wrap: wrap; 21 | } 22 | 23 | .footer-column h4 { 24 | font-size: 18px; 25 | margin-bottom: 15px; 26 | } 27 | 28 | .footer-column ul { 29 | list-style: none; 30 | padding: 0; 31 | margin: 0; 32 | } 33 | 34 | .footer-column ul li { 35 | margin: 10px 0; 36 | } 37 | 38 | .footer-column ul li a { 39 | color: white; 40 | text-decoration: none; 41 | font-size: 14px; 42 | } 43 | 44 | .footer-column ul li a:hover { 45 | text-decoration: underline; 46 | } 47 | 48 | .footer-social { 49 | margin: 20px 0; 50 | } 51 | 52 | .footer-social a { 53 | color: white; 54 | /* font-size: 20px; */ 55 | margin: 0 10px; 56 | transition: color 0.3s ease; 57 | } 58 | 59 | .footer-social a:hover { 60 | color: #d1e3ff; 61 | } 62 | 63 | .footer-copy { 64 | margin-top: 20px; 65 | font-size: 14px; 66 | opacity: 0.9; 67 | } 68 | 69 | /* Responsive */ 70 | @media (max-width: 768px) { 71 | .footer-links { 72 | flex-direction: column; 73 | align-items: center; 74 | gap: 30px; 75 | } 76 | 77 | .footer-column h4 { 78 | font-size: 16px; 79 | } 80 | 81 | .footer-column ul li a { 82 | font-size: 13px; 83 | } 84 | } 85 | -------------------------------------------------------------------------------- /components/skill.css: -------------------------------------------------------------------------------- 1 | /* skill.css */ 2 | 3 | body { 4 | font-family: Arial, sans-serif; 5 | background-color: #f4f4f4; 6 | padding: 40px; 7 | } 8 | 9 | .skill-input-container { 10 | width: 100%; 11 | max-width: 500px; 12 | margin: 0 auto; 13 | position: relative; 14 | } 15 | 16 | #tag-container { 17 | display: flex; 18 | cursor: default; 19 | flex-wrap: wrap; 20 | gap: 8px; 21 | padding: 10px; 22 | border: 1px solid #ccc; 23 | border-radius: 6px; 24 | background-color: #fff; 25 | min-height: 50px; 26 | margin-top: 4px; 27 | 28 | } 29 | 30 | .tag { 31 | background-color: #007bff; 32 | color: white; 33 | padding: 6px 12px; 34 | border-radius: 12px; 35 | display: flex; 36 | align-items: center; 37 | font-size: 14px; 38 | } 39 | 40 | .tag .remove-tag { 41 | margin-left: 8px; 42 | cursor: pointer; 43 | font-weight: bold; 44 | padding-left: 4px; 45 | } 46 | 47 | #skillInput { 48 | width: 100%; 49 | padding: 12px; 50 | margin-top: 10px; 51 | font-size: 16px; 52 | border: 1px solid #ccc; 53 | border-radius: 4px; 54 | } 55 | 56 | .suggestions-list { 57 | list-style: none; 58 | margin: 0; 59 | padding: 0; 60 | border: 1px solid #ccc; 61 | max-height: 160px; 62 | overflow-y: auto; 63 | position: absolute; 64 | width: 100%; 65 | z-index: 10; 66 | background: white; 67 | border-top: none; 68 | pointer-events: auto !important; 69 | } 70 | 71 | .suggestions-list li { 72 | padding: 10px; 73 | font-size: 15px; 74 | cursor: pointer !important; /* Force cursor change */ 75 | user-select: none; 76 | pointer-events: auto; 77 | background-color: white; 78 | 79 | } 80 | 81 | .suggestions-list li:hover { 82 | background-color: #f1f1f1; 83 | } 84 | -------------------------------------------------------------------------------- /components/loading.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Job Portal - Loading Indicator 7 | 30 | 31 | 32 | 33 |

Job Listings

34 |
35 | 36 |
37 |
38 | 39 | 40 | 61 | 62 | 63 | 64 | -------------------------------------------------------------------------------- /forgot-password.js: -------------------------------------------------------------------------------- 1 | // To check the password 2 | function togglePassword(toggleElement) { 3 | const input = toggleElement.previousElementSibling; 4 | 5 | if (input.type === "password") { 6 | input.type = "text"; 7 | toggleElement.textContent = "👁️"; 8 | } else { 9 | input.type = "password"; 10 | toggleElement.textContent = "👁️"; 11 | } 12 | } 13 | // To check wheather is there any issue in password 14 | const resetbutton=document.getElementById("resetpass-button") 15 | resetbutton.addEventListener("click",function (e){ 16 | e.preventDefault(); 17 | 18 | const newPassword = document.getElementById("newPassword").value; 19 | const confirmPassword = document.getElementById("confirmPassword").value; 20 | 21 | if(newPassword.length<6){ 22 | alert("Password should be at least of 6 characters"); 23 | return; 24 | } 25 | if(newPassword!=confirmPassword){ 26 | alert("Password does not match"); 27 | return; 28 | } 29 | 30 | alert("Password has been reset successfully!"); 31 | window.location.href="login.html"; 32 | }); 33 | 34 | document.getElementById('forgotForm').addEventListener('submit', async function(e) { 35 | e.preventDefault(); 36 | const email = document.getElementById('forgotEmail').value.trim(); 37 | const messageDiv = document.getElementById('forgot-message'); 38 | messageDiv.textContent = ''; 39 | if (!email) { 40 | messageDiv.textContent = 'Please enter your email address.'; 41 | messageDiv.style.color = 'crimson'; 42 | return; 43 | } 44 | messageDiv.textContent = 'Sending reset link...'; 45 | messageDiv.style.color = '#2563eb'; 46 | 47 | try { 48 | // Simulate async request (replace with real API/Firebase call) 49 | await new Promise(res => setTimeout(res, 1200)); 50 | // Example: await firebase.auth().sendPasswordResetEmail(email); 51 | messageDiv.textContent = 'If this email is registered, a reset link has been sent!'; 52 | messageDiv.style.color = 'green'; 53 | } catch (err) { 54 | messageDiv.textContent = 'Failed to send reset link. Please try again.'; 55 | messageDiv.style.color = 'crimson'; 56 | } 57 | }); -------------------------------------------------------------------------------- /structure.txt: -------------------------------------------------------------------------------- 1 | . 2 | ├── 404.html 3 | ├── application.html 4 | ├── assets 5 | │   ├── about-us-background.webp 6 | │   ├── amazon-logo.webp 7 | │   ├── apple-logo.webp 8 | │   ├── ChatGPT-logo.webp 9 | │   ├── employer.webp 10 | │   ├── favicon.webp 11 | │   ├── github-logo.webp 12 | │   ├── google-logo.webp 13 | │   ├── homepage.webp 14 | │   ├── insta-logo.webp 15 | │   ├── linkedin-logo.webp 16 | │   ├── login-bg.webp 17 | │   ├── logo.webp 18 | │   ├── meta-logo.webp 19 | │   ├── netflix-logo.webp 20 | │   ├── samsung-logo.webp 21 | │   ├── screenshots 22 | │   │   ├── employer-dashboard.webp 23 | │   │   ├── landing-page.webp 24 | │   │   ├── seeker-dashboard.webp 25 | │   │   └── user-role.webp 26 | │   ├── seeker.webp 27 | │   └── udemy-logo.webp 28 | ├── CODE_OF_CONDUCT.md 29 | ├── companies.css 30 | ├── companies.html 31 | ├── components 32 | │   ├── about.css 33 | │   ├── about.html 34 | │   ├── employer.css 35 | │   ├── employer.html 36 | │   ├── employer.js 37 | │   ├── events.css 38 | │   ├── events.html 39 | │   ├── events.js 40 | │   ├── firebase.js 41 | │   ├── footer.css 42 | │   ├── homePage.css 43 | │   ├── homepage.html 44 | │   ├── saved-jobs.html 45 | │   ├── saved-jobs.js 46 | │   ├── seeker.css 47 | │   ├── seeker.html 48 | │   ├── seeker.js 49 | │   ├── skill.css 50 | │   ├── skill.js 51 | │   ├── style.css 52 | │   └── temp 53 | ├── ContactPage.html 54 | ├── CONTRIBUTING.md 55 | ├── faq.html 56 | ├── finpro_company.png 57 | ├── forgotPass.html 58 | ├── forgot-password.css 59 | ├── forgot-password.html 60 | ├── forgot-password.js 61 | ├── green_earth_company.png 62 | ├── gssoc-logo.png 63 | ├── healthplus_comapany.png 64 | ├── index.html 65 | ├── internships.html 66 | ├── job-application.css 67 | ├── job-application.html 68 | ├── job-application.js 69 | ├── LICENSE 70 | ├── login.html 71 | ├── masthead.html 72 | ├── networking-events.html 73 | ├── OIP.jpg 74 | ├── OIPP.jpg 75 | ├── open-source.html 76 | ├── package-lock.json 77 | ├── README.md 78 | ├── _redirects 79 | ├── resources.html 80 | ├── salary-insights.html 81 | ├── script.js 82 | ├── script.min.js 83 | ├── signup.html 84 | ├── skill-development.html 85 | ├── structure.txt 86 | ├── style.css 87 | ├── style.min.css 88 | ├── success-stories.html 89 | └── tech_solutions_company.jpg 90 | 91 | 4 directories, 85 files 92 | -------------------------------------------------------------------------------- /404.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Page Not Found | Job Junction 7 | 8 | 64 | 65 | 66 | 67 |
68 |
69 |
404
70 |

Oops! Page Not Found

71 |

72 | The page you are looking for might have been moved or doesn’t exist anymore. 73 |

74 | Go Back Home 75 |
76 |
77 | 78 | 79 | 80 | 81 | 82 | -------------------------------------------------------------------------------- /components/firebase.js: -------------------------------------------------------------------------------- 1 | import { initializeApp } from "https://www.gstatic.com/firebasejs/10.11.0/firebase-app.js"; 2 | import { getAuth, GoogleAuthProvider, signInWithPopup} from "https://www.gstatic.com/firebasejs/10.11.0/firebase-auth.js"; 3 | 4 | 5 | // Firebase Config 6 | const firebaseConfig = { 7 | apiKey: "YOUR_API_KEY", // Replace with your actual API key 8 | authDomain: "YOUR_AUTH_DOMAIN", // Replace with your actual auth domain 9 | projectId: "YOUR_PROJECT_ID", // Replace with your actual project ID 10 | storageBucket: "YOUR_STORAGE_BUCKET", // Replace with your actual storage bucket 11 | messagingSenderId: "YOUR_MESSAGING_SENDER_ID", // Replace with your actual messaging sender ID 12 | appId: "YOUR_APP_ID", // Replace with your actual app ID 13 | measurementId: "YOUR_MEASUREMENT_ID" // Replace with your actual measurement ID if needed 14 | }; 15 | 16 | // Initialize Firebase 17 | const app = initializeApp(firebaseConfig); 18 | const auth = getAuth(app); 19 | 20 | auth.languageCode = 'en'; 21 | const provider = new GoogleAuthProvider(); 22 | 23 | const googleLogin = document.getElementById("google-login-btn"); 24 | googleLogin.addEventListener("click", function () { 25 | signInWithPopup(auth, provider) 26 | .then((result) => { 27 | const credential = GoogleAuthProvider.credentialFromResult(result); 28 | const user = result.user; 29 | console.log(user); 30 | window.location.href = "./index.html"; // Redirect to home page after successful login 31 | }) 32 | .catch((error) => { 33 | const errorCode = error.code; 34 | const errorMessage = error.message; 35 | 36 | console.error("Google sign-in error:", errorCode, errorMessage); 37 | 38 | // Show user-friendly message 39 | switch (errorCode) { 40 | case 'auth/popup-closed-by-user': 41 | alert("Sign-in popup was closed before completing. Please try again."); 42 | break; 43 | case 'auth/cancelled-popup-request': 44 | alert("Multiple sign-in attempts detected. Please wait and try again."); 45 | break; 46 | case 'auth/popup-blocked': 47 | alert("Popup was blocked by the browser. Please allow popups and try again."); 48 | break; 49 | case 'auth/network-request-failed': 50 | alert("Network error occurred. Check your connection and try again."); 51 | break; 52 | default: 53 | alert("Google sign-in failed. Please try again later."); 54 | } 55 | }); 56 | }); -------------------------------------------------------------------------------- /components/skill.js: -------------------------------------------------------------------------------- 1 | // skill.js 2 | 3 | const skillInput = document.getElementById("skillInput"); 4 | const suggestionsList = document.getElementById("suggestions"); 5 | const tagContainer = document.getElementById("tag-container"); 6 | 7 | const skills = [ 8 | // --- Technical Skills --- 9 | "JavaScript", "Python", "Java", "HTML", "CSS", "C++", "React", "Node.js", 10 | "Angular", "Django", "SQL", "NoSQL", "MongoDB", "Git", "DevOps", 11 | "Machine Learning", "AI", "Firebase", "PHP", "TypeScript", 12 | "Flask", "Spring Boot", "Kotlin", "Swift", "Ruby", "Rust", "Go", 13 | "Bootstrap", "Tailwind CSS", "jQuery", "SASS", "Webpack", 14 | "Express.js", "Next.js", "Vue.js", "Nuxt.js", "REST API", "GraphQL", 15 | "PostgreSQL", "SQLite", "Redis", "Oracle DB", 16 | "AWS", "Azure", "Google Cloud", "Heroku", "Netlify", "Vercel", 17 | "CI/CD", "Docker", "Kubernetes", "Jenkins", "Terraform", 18 | "Pandas", "NumPy", "OpenCV", "TensorFlow", "PyTorch", "Keras", 19 | "Linux", "Bash", "Figma", "UI/UX Design", 20 | 21 | // --- Soft Skills --- 22 | "Communication", "Teamwork", "Problem-Solving", "Leadership", 23 | "Time Management", "Critical Thinking", "Adaptability", "Creativity", 24 | "Conflict Resolution", "Work Ethic", "Decision Making", "Attention to Detail", 25 | "Emotional Intelligence", "Collaboration", "Project Management", 26 | "Public Speaking", "Self-Motivation", "Negotiation", "Stress Management", 27 | "Empathy", "Interpersonal Skills", "Growth Mindset", "Presentation Skills" 28 | ]; 29 | 30 | let selectedSkills = []; 31 | 32 | skillInput.addEventListener("input", () => { 33 | const inputValue = skillInput.value.toLowerCase().trim(); 34 | suggestionsList.innerHTML = ""; 35 | 36 | if (inputValue === "") return; 37 | 38 | const filteredSkills = skills.filter(skill => 39 | skill.toLowerCase().startsWith(inputValue) && 40 | !selectedSkills.includes(skill) 41 | ); 42 | 43 | filteredSkills.forEach(skill => { 44 | const li = document.createElement("li"); 45 | li.textContent = skill; 46 | li.addEventListener("click", () => addSkillTag(skill)); 47 | suggestionsList.appendChild(li); 48 | }); 49 | }); 50 | 51 | skillInput.addEventListener("keydown", (e) => { 52 | if (e.key === "Enter" && skillInput.value.trim() !== "") { 53 | e.preventDefault(); 54 | const input = skillInput.value.trim(); 55 | if (!selectedSkills.includes(input)) addSkillTag(input); 56 | } 57 | }); 58 | 59 | function addSkillTag(skill) { 60 | selectedSkills.push(skill); 61 | 62 | const tag = document.createElement("div"); 63 | tag.classList.add("tag"); 64 | tag.innerHTML = `${skill}×`; 65 | tagContainer.appendChild(tag); 66 | 67 | skillInput.value = ""; 68 | suggestionsList.innerHTML = ""; 69 | } 70 | 71 | function removeTag(skill) { 72 | selectedSkills = selectedSkills.filter(s => s !== skill); 73 | [...tagContainer.children].forEach(child => { 74 | if (child.textContent.includes(skill)) child.remove(); 75 | }); 76 | } 77 | -------------------------------------------------------------------------------- /from.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Form Error Highlighting with Animation (#662) 7 | 85 | 86 | 87 | 88 |
89 |

Login

90 |
91 | 92 | 93 | 94 |

95 |
96 |
97 | 98 | 120 | 121 | 122 | 123 | -------------------------------------------------------------------------------- /CODE_OF_CONDUCT.md: -------------------------------------------------------------------------------- 1 | CODE_OF_CONDUCT.m# Job Junction — Code of Conduct 2 | 3 | *Maintaining a safe, respectful, and welcoming community for all contributors.* 4 | 5 | --- 6 | 7 | ## 🤝 Our Pledge 8 | 9 | We, as members and contributors of **Job Junction**, pledge to make participation in this project a **harassment-free experience for everyone**. 10 | We are committed to creating an **inclusive, friendly, and professional environment** where collaboration thrives. 11 | 12 | We pledge to: 13 | - Treat everyone with **respect and empathy**. 14 | - Celebrate **diversity and differences**. 15 | - Promote **learning, creativity, and growth** in all contributions. 16 | 17 | --- 18 | 19 | ## 🌟 Expected Behavior 20 | 21 | Positive behaviors that help build a welcoming community: 22 | - Show kindness and professionalism toward others. 23 | - Respect differing opinions and experiences. 24 | - Give and receive constructive feedback gracefully. 25 | - Take responsibility for mistakes and learn from them. 26 | - Focus on the success of the **whole project**. 27 | 28 | --- 29 | 30 | ## 🚫 Unacceptable Behavior 31 | 32 | The following behaviors are not tolerated: 33 | - Harassment, bullying, or personal attacks. 34 | - Discrimination based on race, gender, sexual orientation, religion, disability, or age. 35 | - Offensive, explicit, or inappropriate content. 36 | - Publishing private information without consent. 37 | - Disruptive or unprofessional behavior. 38 | 39 | --- 40 | 41 | ## 🛡 Enforcement Responsibilities 42 | 43 | Community leaders are responsible for: 44 | - Clarifying and enforcing this Code of Conduct. 45 | - Taking corrective action when necessary. 46 | - Maintaining confidentiality of all reports. 47 | 48 | --- 49 | 50 | ## 📢 Reporting Guidelines 51 | 52 | If you witness or experience unacceptable behavior: 53 | 1. Contact the maintainers via GitHub Issues or Discord. 54 | 2. Reports will be treated with **confidentiality and respect**. 55 | 3. Community leaders will respond promptly and take fair action. 56 | 57 | > **No retaliation will occur** against reporters acting in good faith. 58 | 59 | --- 60 | 61 | ## 🌍 Scope 62 | 63 | This Code of Conduct applies to: 64 | - All project spaces (online & offline). 65 | - Public interactions representing **Job Junction** (GitHub, Discord, events, social media). 66 | 67 | --- 68 | 69 | ## ⚖️ Enforcement Guidelines 70 | 71 | Consequences for violations may include: 72 | 1. **Correction** – Private warning or request for apology. 73 | 2. **Warning** – Official warning with conditions. 74 | 3. **Temporary Ban** – Restricted access to project spaces. 75 | 4. **Permanent Ban** – Removal for repeated or serious violations. 76 | 77 | --- 78 | 79 | ## 📜 Attribution 80 | 81 | This Code of Conduct is adapted from the [Contributor Covenant (v3.0)](https://www.contributor-covenant.org/version/3/0/code_of_conduct/), with modifications for **Job Junction under GSSoC’25**. 82 | 83 | We thank all contributors, maintainers, and members for helping make **Job Junction** a **safe, inclusive, and professional space**. 84 | 85 | --- 86 | 87 | ### 🎉 Final Note 88 | 89 | This Code of Conduct is more than just rules — it’s about building a **community where creativity, collaboration, and kindness thrive**. 90 | 91 | Let’s make **Job Junction** a place where everyone feels welcome to **learn, contribute, and innovate**. 92 | -------------------------------------------------------------------------------- /response.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Responsive Navbar | Job Portal 7 | 105 | 106 | 107 | 108 | 124 | 125 | 134 | 135 | 136 | 137 | -------------------------------------------------------------------------------- /forgot-password.css: -------------------------------------------------------------------------------- 1 | #resetpass-body{ 2 | height:100vh; 3 | display:flex; 4 | justify-content:center; 5 | align-items:center; 6 | backdrop-filter:blur(5px); 7 | } 8 | form{ 9 | background-color:rgba(255,255,255,0.95); 10 | padding:40px 30px; 11 | border-radius:20px; 12 | box-shadow:0 10px 25px rgba(0,0,0,0.2); 13 | max-width:400px; 14 | width:100%; 15 | text-align:center; 16 | } 17 | form #resetpass-body{ 18 | margin-bottom:25px; 19 | font-size:28px; 20 | color:#333333; 21 | } 22 | form label{ 23 | display:block; 24 | margin:15px 0px 5px; 25 | font-weight:bold; 26 | color:#444444; 27 | text-align:left; 28 | } 29 | form input[type="password"]{ 30 | width:100%; 31 | padding:12px; 32 | border:1px solid #cccccc; 33 | outline:none; 34 | font-size:16px; 35 | } 36 | .password-wrapper { 37 | position: relative; 38 | width: 93%; 39 | margin-bottom: 20px; 40 | } 41 | .password-wrapper input { 42 | width: 92.5%; 43 | padding: 12px 40px 12px 12px; 44 | border: 1px solid #ccc; 45 | border-radius: 10px; 46 | font-size: 16px; 47 | } 48 | .toggle-password { 49 | position: absolute; 50 | top: 50%; 51 | right: 12px; 52 | transform: translateY(-50%); 53 | cursor: pointer; 54 | font-size: 18px; 55 | user-select: none; 56 | color: #555; 57 | } 58 | form button{ 59 | margin-top:20px; 60 | width:100%; 61 | padding:12px; 62 | background-color:#6c63ff; 63 | border:none; 64 | color:white; 65 | font-size:16px; 66 | border-radius:10px; 67 | cursor:pointer; 68 | } 69 | form button:hover{ 70 | background-color:#5848d6; 71 | } 72 | 73 | @media(max-width:480px){ 74 | form{ 75 | padding:30px 20px; 76 | } 77 | form h1{ 78 | font-size:24px; 79 | } 80 | } 81 | 82 | .forgot-container { 83 | min-height: 100vh; 84 | display: flex; 85 | align-items: center; 86 | justify-content: center; 87 | background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); 88 | } 89 | 90 | .forgot-card { 91 | background: var(--card, #fff); 92 | padding: 2.5rem 2rem; 93 | border-radius: 1.5rem; 94 | box-shadow: 0 8px 32px rgba(30, 58, 138, 0.12); 95 | max-width: 350px; 96 | width: 100%; 97 | text-align: center; 98 | animation: fadeIn 0.7s; 99 | } 100 | 101 | .forgot-card h2 { 102 | margin-bottom: 1rem; 103 | color: var(--primary-600, #2563eb); 104 | font-size: 2rem; 105 | font-weight: 700; 106 | } 107 | 108 | .forgot-card p { 109 | color: var(--text-secondary, #64748b); 110 | margin-bottom: 1.5rem; 111 | } 112 | 113 | .forgot-card .input-group input { 114 | width: 100%; 115 | padding: 0.75rem 1rem; 116 | border: 1px solid var(--border, #e5e7eb); 117 | border-radius: 0.5rem; 118 | font-size: 1rem; 119 | margin-bottom: 1rem; 120 | outline: none; 121 | transition: border 0.2s; 122 | } 123 | 124 | .forgot-card .input-group input:focus { 125 | border-color: var(--primary-600, #2563eb); 126 | } 127 | 128 | .forgot-card .btn { 129 | width: 100%; 130 | margin-top: 0.5rem; 131 | } 132 | 133 | .forgot-message { 134 | margin-top: 1rem; 135 | font-size: 0.98rem; 136 | min-height: 1.5em; 137 | color: var(--primary-600, #2563eb); 138 | } 139 | 140 | @media (max-width: 480px) { 141 | .forgot-card { 142 | padding: 1.5rem 0.5rem; 143 | max-width: 95vw; 144 | } 145 | } -------------------------------------------------------------------------------- /components/landing.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Job Portal Landing 7 | 103 | 104 | 105 |
106 | 107 | 113 | 114 |
115 | 116 |
117 |

Your Dream Job Awaits

118 |

Find the best opportunities tailored for you.

119 | 120 |
121 | 122 |
123 |
124 |

Fast Application

125 |

Apply to jobs with a single click.

126 |
127 |
128 |

Verified Employers

129 |

Trustworthy companies to work with.

130 |
131 |
132 |

Notifications

133 |

Get alerts for the jobs that matter.

134 |
135 |
136 | 137 | 138 | -------------------------------------------------------------------------------- /components/events.js: -------------------------------------------------------------------------------- 1 | const events = [ 2 | { 3 | title: "Tech Networking Meetup", 4 | type: "Networking", 5 | date: "2025-09-10", 6 | time: "6:00 PM", 7 | location: "Delhi", 8 | venue: "Delhi Tech Hub", 9 | description: "Meet tech professionals, share ideas, and grow your network.", 10 | registration: "https://example.com/register/networking", 11 | status: "upcoming" 12 | }, 13 | { 14 | title: "Virtual Career Fair", 15 | type: "Career Fair", 16 | date: "2025-09-20", 17 | time: "10:00 AM", 18 | location: "Remote", 19 | venue: "Online (Zoom)", 20 | description: "Connect with top employers and explore job opportunities.", 21 | registration: "https://example.com/register/careerfair", 22 | status: "upcoming" 23 | }, 24 | { 25 | title: "Resume Building Workshop", 26 | type: "Workshop", 27 | date: "2025-08-15", 28 | time: "2:00 PM", 29 | location: "Bangalore", 30 | venue: "Bangalore Career Center", 31 | description: "Hands-on workshop to craft a winning resume.", 32 | registration: "https://example.com/register/workshop", 33 | status: "past", 34 | recording: "https://example.com/recordings/resume-workshop" 35 | }, 36 | { 37 | title: "AI in Careers Webinar", 38 | type: "Webinar", 39 | date: "2025-08-01", 40 | time: "5:00 PM", 41 | location: "Remote", 42 | venue: "Online (Teams)", 43 | description: "Learn how AI is transforming the job market.", 44 | registration: "https://example.com/register/webinar", 45 | status: "past", 46 | recording: "https://example.com/recordings/ai-webinar" 47 | }, 48 | { 49 | title: "Annual Hackathon", 50 | type: "Hackathon", 51 | date: "2025-10-05", 52 | time: "9:00 AM", 53 | location: "Mumbai", 54 | venue: "Mumbai Innovation Lab", 55 | description: "Showcase your coding skills and win exciting prizes.", 56 | registration: "https://example.com/register/hackathon", 57 | status: "upcoming" 58 | } 59 | ]; 60 | 61 | function renderEvents() { 62 | const type = document.getElementById('eventTypeFilter').value; 63 | const location = document.getElementById('eventLocationFilter').value; 64 | const status = document.getElementById('eventStatusFilter').value; 65 | const list = document.getElementById('eventsList'); 66 | list.innerHTML = ''; 67 | 68 | let filtered = events.filter(ev => 69 | (type === '' || ev.type === type) && 70 | (location === '' || ev.location === location) && 71 | (status === '' || ev.status === status) 72 | ); 73 | 74 | if (filtered.length === 0) { 75 | list.innerHTML = `

No events found for the selected filters.

`; 76 | return; 77 | } 78 | 79 | filtered.forEach(ev => { 80 | const isPast = ev.status === "past"; 81 | const card = document.createElement('div'); 82 | card.className = 'event-card' + (isPast ? ' past' : ''); 83 | card.innerHTML = ` 84 |
${ev.title}
85 |
86 | ${ev.date} 87 | ${ev.time} 88 | ${ev.venue} (${ev.location}) 89 | ${ev.type} 90 |
91 |
${ev.description}
92 |
93 | ${isPast && ev.recording ? `View Recording` : ''} 94 | Register 95 |
96 | `; 97 | list.appendChild(card); 98 | }); 99 | } 100 | 101 | ['eventTypeFilter', 'eventLocationFilter', 'eventStatusFilter'].forEach(id => { 102 | document.getElementById(id).addEventListener('change', renderEvents); 103 | }); 104 | 105 | window.addEventListener('DOMContentLoaded', renderEvents); -------------------------------------------------------------------------------- /components/events.css: -------------------------------------------------------------------------------- 1 | .events-hero { 2 | padding: 4rem 1rem 2rem 1rem; 3 | text-align: center; 4 | background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); 5 | color: #fff; 6 | margin-top: 70px; 7 | } 8 | .events-hero h1 { 9 | font-size: 2.5rem; 10 | margin-bottom: 0.5rem; 11 | } 12 | .events-hero p { 13 | font-size: 1.1rem; 14 | margin-bottom: 2rem; 15 | } 16 | .events-filters { 17 | display: flex; 18 | gap: 1rem; 19 | justify-content: center; 20 | flex-wrap: wrap; 21 | margin-bottom: 1rem; 22 | } 23 | .events-filters select { 24 | padding: 0.5rem 1rem; 25 | border-radius: 8px; 26 | border: 1px solid #ddd; 27 | font-size: 1rem; 28 | } 29 | .events-list { 30 | max-width: 900px; 31 | margin: 0 auto; 32 | padding: 2rem 1rem; 33 | display: grid; 34 | gap: 2rem; 35 | } 36 | .event-card { 37 | background: #fff; 38 | border-radius: 1rem; 39 | box-shadow: 0 4px 24px rgba(30,58,138,0.08); 40 | padding: 2rem; 41 | display: flex; 42 | flex-direction: column; 43 | gap: 1rem; 44 | position: relative; 45 | } 46 | .event-card.past { 47 | opacity: 0.7; 48 | background: #f5f5f5; 49 | } 50 | .event-title { 51 | font-size: 1.3rem; 52 | font-weight: 700; 53 | color: #3d55b4; 54 | } 55 | .event-meta { 56 | display: flex; 57 | gap: 2rem; 58 | flex-wrap: wrap; 59 | font-size: 1rem; 60 | color: #555; 61 | } 62 | .event-meta span { 63 | display: flex; 64 | align-items: center; 65 | gap: 0.4em; 66 | } 67 | .event-description { 68 | margin: 0.5rem 0 1rem 0; 69 | color: #444; 70 | } 71 | .event-actions { 72 | display: flex; 73 | gap: 1rem; 74 | align-items: center; 75 | } 76 | .event-register-btn { 77 | background: linear-gradient(135deg, #3d55b4, #5bb8ff); 78 | color: #fff; 79 | border: none; 80 | border-radius: 8px; 81 | padding: 0.6rem 1.5rem; 82 | font-size: 1rem; 83 | font-weight: 600; 84 | cursor: pointer; 85 | transition: background 0.2s; 86 | } 87 | .event-register-btn:hover { 88 | background: linear-gradient(135deg, #5bb8ff, #3d55b4); 89 | } 90 | .event-recording-link { 91 | color: #2563eb; 92 | text-decoration: underline; 93 | font-size: 0.98rem; 94 | } 95 | @media (max-width: 600px) { 96 | .events-list { padding: 1rem 0.2rem; } 97 | .event-card { padding: 1rem; } 98 | .events-filters { flex-direction: column; gap: 0.5rem; } 99 | } 100 | 101 | body.dark { 102 | background: #121212; 103 | color: #e0e0e0; 104 | } 105 | 106 | body.dark .navbar { 107 | background: #1f1f1f; 108 | } 109 | 110 | body.dark .nav-link { 111 | color: #e0e0e0; 112 | } 113 | 114 | body.dark .nav-link.active { 115 | color: #90caf9; 116 | } 117 | 118 | body.dark .events-hero { 119 | background: linear-gradient(135deg, #333, #555); 120 | color: #e0e0e0; 121 | } 122 | 123 | body.dark .events-filters select { 124 | background: #333; 125 | color: #e0e0e0; 126 | border: 1px solid #555; 127 | } 128 | 129 | body.dark .event-card { 130 | background: #1f1f1f; 131 | color: #e0e0e0; 132 | } 133 | 134 | body.dark .event-register-btn { 135 | background: linear-gradient(135deg, #90caf9, #42a5f5); 136 | color: #121212; 137 | } 138 | 139 | body.dark #backToTopBtn { 140 | background: #90caf9; 141 | color: #121212; 142 | } 143 | body.dark .event-description { 144 | color: #d1d5db; /* Softer, more readable light grey */ 145 | } 146 | .navbar { 147 | display: flex; 148 | align-items: center; 149 | justify-content: space-between; 150 | padding: 1rem 2rem; 151 | background: #fff; 152 | } 153 | 154 | .nav-brand .logo { 155 | max-height: 50px; 156 | } 157 | 158 | .nav-menu { 159 | display: flex; 160 | gap: 1.5rem; 161 | list-style: none; 162 | margin: 0; 163 | padding: 0; 164 | align-items: center; 165 | } 166 | 167 | .theme-toggle { 168 | background: none; 169 | border: none; 170 | font-size: 1.25rem; 171 | cursor: pointer; 172 | color: #333; 173 | } 174 | body.dark .theme-toggle { 175 | color: #f3f3f1; /* White icon color in dark mode */ 176 | background:rgb(78, 79, 79); 177 | } 178 | 179 | .nav-brand .logo { 180 | height: 100px !important; /* Force exact height */ 181 | width: auto; 182 | object-fit: contain; 183 | display: block; /* Prevent inline spacing issues */ 184 | } 185 | 186 | -------------------------------------------------------------------------------- /application.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Job Application Tracker 7 | 8 | 133 | 134 | 135 | 136 |

Job Application Tracker

137 | 138 |
139 | 140 | 141 | 142 | 143 | 144 | 145 | 146 | 147 | 148 | 149 | 150 | 151 | 152 | 157 | 158 | 159 |
160 | 161 |
162 | 163 |

Application History

164 |
165 | 166 | 167 | 168 | 169 | -------------------------------------------------------------------------------- /skilltag.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Skill Tag Filtering (#667) 7 | 90 | 91 | 92 | 93 | 94 |

Filter Jobs by Skills

95 | 96 |
97 |
HTML
98 |
CSS
99 |
JavaScript
100 |
React
101 |
Python
102 |
103 | 104 |
105 |
106 |

Frontend Developer

107 |

Company: WebWorks

108 |

Skills: HTML, CSS

109 |
110 | 111 |
112 |

React Developer

113 |

Company: CodeCraft

114 |

Skills: JavaScript, React

115 |
116 | 117 |
118 |

Backend Developer

119 |

Company: DataNest

120 |

Skills: Python

121 |
122 | 123 |
124 |

Web Designer

125 |

Company: Designify

126 |

Skills: HTML, CSS, JavaScript

127 |
128 |
129 | 130 | 163 | 164 | 165 | 166 | -------------------------------------------------------------------------------- /jobcards.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Job Cards Flip Animation | Job Portal 7 | 8 | 101 | 102 | 103 | 104 | 105 |

Available Jobs

106 | 107 |
108 | 109 | 110 |
111 |
112 | 113 |
114 |

Frontend Developer

115 |

Company: ABC Tech

116 | 117 |
118 | 119 |
120 |

Frontend Developer

121 |

Experience: 1-3 years

122 |

Location: Remote

123 |

Salary: ₹6-8 LPA

124 | 125 |
126 |
127 |
128 | 129 |
130 |
131 |
132 |

Backend Engineer

133 |

Company: XYZ Labs

134 | 135 |
136 | 137 |
138 |

Backend Engineer

139 |

Experience: 2+ years

140 |

Location: Bangalore

141 |

Salary: ₹8-10 LPA

142 | 143 |
144 |
145 |
146 | 147 |
148 |
149 |
150 |

UI/UX Designer

151 |

Company: Design Studio

152 | 153 |
154 | 155 |
156 |

UI/UX Designer

157 |

Experience: 0-2 years

158 |

Location: Mumbai

159 |

Salary: ₹5-7 LPA

160 | 161 |
162 |
163 |
164 | 165 |
166 | 167 | 186 | 187 | 188 | 189 | -------------------------------------------------------------------------------- /jobapplication.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Job Application Modal Popup (#665) 7 | 131 | 132 | 133 | 134 | 135 |
136 |

Frontend Developer

137 |

Company: TechNova

138 | 139 |
140 | 141 | 142 | 153 | 154 | 198 | 199 | 200 | 201 | -------------------------------------------------------------------------------- /style.min.css: -------------------------------------------------------------------------------- 1 | * { 2 | margin: 0; 3 | padding: 0; 4 | box-sizing: border-box; 5 | font-family: "Poppins", sans-serif; 6 | } 7 | body { 8 | background: linear-gradient(120deg, #e0e7ff 0%, #f7f9fc 100%); 9 | min-height: 100vh; 10 | width: 100vw; 11 | overflow-x: hidden; 12 | } 13 | .navbar { 14 | /* position: fixed; */ 15 | top: 0; 16 | left: 0; 17 | width: 100%; 18 | height: 64px; 19 | background: rgba(61, 85, 180, 0.95); 20 | color: #fff; 21 | display: flex; 22 | align-items: center; 23 | justify-content: space-between; 24 | padding: 0 32px; 25 | z-index: 100; 26 | box-shadow: 0 2px 16px rgba(61, 85, 180, 0.08); 27 | backdrop-filter: blur(8px); 28 | } 29 | .nav-logo img { 30 | height: 44px; 31 | filter: drop-shadow(0 2px 8px #25347a33); 32 | } 33 | .nav-links { 34 | display: flex; 35 | gap: 32px; 36 | list-style: none; 37 | margin: 0; 38 | } 39 | .nav-links a { 40 | color: #fff; 41 | text-decoration: none; 42 | font-weight: 600; 43 | font-size: 18px; 44 | letter-spacing: 0.5px; 45 | transition: color 0.2s; 46 | } 47 | .nav-links a:hover { 48 | color: #ffd700; 49 | } 50 | .nav-toggle { 51 | display: none; 52 | font-size: 28px; 53 | cursor: pointer; 54 | } 55 | main { 56 | padding-top: 96px; 57 | padding-bottom: 96px; 58 | min-height: calc(100vh - 160px); 59 | display: flex; 60 | flex-direction: column; 61 | align-items: center; 62 | justify-content: center; 63 | } 64 | .hero { 65 | background: rgba(255, 255, 255, 0.95); 66 | border-radius: 32px; 67 | box-shadow: 0 8px 32px rgba(61, 85, 180, 0.1); 68 | padding: 64px 40px 48px 40px; 69 | max-width: 600px; 70 | width: 100%; 71 | margin: 0 auto; 72 | display: flex; 73 | flex-direction: column; 74 | align-items: flex-end; 75 | /* position: relative; */ 76 | overflow: hidden; 77 | } 78 | .hero::before { 79 | content: ""; 80 | /* position: absolute; */ 81 | left: -80px; 82 | top: -80px; 83 | width: 220px; 84 | height: 220px; 85 | background: radial-gradient(circle, #3d55b4 40%, transparent 70%); 86 | opacity: 0.12; 87 | z-index: 0; 88 | } 89 | .hero h1 { 90 | font-size: 48px; 91 | color: #3d55b4; 92 | text-align: right; 93 | margin-bottom: 36px; 94 | font-weight: 700; 95 | line-height: 1.2; 96 | letter-spacing: 1px; 97 | z-index: 1; 98 | } 99 | .box-sign { 100 | background: linear-gradient(90deg, #3d55b4 60%, #5bb8ff 100%); 101 | color: #fff; 102 | padding: 18px 48px; 103 | border-radius: 32px; 104 | font-size: 22px; 105 | font-weight: 600; 106 | cursor: pointer; 107 | box-shadow: 0 4px 16px rgba(61, 85, 180, 0.12); 108 | border: none; 109 | transition: background 0.2s, transform 0.2s; 110 | z-index: 1; 111 | text-align: center; 112 | } 113 | .box-sign:hover { 114 | background: linear-gradient(90deg, #25347a 60%, #5bb8ff 100%); 115 | transform: scale(1.07); 116 | } 117 | .footer { 118 | width: 100%; 119 | background: #3d55b4; 120 | color: #fff; 121 | text-align: center; 122 | padding: 32px 0 16px 0; 123 | /* position: fixed; */ 124 | left: 0; 125 | bottom: 0; 126 | z-index: 99; 127 | box-shadow: 0 -2px 12px rgba(61, 85, 180, 0.08); 128 | font-size: 16px; 129 | letter-spacing: 0.5px; 130 | } 131 | .footer-content { 132 | font-family: "Poppins", sans-serif; 133 | } 134 | @media (max-width: 700px) { 135 | .nav-links { 136 | display: none; 137 | flex-direction: column; 138 | background: #3d55b4; 139 | /* position: absolute; */ 140 | top: 64px; 141 | right: 0; 142 | width: 100vw; 143 | padding: 16px 0; 144 | } 145 | .nav-toggle { 146 | display: block; 147 | } 148 | .hero { 149 | align-items: center; 150 | padding: 40px 8vw 32px 8vw; 151 | max-width: 98vw; 152 | } 153 | .hero h1 { 154 | font-size: 32px; 155 | text-align: center; 156 | } 157 | main { 158 | padding-top: 80px; 159 | padding-bottom: 120px; 160 | } 161 | .footer { 162 | padding: 24px 0 12px 0; 163 | font-size: 14px; 164 | } 165 | } 166 | .input-group { 167 | display: flex; 168 | gap: 10px; 169 | align-items: center; 170 | position: relative; 171 | margin: 0 auto; 172 | } 173 | .input-group input { 174 | all: unset; 175 | width: 250px; 176 | height: 40px; 177 | border: 1px solid blue; 178 | border-radius: 5px; 179 | backdrop-filter: blur(500px); 180 | padding-left: 10px; 181 | } 182 | .input-group input::placeholder { 183 | font-size: 12px; 184 | } 185 | .input-group label { 186 | position: absolute; 187 | left: 40px; 188 | top: -12px; 189 | background-color: #62b9fc; 190 | padding: 0px 10px 0 10px; 191 | font-size: 13px; 192 | border-radius: 5px; 193 | font-weight: 500; 194 | } 195 | .fa-solid { 196 | font-size: 20px; 197 | } 198 | .sign-in-btn, 199 | .sign-up-btn { 200 | all: unset; 201 | margin: 0 auto; 202 | border: 1px solid blue; 203 | padding: 5px 30px; 204 | cursor: pointer; 205 | border-radius: 5px; 206 | font-size: 15px; 207 | font-weight: 500; 208 | transition: all 0.1s ease-in-out; 209 | } 210 | .sign-up-btn:hover, 211 | .fa-google:hover, 212 | .sign-in-btn:hover { 213 | background-color: #5bb8ff; 214 | transform: scale(1.1); 215 | } 216 | .signy { 217 | max-width: 30vw; 218 | display: flex; 219 | flex-direction: column; 220 | justify-content: center; 221 | align-items: center; 222 | margin: 0 auto; 223 | gap: 20px; 224 | } 225 | .links, 226 | .links2 { 227 | display: flex; 228 | gap: 10px; 229 | align-items: center; 230 | position: relative; 231 | } 232 | .links button, 233 | .links2 button { 234 | all: unset; 235 | cursor: pointer; 236 | } 237 | .links button:hover, 238 | .links2 button:hover { 239 | text-decoration: underline; 240 | } 241 | @media (max-width: 1000px) { 242 | .hero { 243 | padding: 40px 16px 32px 16px; 244 | max-width: 90vw; 245 | } 246 | .box-sign { 247 | font-size: 20px; 248 | padding: 14px 28px; 249 | } 250 | } 251 | @media (max-width: 655px) { 252 | .hero { 253 | padding: 24px 8px 20px 8px; 254 | max-width: 98vw; 255 | } 256 | .box-sign { 257 | font-size: 18px; 258 | padding: 12px 18px; 259 | } 260 | } 261 | @media (max-width: 430px) { 262 | .hero { 263 | padding: 12px 2px 10px 2px; 264 | max-width: 100vw; 265 | } 266 | .box-sign { 267 | font-size: 16px; 268 | padding: 10px 12px; 269 | } 270 | } 271 | .select-role-text { 272 | text-align: center; 273 | margin-top: 20px; 274 | } 275 | .select-role-text h1 { 276 | margin: 0; 277 | font-family: "Poppins", sans-serif; 278 | font-size: 2rem; 279 | color: #030303; 280 | } 281 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | ## 🧹 Code Cleanliness & Performance 2 | 3 | To keep Job Junction fast and maintainable: 4 | - Periodically audit and remove unused CSS and JavaScript code. 5 | - Use tools like PurgeCSS, UnCSS, or browser DevTools Coverage tab to find dead code. 6 | - Minify assets for production (see minified files in the repo). 7 | 8 | # 💼 Job Junction 9 | 10 | **Job Junction** is a responsive and modern job portal web application built with HTML, CSS, and JavaScript. It provides a clean interface for users to explore job opportunities. The project is currently under development as part of open-source contributions in the GirlScript Summer of Code (GSSoC). 11 | 12 | 13 | 14 | ## ✨ Key Features (Implemented & Planned) 15 | 16 | | Category | Feature | Status | 17 | |--------------|------------------------------------------------|-------------- | 18 | | Core UI | "Get Started" button leading to homepage | ✅ Done | 19 | | Design | Responsive UI with background image & logo | ✅ Done | 20 | | Styling | Font Awesome icons, Google Fonts (Poppins) | ✅ Done | 21 | | Auth | Firebase Authentication | 🛠️ In Progress| 22 | | Navigation | Homepage routing | ✅ Done | 23 | 24 | 25 | 26 | ## 🛠️ Tech Stack 27 | 28 | - HTML5 29 | - CSS3 30 | - JavaScript 31 | - Firebase (for authentication – under progress) 32 | - Font Awesome 33 | - Google Fonts (Poppins) 34 | 35 | ## 🏗️ System Architecture 36 | 37 | ``` 38 | Client (Browser) ─────────────────────────────────────────────┐ 39 | │ │ 40 | │ 1. UI Layer (HTML + CSS) │ 41 | │ • index.html – Landing page │ 42 | │ • css/style.css – Styling and responsive design │ 43 | │ • images/ – Logos, backgrounds │ 44 | │ │ 45 | │ 2. Logic Layer (JavaScript) │ 46 | │ • js/script.js – Button handling, navigation │ 47 | │ │ 48 | │ 3. Authentication Layer (Firebase) │ 49 | │ • Firebase config (in JS file) │ 50 | │ • Handles login/signup (in progress) │ 51 | │ │ 52 | └───────────────────────────────────────────────────────────── 53 | ``` 54 | 55 | 56 | ✔️ **Offline-Ready UI**: Runs fully in browser using static files 57 | 🔐 **Firebase**: Planned for user authentication & real-time features 58 | 59 | 60 | ## 📸 Screenshots 61 | 62 | | Page | Preview | 63 | |--------------------|-----------------------------------------------------------| 64 | | Landing Page | ![Landing](./assets/screenshots/landing-page.webp) | 65 | | User Role Selector | ![User Role](./assets/screenshots/user-role.webp) | 66 | | Seeker Dashboard | ![Seeker](./assets/screenshots/seeker-dashboard.webp) | 67 | | Employer Dashboard | ![Employer](./assets/screenshots/employer-dashboard.webp) | 68 | 69 | 70 | 71 | ## 🗂️ Folder Structure 72 | 73 | ``` 74 | JOB-PORTAL/ 75 | ├── assets/ 76 | │ ├── (Your asset files, e.g., favicon.png, login-bg.png, logo.png) 77 | ├── components/ 78 | │ ├── about.css 79 | │ ├── employer.html 80 | │ ├── seeker.js 81 | ├── .gitignore 82 | ├── index.html 83 | ├── LICENSE 84 | ├── README.md 85 | ├── script.js 86 | └── style.css 87 | ``` 88 | 89 | 90 | **🚀 Getting Started** 91 | 92 | 93 | ## 🛠️ How to Use & Contribute 94 | 95 | ### 1. Clone 96 | 97 | ```bash 98 | git clone https://github.com/SurajSG23/Job-Portal 99 | cd Job-Portal 100 | ``` 101 | 102 | ### 2. Run Locally 103 | 104 | Any static server works. With **VS Code**: 105 | 106 | 1. Install the **Live Server** extension 107 | 2. Right-click `index.html` → **“Open with Live Server”** 108 | 109 | ### 3. Contribute 110 | 111 | - Pick an issue labelled **Level 1**, **Level 2**, or **Level 3** 112 | - Create a feature branch: 113 | ```bash 114 | git checkout -b feat/your-feature-name 115 | ``` 116 | - Follow the style guide, submit a **Pull Request**, and respond to reviews 117 | 118 | 119 | 120 | ## 🧑‍💻 Contribution Workflow & Community Guidelines 121 | 122 | | Step | 123 | |----------------------------------------------------------| 124 | | Fork the repository | 125 | | Create a new branch: `git checkout -b your-feature-name` | 126 | | Make your changes | 127 | | Commit: `git commit -m "Add: feature description"` | 128 | | Push: `git push origin your-feature-name` | 129 | | Open a Pull Request on GitHub | 130 | 131 | 132 | ### 📜 Code of Conduct 133 | 134 | By participating in this project, you agree to abide by our [Code of Conduct](./CODE_OF_CONDUCT.md) to foster a welcoming and respectful community. 135 | 136 | ### 📝 Issue & PR Templates 137 | 138 | Please use the provided GitHub Issue and Pull Request templates to help us triage bugs, review features, and keep contributions consistent. 139 | 140 | 141 | ## 🛣️ Roadmap (Upcoming) 142 | 143 | | Upcoming Tasks | 144 | |-------------------------------------------------| 145 | | 🔒 Complete Firebase Authentication | 146 | | 📱 Improve responsiveness for all device sizes | 147 | | 🌐 Deploy via GitHub Pages | 148 | | 🧪 Add more UI components (Search, Filters, Listings) | 149 | | 🗃️ Add dummy job data | 150 | 151 | 152 | 153 | ## 👥 Community & Support 154 | 155 | | Channel | Purpose | 156 | |--------------------|-------------------------------------| 157 | | GitHub Issues | Bug reports, feature requests | 158 | | GitHub Discussions | Q&A, ideas, polls | 159 | | Discord | Real-time chat, pair programming | 160 | | GSSoC Mentors | Onboarding & code reviews | 161 | 162 | 163 | This project is a part of GirlScript Summer of Code (GSSoC). 164 | We're glad to support first-time contributors and open-source learners! 165 | 166 | 📄 License 167 | This project is open source and available under the MIT License. 168 | 169 | ⭐ If you like this project, don’t forget to star the repo and contribute! 170 | 171 | 172 | 173 | 174 | 175 | -------------------------------------------------------------------------------- /masthead.s.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Job Junction – Masthead 7 | 8 | 134 | 135 | 136 | 137 | 138 |
139 |

Welcome to Job Junction

140 |

Your one-stop portal for job seekers and recruiters

141 |
142 | Browse Jobs 143 | Post a Job 144 |
145 |
146 | 147 | 148 |
149 |
150 | User Profile 151 |
152 |

Username: SurajSG23

153 |

Role: Project Admin

154 |
155 |
156 | 157 | 158 |
159 |

Contributors with Merged PRs

160 |
Loading contributions...
161 |
162 |
163 | 164 | 228 | 229 | 230 | 231 | -------------------------------------------------------------------------------- /dynamic.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Dynamic Job Filtering | Job Portal 7 | 93 | 94 | 95 | 96 |

Available Jobs

97 | 98 |
99 | 100 | 101 | 107 | 108 | 115 | 116 | 122 |
123 | 124 |
125 | 126 | 196 | 197 | 198 | 199 | -------------------------------------------------------------------------------- /CONTRIBUTING.md: -------------------------------------------------------------------------------- 1 | # 🤝 Welcome to the Job Junction Contribution Guide 2 | 3 | Thanks for your interest in contributing to **Job Junction** – an open-source, beginner-friendly job portal built using **HTML**, **CSS**, **JavaScript**, and **Firebase**. 4 | This guide is written to help both **first-time contributors** and experienced developers contribute confidently and efficiently. 5 | 6 | If you're part of **GirlScript Summer of Code (GSSoC)** or just exploring open source, this file will walk you through everything you need to know. 7 | 8 | --- 9 | 10 | ## 💡 What Is Job Junction? 11 | 12 | Job Junction is a clean and modern job portal that lets users: 13 | - Explore job opportunities (planned) 14 | - Navigate through different dashboards 15 | - Experience a responsive UI with Firebase-powered authentication (in progress) 16 | 17 | 🔗 [Live Preview](https://surajsg23.github.io/Job-Portal/) 18 | 📦 [Source Code](https://github.com/SurajSG23/Job-Portal) 19 | 20 | --- 21 | 22 | ## 📌 Tech Stack 23 | 24 | | Layer | Tech Stack Used | 25 | |--------------------|---------------------------------------------| 26 | | Structure (UI) | HTML5 | 27 | | Styling | CSS3, SCSS | 28 | | Behavior | JavaScript (Vanilla) | 29 | | Authentication | Firebase (Login/Signup – WIP) | 30 | | UI Tools | Font Awesome, Google Fonts (Poppins) | 31 | 32 | --- 33 | 34 | ## 🚀 Getting Started (For Local Development) 35 | 36 | > ⚠️ Recommended: Use [VS Code](https://code.visualstudio.com/) and install the **Live Server** extension. 37 | 38 | ### 🧾 Clone the Repository 39 | 40 | ```bash 41 | git clone https://github.com//Job-Portal.git 42 | cd Job-Portal 43 | ```` 44 | 45 | ### 🌐 Run Locally 46 | 47 | With VS Code: 48 | 49 | 1. Install the **Live Server** extension. 50 | 2. Right-click on `index.html` → “Open with Live Server”. 51 | 52 | Your browser will open the site locally! 53 | 54 | --- 55 | 56 | ## 🧑‍💻 How to Contribute (Step-by-Step) 57 | 58 | Whether you're fixing a bug, updating UI, or improving docs, follow these steps: 59 | 60 | --- 61 | 62 | ### 1️⃣ Fork This Repository 63 | 64 | Click the **"Fork"** button (top-right corner of the repo page). 65 | This creates a personal copy of the repository under your account. 66 | 67 | --- 68 | 69 | ### 2️⃣ Clone Your Fork Locally 70 | 71 | ```bash 72 | git clone https://github.com//Job-Portal.git 73 | cd Job-Portal 74 | ``` 75 | 76 | --- 77 | 78 | ### 3️⃣ Create a Feature Branch 79 | 80 | > Never commit directly to `main`. Always work on a new branch. 81 | 82 | ```bash 83 | git checkout -b feat/your-feature-name 84 | ``` 85 | 86 | Examples: 87 | 88 | * `feat/navbar-animation` 89 | * `fix/footer-overflow` 90 | * `docs/update-readme` 91 | 92 | --- 93 | 94 | ### 4️⃣ Make Your Changes 95 | 96 | Open the project in your code editor and make the necessary changes. 97 | 98 | > 🧠 Tip: Follow the structure and naming patterns already used. 99 | 100 | --- 101 | 102 | ### 5️⃣ Stage & Commit 103 | 104 | ```bash 105 | git add . 106 | git commit -m "feat: added seeker dashboard UI" 107 | ``` 108 | 109 | Use **meaningful commit messages**. Recommended types: 110 | 111 | * `feat:` – New feature 112 | * `fix:` – Bug fix 113 | * `docs:` – Documentation only 114 | * `style:` – Visual or layout changes 115 | * `refactor:` – Code restructuring without functionality change 116 | * `chore:` – Maintenance, build changes, etc. 117 | 118 | --- 119 | 120 | ### 6️⃣ Push to GitHub 121 | 122 | ```bash 123 | git push origin feat/your-feature-name 124 | ``` 125 | 126 | --- 127 | 128 | ### 7️⃣ Open a Pull Request (PR) 129 | 130 | Go to your forked repo on GitHub: 131 | 132 | * Click **“Compare & Pull Request”** 133 | * Add a **clear title** 134 | * In the description, explain: 135 | 136 | * What you changed 137 | * Why it's useful 138 | * If it fixes an issue (e.g., "Closes #12") 139 | 140 | > 💬 Be respectful, clear, and responsive to reviewer comments. 141 | 142 | --- 143 | 144 | ## 🔍 What Can I Work On? 145 | 146 | You can look for issues labeled: 147 | 148 | * `Level 1` – Beginner-friendly 149 | * `Level 2` – Intermediate 150 | * `Level 3` – Advanced 151 | 152 | Things you could help with: 153 | 154 | * 🔧 Fix layout issues 155 | * 🎨 Improve responsiveness (mobile/tablet) 156 | * 🔐 Integrate Firebase login (WIP) 157 | * 📚 Add better documentation 158 | * 🧪 Add components (search bar, filters, job cards) 159 | * 🧰 Refactor or optimize JS code 160 | 161 | --- 162 | 163 | ## 📂 Folder Structure (Quick Peek) 164 | 165 | ``` 166 | JOB-PORTAL/ 167 | ├── assets/ → Images, logos 168 | ├── components/ → HTML/CSS/JS partials 169 | ├── index.html → Landing page 170 | ├── style.css → Main CSS 171 | ├── script.js → General JS logic 172 | └── README.md → Project overview 173 | ``` 174 | 175 | --- 176 | 177 | ## 🎨 Style Guidelines 178 | 179 | * Use semantic HTML (`
`, `
`, etc.) 180 | * Stick to existing naming conventions (camelCase or kebab-case) 181 | * Keep indentation consistent (2 or 4 spaces, match existing) 182 | * Write CSS/SCSS modularly (use comments if needed) 183 | * JavaScript should be clean and commented if complex 184 | 185 | --- 186 | 187 | ## ❓ FAQs 188 | 189 | **Q: I’m new. Can I contribute?** 190 | Yes! We welcome new contributors — especially GSSoC participants. 191 | 192 | **Q: Do I need to use Firebase?** 193 | Not unless you're contributing to the auth system. Frontend-only tasks are welcome! 194 | 195 | **Q: Should I open an issue before submitting PR?** 196 | It's a good practice, especially for features/bugs. For small fixes, PRs are fine directly. 197 | 198 | **Q: How do I sync my fork with the original repo?** 199 | 200 | ```bash 201 | git remote add upstream https://github.com/SurajSG23/Job-Portal.git 202 | git fetch upstream 203 | git merge upstream/main 204 | ``` 205 | 206 | --- 207 | 208 | ## 🙌 Community & Support 209 | 210 | | Channel | Purpose | 211 | | ------------------ | -------------------------------- | 212 | | GitHub Issues | Bug reports, feature suggestions | 213 | | GitHub Discussions | Q\&A, brainstorming, feedback | 214 | | Discord (GSSoC) | Real-time help, networking | 215 | 216 | --- 217 | 218 | ## 🛡️ License 219 | 220 | This project is licensed under the **MIT License**. 221 | 222 | --- 223 | 224 | ## 🌟 Final Note 225 | 226 | We’re building Job Junction with love — one line of code at a time. 227 | If you’re learning, experimenting, or just want to help — **you’re welcome here**. Your contribution, no matter how small, **makes a difference**. ✨ 228 | 229 | > ⭐ Don’t forget to **star** the repo and spread the word. 230 | > Let's build something amazing, together. 231 | 232 | Happy coding! 💻 233 | — *The Job Junction Team* -------------------------------------------------------------------------------- /job-application.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Job Application 7 | 172 | 173 | 174 |
175 |
176 |
177 |

A WISE QUOTE

178 |
179 |
180 |

Unlock Your Potential

181 |

Apply now and start building your career with us. We are looking for talented individuals who are passionate about their work.

182 |
183 |
184 |
185 | 188 |
189 |

Apply for a Job

190 |

Fill out the form below to submit your application.

191 |
192 |
193 |
194 | 195 | 196 |
197 |
198 | 199 | 200 |
201 |
202 | 203 | 204 |
205 |
206 | 207 | 208 |
209 |
210 | 211 | 212 |
213 | 214 |
215 |
216 |
217 |
218 | 219 | 236 | 237 | -------------------------------------------------------------------------------- /salary-insights.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Salary Insights - Job Junction 7 | 8 | 112 | 113 | 114 | 115 |
116 |

Salary Insights

117 |

Compare salaries by job role, industry, and location

118 |
119 | 120 | 121 |
122 | 128 | 134 | 140 |
141 | 142 | 143 |
144 |
145 |

Web Developer (Entry, India)

146 |

₹4,50,000 / year

147 |
148 |
149 |

Designer (Mid, USA)

150 |

$65,000 / year

151 |
152 |
153 |

Data Analyst (Senior, Canada)

154 |

$90,000 / year

155 |
156 |
157 | 158 | 159 |
160 |

Salary Trends Over Time

161 | 162 |
163 | 164 |
165 |

Top Paying Companies

166 | 167 |
168 | 169 | 239 | 240 | 241 | 242 | -------------------------------------------------------------------------------- /networking-events.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | Networking & Events | Job Junction 9 | 165 | 166 | 167 | 168 |
169 |

Networking & Events

170 |

Discover upcoming opportunities, join events, and grow your network 🚀

171 |
172 | 173 | 174 |
175 | 176 | 177 | 178 | 179 | 180 |
181 | 182 | 183 |
184 |
185 |

Resume Building Workshop

186 |

Date: Aug 25, 2025 | Time: 5 PM EST

187 |

Venue: Virtual (Zoom)

188 |

Learn resume writing tips and get recruiter insights.

189 | 190 |
191 |
192 |

Job Junction Hackathon

193 |

Date: Sept 2-4, 2025 | Time: 9 AM

194 |

Venue: Toronto, ON

195 |

Team up and build innovative job-tech solutions.

196 | 197 |
198 |
199 |

Virtual Career Fair

200 |

Date: Sept 10, 2025 | Time: 11 AM EST

201 |

Venue: Online

202 |

Connect with top employers hiring across industries.

203 | 204 |
205 |
206 | 207 | 208 |
209 |

Join Our Community

210 |
211 | 212 | 213 | 214 | 215 |
216 |
217 | 218 | 230 | 231 | 232 | -------------------------------------------------------------------------------- /components/homePage.css: -------------------------------------------------------------------------------- 1 | /* Reset and Base Styles */ 2 | * { 3 | margin: 0; 4 | padding: 0; 5 | box-sizing: border-box; 6 | } 7 | 8 | body { 9 | font-family: "Poppins", sans-serif; 10 | line-height: 1.6; 11 | color: #333; 12 | background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); 13 | min-height: 100vh; 14 | overflow-x: hidden; 15 | } 16 | 17 | /* Page Wrapper */ 18 | .page-wrapper { 19 | min-height: 100vh; 20 | display: flex; 21 | flex-direction: column; 22 | position: relative; 23 | } 24 | 25 | /* Header Styles */ 26 | .header { 27 | background: rgba(255, 255, 255, 0.95); 28 | backdrop-filter: blur(10px); 29 | padding: 1rem 2rem; 30 | box-shadow: 0 2px 20px rgba(0, 0, 0, 0.1); 31 | position: sticky; 32 | top: 0; 33 | z-index: 100; 34 | } 35 | 36 | .logo-container { 37 | display: flex; 38 | align-items: center; 39 | gap: 1rem; 40 | max-width: 1200px; 41 | margin: 0 auto; 42 | } 43 | 44 | .logo-img { 45 | width: 50px; 46 | height: 50px; 47 | object-fit: contain; 48 | } 49 | 50 | .logo-text { 51 | font-size: 1.8rem; 52 | font-weight: 700; 53 | color: #667eea; 54 | margin: 0; 55 | } 56 | 57 | /* Main Content */ 58 | .main-content { 59 | flex: 1; 60 | display: flex; 61 | flex-direction: column; 62 | justify-content: center; 63 | align-items: center; 64 | padding: 2rem; 65 | max-width: 1200px; 66 | margin: 0 auto; 67 | width: 100%; 68 | } 69 | 70 | /* Hero Section */ 71 | .hero-section { 72 | text-align: center; 73 | margin-bottom: 3rem; 74 | color: white; 75 | } 76 | 77 | .hero-title { 78 | font-size: 3rem; 79 | font-weight: 700; 80 | margin-bottom: 1rem; 81 | text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3); 82 | } 83 | 84 | .hero-subtitle { 85 | font-size: 1.2rem; 86 | font-weight: 400; 87 | opacity: 0.9; 88 | max-width: 600px; 89 | margin: 0 auto; 90 | } 91 | 92 | /* Role Selection */ 93 | .role-selection { 94 | width: 100%; 95 | max-width: 900px; 96 | } 97 | 98 | .selection-title { 99 | text-align: center; 100 | font-size: 1.5rem; 101 | font-weight: 600; 102 | color: white; 103 | margin-bottom: 2rem; 104 | text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3); 105 | } 106 | 107 | .role-cards { 108 | display: grid; 109 | grid-template-columns: repeat(auto-fit, minmax(350px, 1fr)); 110 | gap: 2rem; 111 | justify-items: center; 112 | } 113 | 114 | /* Role Cards */ 115 | .role-card { 116 | text-decoration: none; 117 | color: inherit; 118 | display: block; 119 | width: 100%; 120 | max-width: 400px; 121 | transition: transform 0.3s ease, box-shadow 0.3s ease; 122 | } 123 | 124 | .role-card:hover { 125 | transform: translateY(-10px); 126 | } 127 | 128 | .card-content { 129 | background: rgba(255, 255, 255, 0.95); 130 | backdrop-filter: blur(10px); 131 | border-radius: 20px; 132 | padding: 2rem; 133 | box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2); 134 | transition: all 0.3s ease; 135 | height: 100%; 136 | display: flex; 137 | flex-direction: column; 138 | align-items: center; 139 | text-align: center; 140 | } 141 | 142 | .role-card:hover .card-content { 143 | box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3); 144 | transform: scale(1.02); 145 | } 146 | 147 | .card-image { 148 | margin-bottom: 1.5rem; 149 | transition: transform 0.3s ease; 150 | } 151 | 152 | .card-image img { 153 | width: 200px; 154 | height: 200px; 155 | object-fit: contain; 156 | transition: transform 0.3s ease; 157 | } 158 | 159 | .role-card:hover .card-image img { 160 | transform: scale(1.1); 161 | } 162 | 163 | .card-text h4 { 164 | font-size: 1.5rem; 165 | font-weight: 600; 166 | color: #333; 167 | margin-bottom: 0.5rem; 168 | } 169 | 170 | .card-text p { 171 | font-size: 1rem; 172 | color: #666; 173 | line-height: 1.5; 174 | } 175 | 176 | /* Seeker Card Specific */ 177 | .seeker-card .card-content { 178 | border: 3px solid transparent; 179 | background: linear-gradient(white, white) padding-box, 180 | linear-gradient(135deg, #667eea, #764ba2) border-box; 181 | } 182 | 183 | /* Employer Card Specific */ 184 | .employer-card .card-content { 185 | border: 3px solid transparent; 186 | background: linear-gradient(white, white) padding-box, 187 | linear-gradient(135deg, #764ba2, #667eea) border-box; 188 | } 189 | 190 | /* Footer */ 191 | .footer { 192 | background: rgba(0, 0, 0, 0.1); 193 | backdrop-filter: blur(10px); 194 | padding: 1rem; 195 | text-align: center; 196 | color: white; 197 | margin-top: auto; 198 | } 199 | 200 | .footer p { 201 | font-size: 0.9rem; 202 | opacity: 0.8; 203 | } 204 | 205 | /* Responsive Design */ 206 | @media (max-width: 768px) { 207 | .header { 208 | padding: 1rem; 209 | } 210 | 211 | .logo-text { 212 | font-size: 1.5rem; 213 | } 214 | 215 | .main-content { 216 | padding: 1rem; 217 | } 218 | 219 | .hero-title { 220 | font-size: 2rem; 221 | } 222 | 223 | .hero-subtitle { 224 | font-size: 1rem; 225 | } 226 | 227 | .role-cards { 228 | grid-template-columns: 1fr; 229 | gap: 1.5rem; 230 | } 231 | 232 | .card-content { 233 | padding: 1.5rem; 234 | } 235 | 236 | .card-image img { 237 | width: 150px; 238 | height: 150px; 239 | } 240 | 241 | .card-text h4 { 242 | font-size: 1.3rem; 243 | } 244 | } 245 | 246 | @media (max-width: 480px) { 247 | .hero-title { 248 | font-size: 1.8rem; 249 | } 250 | 251 | .selection-title { 252 | font-size: 1.3rem; 253 | } 254 | 255 | .card-content { 256 | padding: 1rem; 257 | } 258 | 259 | .card-image img { 260 | width: 120px; 261 | height: 120px; 262 | } 263 | 264 | .card-text h4 { 265 | font-size: 1.2rem; 266 | } 267 | 268 | .card-text p { 269 | font-size: 0.9rem; 270 | } 271 | } 272 | 273 | /* Animation for page load */ 274 | @keyframes fadeInUp { 275 | from { 276 | opacity: 0; 277 | transform: translateY(30px); 278 | } 279 | to { 280 | opacity: 1; 281 | transform: translateY(0); 282 | } 283 | } 284 | 285 | .hero-section, 286 | .role-selection { 287 | animation: fadeInUp 0.8s ease-out; 288 | } 289 | 290 | .role-selection { 291 | animation-delay: 0.2s; 292 | } 293 | 294 | /* Hover effects for better interactivity */ 295 | .role-card { 296 | position: relative; 297 | overflow: hidden; 298 | } 299 | 300 | .role-card::before { 301 | content: ''; 302 | position: absolute; 303 | top: 0; 304 | left: -100%; 305 | width: 100%; 306 | height: 100%; 307 | background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent); 308 | transition: left 0.5s; 309 | } 310 | 311 | .role-card:hover::before { 312 | left: 100%; 313 | } 314 | 315 | 316 | .get-started-btn { 317 | background-color: #007bff; 318 | color: white; 319 | padding: 12px 24px; 320 | border: none; 321 | border-radius: 6px; 322 | cursor: pointer; 323 | font-size: 16px; 324 | } 325 | 326 | .get-started-btn:focus { 327 | outline: 3px solid #ffbf47; 328 | } 329 | .get-started-btn:hover { 330 | background-color: #0056b3; 331 | } -------------------------------------------------------------------------------- /skill-development.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Skill Development - Job Junction 7 | 8 | 155 | 156 | 157 | 158 | 159 |
160 |

Skill Development Hub 🚀

161 |

Explore free courses, certifications, and workshops curated for your career growth.

162 |
163 | 164 | 165 |
166 | 167 | 168 | 169 | 170 |
171 | 172 | 173 |
174 | 175 |
176 |

Frontend Web Development

177 |

Learn HTML, CSS, and JavaScript to build responsive websites.

178 |
179 | Duration: 6 weeks 180 | Beginner 181 | Certification ✔️ 182 |
183 | Enroll Now 184 |
185 | 186 |
187 |

Python for Data Science

188 |

Master Python libraries like Pandas and NumPy for data analysis.

189 |
190 | Duration: 8 weeks 191 | Intermediate 192 | Certification ✔️ 193 |
194 | Enroll Now 195 |
196 | 197 |
198 |

Effective Communication Skills

199 |

Boost your speaking, writing, and presentation skills.

200 |
201 | Duration: 4 weeks 202 | Beginner 203 | Certification ❌ 204 |
205 | Start Learning 206 |
207 | 208 |
209 |

Full Stack Web Development

210 |

Build modern applications using MERN stack.

211 |
212 | Duration: 10 weeks 213 | Advanced 214 | Certification ✔️ 215 |
216 | Enroll Now 217 |
218 |
219 | 220 | 252 | 253 | 254 | -------------------------------------------------------------------------------- /sitemap.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Sitemap - Modern Design 7 | 8 | 9 | 172 | 173 | 174 | 175 | 176 |
177 |

Explore Our Website Sitemap

178 |

Find all the important pages and resources in one place

179 | Explore Sitemap 180 |
181 | 182 | 183 |
184 | 185 | 186 |
187 |

Main Pages

188 | 196 |
197 | 198 |
199 |

Careers & Jobs

200 | 208 |
209 | 210 |
211 |

User Account

212 | 219 |
220 | 221 |
222 |

Learning & Development

223 | 228 |
229 | 230 |
231 |

Career Growth

232 | 240 |
241 | 242 |
243 | 244 | 245 | 246 | -------------------------------------------------------------------------------- /interview-prep.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Interview Preparation 7 | 8 | 182 | 183 | 184 | 185 |
186 |

Interview Preparation

187 |

Get ready for your next interview with common questions, tips, and a complete preparation checklist.

188 |
189 | 190 | 191 |
192 | 193 |

Common Interview Questions

194 |
    195 |
  • Tell me about yourself.
    • 196 |
  • What are your strengths and weaknesses?
    • 197 |
  • Why do you want to work here?
    • 198 |
  • Describe a challenge you faced and how you overcame it.
    • 199 |
  • Where do you see yourself in 5 years?
    • 200 |
201 |
202 | 203 | 204 |
205 | 206 |

In-person & Virtual Interview Tips

207 |
    208 |
  • Dress professionally, even for virtual interviews.
    • 209 |
  • Maintain good posture and eye contact.
    • 210 |
  • Test your camera, microphone, and internet before virtual interviews.
    • 211 |
  • Research the company and prepare questions.
    • 212 |
  • Be punctual and polite.
    • 213 |
214 |
215 | 216 | 217 |
218 | 219 |

Preparation Checklist

220 |
    221 |
  • Update resume and LinkedIn profile.
    • 222 |
  • Prepare examples of past projects or achievements.
    • 223 |
  • Practice common interview questions.
    • 224 |
  • Prepare answers for behavioral and technical questions.
    • 225 |
  • Keep necessary documents ready (resume, portfolio, ID).
    • 226 |
227 |
228 | 229 | 230 | 231 | 232 | 282 | 283 | 284 | -------------------------------------------------------------------------------- /tandc.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Terms & Conditions | Job Junction 7 | 8 | 9 | 10 | 199 | 200 | 201 | 202 | 203 |
204 |

Terms & Conditions

205 |

Understand your rights and responsibilities while using Job Junction.

206 |
207 | 208 | 209 |
210 | 211 |
212 | 213 |

1. Acceptance of Terms

214 |

By creating an account on Job Junction, you agree to follow all the terms and policies outlined here. If you disagree, please refrain from using the platform.

215 |
216 | 217 |
218 | 219 |

2. User Responsibilities

220 |
    221 |
  • Provide accurate and complete information during registration.
    • 222 |
  • Keep your password and login credentials secure.
    • 223 |
  • Do not misuse or disrupt the website’s functionality.
    • 224 |
225 |
226 | 227 |
228 | 229 |

3. Privacy Policy

230 |

Your personal data will be used for authentication and service improvements only. We value your privacy and will not share your data with third parties without consent.

231 |
232 | 233 |
234 | 235 |

4. Account Termination

236 |

Accounts that violate rules, engage in fraudulent activity, or misuse the system may be suspended or permanently removed.

237 |
238 | 239 |
240 | 241 |

5. Content Ownership

242 |

All designs, images, and code belong to the contributors of Job Junction. Reuse or redistribution without permission is not allowed.

243 |
244 | 245 |
246 | 247 |

6. Modifications to Terms

248 |

We may update these terms as needed. Continued use of your account means you accept any changes made.

249 |
250 | 251 |
252 | 253 |

7. Contact Us

254 |

Have questions? Reach out to us anytime through our Contact Page.

255 |
256 | 257 |
258 | 259 | 260 |
261 | 266 |
267 | 268 | 269 | 270 | ← Back to Sign Up 271 | 272 | 284 | 285 | 286 | 287 | -------------------------------------------------------------------------------- /faq.css: -------------------------------------------------------------------------------- 1 | /* Base */ 2 | body { 3 | font-family: Arial, sans-serif; 4 | background: #f9f9f9; 5 | margin: 0; 6 | padding: 0; 7 | } 8 | 9 | header { 10 | background: linear-gradient(45deg, rgb(115, 89, 208), rgb(71, 49, 176), rgb(146, 146, 217)); 11 | color: #fff; 12 | padding: 1.2rem; 13 | text-align: center; 14 | } 15 | header h1 { 16 | margin: 1rem; 17 | } 18 | #question-icon{ 19 | font-weight: 600; 20 | font-size: 4vh; 21 | margin: 3vh; 22 | display: inline-block; 23 | animation: bounceIcon 1.2s ease-in-out infinite; 24 | } 25 | 26 | @keyframes bounceIcon { 27 | 0%, 100% { 28 | transform: translateY(0); 29 | } 30 | 50% { 31 | transform: translateY(-8px); 32 | } 33 | } 34 | 35 | header p{ 36 | font-style: italic; 37 | } 38 | 39 | /* Search */ 40 | .search-box { 41 | max-width: 600px; 42 | margin: 20px auto; 43 | display: flex; 44 | justify-content: center; 45 | } 46 | .search-box input { 47 | width: 100%; 48 | padding: 10px; 49 | border: 2px solid #60a5fa; 50 | border-radius: 8px; 51 | font-size: 1rem; 52 | } 53 | 54 | /* FAQ container */ 55 | .faq-container { 56 | max-width: 800px; 57 | margin: auto; 58 | padding: 20px; 59 | } 60 | .category { 61 | margin-bottom: 30px; 62 | } 63 | .category h2 { 64 | background: linear-gradient(135deg, #b3a1e8, #2f055a); /* soft violet gradient */ 65 | color: #ffffff; 66 | padding: 12px 20px; 67 | border-radius: 10px; 68 | cursor: pointer; 69 | margin: 0 0 20px 0; 70 | font-size: 18px; 71 | font-weight: 600; 72 | box-shadow: 0 4px 12px rgba(160, 120, 255, 0.3); /* violet glow */ 73 | transition: all 0.3s ease; 74 | text-align: center; 75 | letter-spacing: 0.5px; 76 | } 77 | 78 | /* Questions */ 79 | .faq { 80 | background: #fff; 81 | margin: 10px 0; 82 | border-radius: 10px; 83 | overflow: hidden; 84 | box-shadow: 0 4px 8px rgba(0,0,0,0.1); 85 | transition: transform 0.3s ease; 86 | } 87 | .faq:hover { 88 | transform: translateY(-3px); 89 | } 90 | .faq-question { 91 | padding: 15px; 92 | cursor: pointer; 93 | display: flex; 94 | justify-content: space-between; 95 | align-items: center; 96 | font-weight: bold; 97 | } 98 | .faq-answer { 99 | max-height: 0; 100 | overflow: hidden; 101 | padding: 0 15px; 102 | background: #f4f4f4; 103 | transition: max-height 0.4s ease, padding 0.4s ease; 104 | } 105 | .faq.active .faq-answer { 106 | max-height: 300px; 107 | padding: 15px; 108 | } 109 | .icon { 110 | transition: transform 0.3s ease; 111 | background: radial-gradient(circle at center, #878df8 0%, #4640d9 100%); 112 | padding: 2px; 113 | color: white; 114 | border-radius: 50%; 115 | font-size: 0.75rem; 116 | transition: transform 0.3s ease; 117 | box-shadow: 118 | 0 0 6px #aaa9e7, 119 | 0 0 12px #955cf1, 120 | 0 0 18px #d6d6d680; 121 | } 122 | .faq.active .icon { 123 | transform: rotate(180deg); 124 | } 125 | 126 | /* Responsive */ 127 | @media (max-width: 768px) { 128 | .faq-question { 129 | font-size: 0.95rem; 130 | } 131 | } 132 | 133 | /* Category hover + animation */ 134 | .category h2 { 135 | transition: transform 0.3s ease, box-shadow 0.3s ease; 136 | animation: fadeSlide 0.8s ease forwards; 137 | } 138 | .category h2:hover { 139 | transform: scale(1.02); 140 | box-shadow: 0 4px 12px rgba(96, 165, 250, 0.6); 141 | } 142 | 143 | /* FAQ animation */ 144 | .faq { 145 | opacity: 0; 146 | transform: translateY(20px); 147 | animation: fadeSlide 0.6s ease forwards; 148 | transition: transform 0.3s ease, box-shadow 0.3s ease; 149 | } 150 | .faq:hover { 151 | transform: translateY(-3px) scale(1.01); 152 | box-shadow: 0 6px 14px rgba(0,0,0,0.15); 153 | } 154 | 155 | /* Answer expand animation */ 156 | .faq-answer { 157 | opacity: 0; 158 | transition: max-height 0.6s ease, padding 0.4s ease, opacity 0.4s ease; 159 | } 160 | .faq.active .faq-answer { 161 | opacity: 1; 162 | animation: glow 0.8s ease; 163 | } 164 | 165 | /* Keyframes */ 166 | @keyframes fadeSlide { 167 | from { opacity: 0; transform: translateY(30px); } 168 | to { opacity: 1; transform: translateY(0); } 169 | } 170 | @keyframes glow { 171 | 0% { box-shadow: inset 0 0 0 rgba(96,165,250,0); } 172 | 50% { box-shadow: inset 0 0 10px rgba(96,165,250,0.4); } 173 | 100% { box-shadow: inset 0 0 0 rgba(96,165,250,0); } 174 | } 175 | 176 | /* Search bar animations */ 177 | .search-box input { 178 | transition: all 0.3s ease-in-out; 179 | box-shadow: 0 0 0 rgba(96,165,250,0); 180 | } 181 | 182 | .search-box input:focus { 183 | outline: none; 184 | transform: scale(1.03); 185 | border-color: #3b82f6; 186 | box-shadow: 0 0 10px rgba(96,165,250,0.6); 187 | background: #f0f7ff; 188 | } 189 | 190 | .search-box input::placeholder { 191 | color: #999; 192 | transition: opacity 0.3s ease; 193 | } 194 | 195 | .search-box input:focus::placeholder { 196 | opacity: 0.5; 197 | } 198 | .search-box:hover{ 199 | outline: none; 200 | transform: scale(1.03); 201 | border-color: #3b82f6; 202 | box-shadow: 0 0 10px rgba(96,165,250,0.6); 203 | background: #f0f7ff; 204 | } 205 | 206 | .home-btn { 207 | display: inline-block; 208 | margin-left: 1rem; 209 | margin-top: 1rem; 210 | padding: 10px 20px; 211 | background: rgba(173, 216, 230, 0.3); /* baby blue frost */ 212 | color: #ffffff; 213 | text-decoration: none; 214 | border-radius: 12px; 215 | font-size: 16px; 216 | backdrop-filter: blur(10px); 217 | -webkit-backdrop-filter: blur(10px); 218 | border: 1px solid rgba(255, 255, 255, 0.4); 219 | box-shadow: 0 4px 12px rgba(135, 206, 250, 0.3); /* soft sky glow */ 220 | transition: all 0.3s ease; 221 | } 222 | 223 | .home-btn:hover { 224 | background: rgba(173, 216, 230, 0.5); 225 | box-shadow: 0 6px 18px rgba(135, 206, 250, 0.4); 226 | transform: scale(1.05); 227 | } 228 | 229 | footer { 230 | padding: 3rem var(--container-padding) 1.5rem; 231 | text-align: center; 232 | } 233 | 234 | #footer-statement p { 235 | font-size: 1.1rem; 236 | font-weight: 500; 237 | margin-bottom: 2rem; 238 | color: white; 239 | animation: fadeInDown 1s ease; 240 | } 241 | 242 | /* Footer Links Grid */ 243 | footer > div { 244 | display: flex; 245 | justify-content: center; 246 | flex-wrap: wrap; 247 | gap: 2rem; 248 | margin-bottom: 2rem; 249 | } 250 | 251 | .footer-links h3 { 252 | margin-bottom: 1rem; 253 | font-size: 1.2rem; 254 | color: grey; 255 | position: relative; 256 | } 257 | 258 | .footer-links ul { 259 | list-style: none; 260 | padding: 0; 261 | margin: 0; 262 | } 263 | 264 | .footer-links li { 265 | margin: 6px 0; 266 | } 267 | 268 | /* Clean Links */ 269 | .footer-links a { 270 | display: inline-block; 271 | background: none; 272 | border: none; 273 | padding: 0; 274 | margin: 0; 275 | color: white; 276 | text-decoration: none; 277 | font-size: 0.95rem; 278 | transition: color 0.3s ease, transform 0.3s ease; 279 | cursor: pointer; 280 | } 281 | 282 | .footer-links a:hover { 283 | color: rgb(213, 184, 111); 284 | transform: translateX(4px); 285 | } 286 | 287 | /* Social Icons */ 288 | .social-icons { 289 | color: white; 290 | margin: 2rem 0 1.5rem; 291 | display: flex; 292 | justify-content: center; 293 | gap: 1.2rem; 294 | } 295 | 296 | .social-icons a { 297 | font-size: 1.5rem; 298 | color: white; 299 | transition: transform 0.3s ease, color 0.3s ease; 300 | } 301 | 302 | .social-icons a:hover { 303 | transform: translateY(-5px) scale(1.1); 304 | color:white; 305 | } 306 | 307 | 308 | .footer { 309 | background: linear-gradient(45deg, rgb(142, 125, 201), rgb(47, 31, 129), rgb(58, 58, 148)); 310 | padding: 2rem 1rem; 311 | color: white; 312 | } 313 | 314 | .footer h3 { 315 | font-size: 0.9rem; 316 | font-weight: 400; 317 | margin-top: 1rem; 318 | } 319 | 320 | .footContainer { 321 | display: flex; 322 | justify-content: space-between; 323 | flex-wrap: wrap; 324 | padding: 0 16px; 325 | } 326 | 327 | .footer-section { 328 | margin-bottom: 20px; 329 | } 330 | 331 | .footer-section h3 { 332 | font-size: 1.5em; 333 | margin-bottom: 15px; 334 | } 335 | 336 | .footer-section ul { 337 | list-style: none; 338 | padding-left: 0; 339 | } 340 | 341 | .footer-section ul li { 342 | margin-bottom: 10px; 343 | } 344 | 345 | .footer-section ul li a { 346 | font-size: 1.1em; 347 | color: white; 348 | text-decoration: none; 349 | } 350 | 351 | .footer-section ul li a:hover { 352 | text-decoration: underline; 353 | } 354 | 355 | 356 | .footlinks { 357 | margin-top: 10px; 358 | display: flex; 359 | flex-wrap: wrap; 360 | justify-content: center; 361 | } 362 | 363 | .footlinks a { 364 | margin: 0 5px; 365 | color: white; 366 | text-decoration: none; 367 | } 368 | 369 | .footlinks a:hover { 370 | text-decoration: underline; 371 | } 372 | 373 | /* 📱 Responsive Footer */ 374 | @media (max-width: 768px) { 375 | .footContainer, 376 | .footcontent, 377 | footer > div { 378 | flex-direction: column; 379 | align-items: center; 380 | text-align: center; 381 | } 382 | 383 | .footer-links h3, 384 | .footer-section h3 { 385 | margin-top: 1rem; 386 | } 387 | 388 | .footlinks { 389 | justify-content: center; 390 | } 391 | } 392 | 393 | .footer-social a{ 394 | color: rgb(206, 198, 198); 395 | } 396 | 397 | .footer-social a:hover{ 398 | transform: scale(1.2); 399 | color: grey; 400 | } -------------------------------------------------------------------------------- /success-stories.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Success Stories 7 | 8 | 251 | 252 | 253 |
254 |

Success Stories

255 |

Real people, real opportunities. Discover how our portal helped users land their dream jobs.

256 |
257 | 258 |
259 |
260 | Profile 261 |

Priya Sharma

262 |

Software Engineer at Microsoft

263 |

Priya used our portal to apply for tech jobs and secured her dream role within 3 months.

264 | Read More 265 |
266 | 267 |
268 | Profile 269 |

Rahul Verma

270 |

Marketing Manager at Google

271 |

Rahul found several openings through our portal and landed his ideal role in digital marketing.

272 | Read More 273 |
274 | 275 |
276 | Profile 277 |

Ananya Patel

278 |

Data Analyst at Amazon

279 |

With the help of career resources and job alerts, Ananya secured her first role at Amazon.

280 | Read More 281 |
282 |
283 |
284 | Back to Home 285 |
286 | 287 |
288 |
289 |
290 |

Job Junction

291 |

Find internships, part-time jobs, and remote opportunities tailored for you.

292 |
293 |
294 |

Important Links

295 | Home 296 | Internships 297 | Part Time Jobs 298 | Remote Jobs 299 | Companies 300 |
301 |
302 |

Contact

303 |

+91 98765 43210

304 |

support@jobjunction.com

305 |
306 |
307 |

Follow Us

308 | 314 |
315 |
316 |
317 | © 2025 Job Junction. All rights reserved. 318 |
319 |
320 | 335 | 336 | 337 | -------------------------------------------------------------------------------- /open-source.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Open Source - Job Junction 7 | 8 | 243 | 244 | 245 | 246 | 247 |
248 | ← Back to Home 249 |

Namaste Contributors 🙏

250 |

We are proud to be part of the open-source community. Join us in building something amazing together!

251 |
252 | Know More about GSSoC 253 | Join Us on GitHub 254 |
255 |
256 | 257 | 258 |
259 |

Open Source Proudly Powered By:

260 | GSSoC Logo 261 |
262 | 263 | 264 |
265 |

Connect With Us

266 |

We’d love to hear from you! Whether you have ideas, feedback, or want to collaborate, reach out.

267 |

📍 Location: Remote

268 |

📧 Email: contact@jobportal.com

269 |
270 | 271 | 272 | 273 | 274 |
275 |
276 | 277 | 278 |
279 |
280 |
281 |

Job Junction

282 |

Find internships, part-time jobs, and remote opportunities tailored for you.

283 |
284 |
285 |

Important Links

286 | Home 287 | Internships 288 | Part Time Jobs 289 | Remote Jobs 290 | Companies 291 |
292 |
293 |

Contact

294 |

+91 98765 43210

295 |

support@jobjunction.com

296 |
297 |
298 |

Follow Us

299 | 305 |
306 |
307 |
308 | © 2025 Job Junction. All rights reserved. 309 |
310 |
311 | 312 | 325 | 326 | 327 | 328 | -------------------------------------------------------------------------------- /components/style.css: -------------------------------------------------------------------------------- 1 | body { 2 | font-family: Arial, sans-serif; 3 | background: #f8f9fa; 4 | margin: 0; 5 | padding: 0; 6 | } 7 | 8 | h1 { 9 | text-align: center; 10 | margin: 20px 0; 11 | color: #333; 12 | } 13 | 14 | /* Jobs Container */ 15 | .jobs-container { 16 | display: grid; 17 | grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); 18 | gap: 20px; 19 | padding: 20px; 20 | } 21 | 22 | /* Job Listing Card */ 23 | 24 | 25 | .jList { 26 | background: #fff; 27 | border-radius: 8px; 28 | padding: 15px; 29 | box-shadow: 0 2px 8px rgba(0,0,0,0.1); 30 | display: flex; 31 | flex-direction: column; 32 | justify-content: space-between; 33 | transition: transform 0.2s ease, box-shadow 0.2s ease; 34 | } 35 | 36 | .jList:hover { 37 | transform: translateY(-5px); 38 | box-shadow: 0 4px 12px rgba(0,0,0,0.15); 39 | } 40 | 41 | .jList img { 42 | max-width: 100px; 43 | max-height: 100px; 44 | object-fit: contain; 45 | margin-bottom: 10px; 46 | } 47 | 48 | .jList h3 { 49 | font-size: 18px; 50 | margin: 5px 0; 51 | color: #222; 52 | } 53 | 54 | .jList p { 55 | color: #555; 56 | font-size: 14px; 57 | } 58 | 59 | .type p { 60 | display: inline-block; 61 | padding: 4px 8px; 62 | background: #e3f2fd; 63 | color: #1976d2; 64 | border-radius: 4px; 65 | font-size: 12px; 66 | margin-top: 5px; 67 | } 68 | 69 | .job-links { 70 | text-decoration: none; 71 | color: inherit; 72 | } 73 | .job-links:hover { 74 | text-decoration: underline; 75 | } 76 | 77 | .save-job-btn { 78 | margin-top: 10px; 79 | padding: 8px; 80 | background: #2196f3; 81 | color: white; 82 | border: none; 83 | border-radius: 4px; 84 | cursor: pointer; 85 | transition: background 0.2s ease; 86 | } 87 | 88 | .save-job-btn:hover { 89 | background: #1976d2; 90 | } 91 | 92 | /* Back to Top Button */ 93 | #backToTopBtn { 94 | display: none; 95 | position: fixed; 96 | bottom: 20px; 97 | right: 20px; 98 | background: #2196f3; 99 | color: white; 100 | border: none; 101 | border-radius: 50%; 102 | padding: 10px 14px; 103 | cursor: pointer; 104 | font-size: 18px; 105 | box-shadow: 0 2px 8px rgba(0,0,0,0.2); 106 | transition: background 0.2s ease; 107 | } 108 | 109 | #backToTopBtn:hover { 110 | background: #1976d2; 111 | } 112 | 113 | #backToTopBtn.show { 114 | display: block; 115 | } 116 | /* Mobile Responsive Styles for Homepage */ 117 | /* Add this to your style.css file */ 118 | 119 | /* Mobile Navigation */ 120 | @media (max-width: 900px) { 121 | .navbar { 122 | padding: 0.5rem 1rem; 123 | flex-wrap: wrap; 124 | } 125 | 126 | .nav-menu { 127 | position: fixed; 128 | top: 70px; 129 | left: -100%; 130 | width: 100%; 131 | background: #fff; 132 | flex-direction: column; 133 | box-shadow: 0 4px 24px rgba(0,0,0,0.1); 134 | transition: left 0.3s ease; 135 | z-index: 999; 136 | padding: 1rem 0; 137 | } 138 | 139 | .nav-menu.active { 140 | left: 0; 141 | } 142 | 143 | .nav-menu li { 144 | margin: 0.5rem 1rem; 145 | } 146 | 147 | .nav-actions { 148 | display: none; 149 | } 150 | 151 | .mobile-toggle { 152 | display: block; 153 | background: none; 154 | border: none; 155 | font-size: 1.5rem; 156 | color: #3d55b4; 157 | cursor: pointer; 158 | } 159 | } 160 | 161 | /* Hero Section Mobile */ 162 | @media (max-width: 900px) { 163 | .hero { 164 | padding: 2rem 1rem; 165 | text-align: center; 166 | } 167 | 168 | .hero-container { 169 | flex-direction: column; 170 | gap: 2rem; 171 | } 172 | 173 | .hero-title { 174 | font-size: 2rem; 175 | line-height: 1.2; 176 | } 177 | 178 | .hero-description { 179 | font-size: 1rem; 180 | margin: 1rem 0; 181 | } 182 | 183 | .hero-actions { 184 | flex-direction: column; 185 | gap: 1rem; 186 | width: 100%; 187 | } 188 | 189 | .get-started-btn, 190 | .learn-more-btn { 191 | width: 100%; 192 | justify-content: center; 193 | padding: 0.8rem 1.5rem; 194 | } 195 | 196 | .hero-visual { 197 | width: 100%; 198 | max-width: 300px; 199 | margin: 0 auto; 200 | } 201 | } 202 | 203 | /* Features Section Mobile */ 204 | @media (max-width: 900px) { 205 | .features { 206 | padding: 2rem 1rem; 207 | } 208 | 209 | .features-grid { 210 | grid-template-columns: 1fr; 211 | gap: 1.5rem; 212 | } 213 | 214 | .feature-card { 215 | padding: 1.5rem; 216 | text-align: center; 217 | } 218 | 219 | .feature-icon { 220 | font-size: 2rem; 221 | margin-bottom: 1rem; 222 | } 223 | } 224 | 225 | /* Job Listing Section Mobile */ 226 | @media (max-width: 900px) { 227 | .job-page { 228 | flex-direction: column; 229 | } 230 | 231 | .filter-panel { 232 | position: static; 233 | width: 100%; 234 | margin-bottom: 1rem; 235 | max-height: 200px; 236 | overflow-y: auto; 237 | } 238 | 239 | .job-list { 240 | width: 100%; 241 | margin-left: 0; 242 | } 243 | 244 | .job-card { 245 | margin-bottom: 1rem; 246 | padding: 1rem; 247 | } 248 | } 249 | 250 | /* Footer Mobile */ 251 | @media (max-width: 900px) { 252 | .footer-main { 253 | flex-direction: column; 254 | text-align: center; 255 | gap: 2rem; 256 | } 257 | 258 | .footer-columns { 259 | flex-direction: column; 260 | gap: 1.5rem; 261 | } 262 | 263 | .footer-col { 264 | min-width: auto; 265 | text-align: center; 266 | } 267 | 268 | .footer-brand img { 269 | width: 48px; 270 | height: 48px; 271 | } 272 | 273 | .social-icons a { 274 | font-size: 1.3rem; 275 | margin: 0 0.5rem; 276 | } 277 | } 278 | 279 | /* Small Mobile Devices */ 280 | @media (max-width: 600px) { 281 | .hero-title { 282 | font-size: 1.8rem; 283 | } 284 | 285 | .hero-description { 286 | font-size: 0.95rem; 287 | } 288 | 289 | .container { 290 | padding: 0 1rem; 291 | } 292 | 293 | .features { 294 | padding: 1.5rem 0.5rem; 295 | } 296 | 297 | .feature-card { 298 | padding: 1rem; 299 | } 300 | 301 | .footer-content { 302 | padding: 0 1rem; 303 | } 304 | } 305 | 306 | /* Very Small Screens */ 307 | @media (max-width: 400px) { 308 | .hero { 309 | padding: 1.5rem 0.5rem; 310 | } 311 | 312 | .hero-title { 313 | font-size: 1.6rem; 314 | } 315 | 316 | .get-started-btn, 317 | .learn-more-btn { 318 | font-size: 0.95rem; 319 | padding: 0.7rem 1rem; 320 | } 321 | 322 | .feature-card h3 { 323 | font-size: 1.1rem; 324 | } 325 | 326 | .footer-col h4 { 327 | font-size: 1rem; 328 | } 329 | } 330 | /* Unified Filter Sidebar Styles */ 331 | .filter-sidebar { 332 | background: #fff; 333 | border-radius: 1.2rem; 334 | box-shadow: 0 4px 24px rgba(102,126,234,0.10); 335 | padding: 2rem 1.5rem; 336 | max-width: 300px; 337 | min-width: 220px; 338 | margin-right: 2rem; 339 | display: flex; 340 | flex-direction: column; 341 | gap: 1.2rem; 342 | } 343 | .filter-sidebar h3 { 344 | margin-bottom: 1rem; 345 | color: #3d55b4; 346 | font-size: 1.3rem; 347 | font-weight: 700; 348 | } 349 | .filter-group { 350 | margin-bottom: 1rem; 351 | } 352 | .filter-group label { 353 | display: block; 354 | font-weight: 500; 355 | margin-bottom: 0.5rem; 356 | color: #764ba2; 357 | } 358 | .filter-group select { 359 | width: 100%; 360 | padding: 0.5rem; 361 | border-radius: 8px; 362 | border: 1px solid #e5e7eb; 363 | font-size: 1rem; 364 | } 365 | .filter-actions { 366 | display: flex; 367 | gap: 1rem; 368 | margin-top: 1rem; 369 | } 370 | .apply-filter-btn, .clear-filter-btn { 371 | background: linear-gradient(135deg, #667eea, #764ba2); 372 | color: #fff; 373 | border: none; 374 | border-radius: 8px; 375 | padding: 0.5rem 1.2rem; 376 | font-weight: 600; 377 | cursor: pointer; 378 | transition: background 0.2s; 379 | } 380 | .clear-filter-btn { 381 | background: #e5e7eb; 382 | color: #3d55b4; 383 | } 384 | .apply-filter-btn:hover { 385 | background: linear-gradient(135deg, #764ba2, #667eea); 386 | } 387 | .clear-filter-btn:hover { 388 | background: #d1d5db; 389 | color: #764ba2; 390 | } 391 | @media (max-width: 900px) { 392 | .filter-sidebar { 393 | max-width: 100%; 394 | margin-right: 0; 395 | margin-bottom: 1.5rem; 396 | } 397 | } 398 | 399 | /* Header navbar improvements */ 400 | .navbar { 401 | display: flex; 402 | align-items: center; 403 | justify-content: space-between; 404 | padding: 1rem 2rem; 405 | background: #fff; 406 | box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1); 407 | } 408 | 409 | .nav-menu { 410 | display: flex; 411 | gap: 1.5rem; 412 | list-style: none; 413 | margin: 0; 414 | padding: 0; 415 | } 416 | 417 | .nav-link { 418 | text-decoration: none; 419 | color: #333; 420 | font-weight: 500; 421 | transition: color 0.2s ease; 422 | } 423 | 424 | .nav-link:hover, 425 | .nav-link.active { 426 | color: #3d55b4; 427 | } 428 | 429 | /* Theme toggle button styling */ 430 | .theme-toggle { 431 | background: none; 432 | border: none; 433 | cursor: pointer; 434 | font-size: 1.25rem; 435 | color: #333; 436 | transition: color 0.2s ease; 437 | } 438 | 439 | .theme-toggle:hover { 440 | color: #3d55b4; 441 | } 442 | .header .navbar { 443 | display: flex; 444 | align-items: center; 445 | justify-content: space-between; 446 | padding: 0.8rem 2rem; 447 | background: #fff; 448 | } 449 | 450 | .nav-brand { 451 | display: flex; 452 | align-items: center; 453 | } 454 | 455 | .nav-brand .logo { 456 | max-height: 50px; 457 | } 458 | 459 | .nav-menu { 460 | display: flex; 461 | gap: 1.5rem; 462 | list-style: none; 463 | margin: 0; 464 | padding: 0; 465 | align-items: center; 466 | } 467 | 468 | .theme-toggle { 469 | background: none; 470 | border: none; 471 | font-size: 1.25rem; 472 | cursor: pointer; 473 | color: #333; 474 | } 475 | 476 | body.dark .header .navbar { 477 | background: #1f1f1f; 478 | } -------------------------------------------------------------------------------- /workplace-communication.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Workplace Communication 7 | 8 | 249 | 250 | 251 | 252 |
253 |

Workplace Communication

254 |

Enhance your professional communication, teamwork, and conflict resolution skills.

255 |
256 | 257 | 258 |
259 |
260 | 261 |

Professional Communication

262 | 263 |
264 |
265 | 266 |

Teamwork & Collaboration

267 | 268 |
269 |
270 | 271 |

Conflict Resolution

272 | 273 |
274 |
275 | 276 | 277 |
278 |

279 |
    280 |
    281 | 282 | 283 | 284 | 329 | 379 | 380 | 381 | 382 | 383 | --------------------------------------------------------------------------------