├── .gitignore ├── .vscode └── settings.json ├── 404.html ├── CODE_OF_CONDUCT.md ├── CONTRIBUTING.md ├── LICENSE.md ├── README.md ├── SECURITY.md ├── assets ├── Badges │ ├── 2020-Arctic-Code-Vault-Contributor │ │ ├── PNG │ │ │ └── 2020ArcticCodeVaultBadge.png │ │ └── SVG │ │ │ └── README.md │ ├── Galaxy-Brain │ │ ├── PNG │ │ │ ├── GalaxyBrain.png │ │ │ ├── GalaxyBrain_Bronze.png │ │ │ ├── GalaxyBrain_Gold.png │ │ │ └── GalaxyBrain_Silver.png │ │ └── SVG │ │ │ └── README.md │ ├── GitHub-Sponsor │ │ ├── PNG │ │ │ └── GitHubSponsorBadge.png │ │ └── SVG │ │ │ └── README.md │ ├── Heart-on-your-sleeve │ │ ├── PNG │ │ │ ├── HeartOnYourSleeve.png │ │ │ ├── HeartOnYourSleeve_Bronze.png │ │ │ ├── HeartOnYourSleeve_Gold.png │ │ │ └── HeartOnYourSleeve_Silver.png │ │ └── SVG │ │ │ └── README.md │ ├── Mars-2020-Contributor │ │ ├── PNG │ │ │ └── Mars2020ContributorBadge.png │ │ └── SVG │ │ │ └── README.md │ ├── Open-Sourcerer │ │ ├── PNG │ │ │ ├── OpenSourcerer.png │ │ │ ├── OpenSourcerer_Bronze.png │ │ │ ├── OpenSourcerer_Gold.png │ │ │ └── OpenSourcerer_Silver.png │ │ └── SVG │ │ │ └── README.md │ ├── Pair-Extraordinaire │ │ ├── PNG │ │ │ ├── PairExtraordinaire.png │ │ │ ├── PairExtraordinaire_Bronze.png │ │ │ ├── PairExtraordinaire_Gold.png │ │ │ └── PairExtraordinaire_Silver.png │ │ └── SVG │ │ │ └── README.md │ ├── Pull-Shark │ │ ├── GIF │ │ │ └── PullShark_Animated.gif │ │ ├── PNG │ │ │ ├── PullShark.png │ │ │ ├── PullShark_Bronze.png │ │ │ ├── PullShark_Gold.png │ │ │ └── PullShark_Silver.png │ │ └── SVG │ │ │ └── README.md │ ├── Quick-Draw │ │ ├── PNG │ │ │ └── Skin-Tones │ │ │ │ ├── QuickDraw_SkinTone1.png │ │ │ │ ├── QuickDraw_SkinTone2.png │ │ │ │ ├── QuickDraw_SkinTone3.png │ │ │ │ ├── QuickDraw_SkinTone4.png │ │ │ │ ├── QuickDraw_SkinTone5.png │ │ │ │ └── QuickDraw_SkinTone6.png │ │ └── SVG │ │ │ └── README.md │ ├── Star-Struck │ │ ├── PNG │ │ │ ├── Skin-Tones │ │ │ │ ├── StarStruck_SkinTone1.png │ │ │ │ ├── StarStruck_SkinTone2.png │ │ │ │ ├── StarStruck_SkinTone3.png │ │ │ │ ├── StarStruck_SkinTone4.png │ │ │ │ ├── StarStruck_SkinTone5.png │ │ │ │ └── StarStruck_SkinTone6.png │ │ │ ├── StarStruck_Bronze.png │ │ │ ├── StarStruck_Gold.png │ │ │ └── StarStruck_Silver.png │ │ └── SVG │ │ │ └── README.md │ └── YOLO │ │ ├── PNG │ │ └── YOLO_Badge.png │ │ └── SVG │ │ └── README.md ├── GSSoC-Ext.png ├── GitHub_Logo │ ├── 172940773-7ef23b63-3356-4634-9e52-34f2676e2854.png │ ├── 172941149-31258408-bfc3-496a-8a58-e34794b21813.png │ ├── favicon-dark.png │ ├── favicon-dark.svg │ ├── fluidicon.png │ └── pinned-octocat.svg ├── Highlights │ ├── Developer-Program-Member │ │ └── SVG │ │ │ ├── DeveloperProgramMember_DarkMode.svg │ │ │ └── DeveloperProgramMember_LightMode.svg │ ├── GitHub-Campus-Expert │ │ └── SVG │ │ │ ├── GitHub-Campus-Expert_DarkMode.svg │ │ │ └── GitHub-Campus-Expert_LightMode.svg │ ├── GitHub-Pro │ │ └── SVG │ │ │ ├── GitHub-Pro_DarkMode.svg │ │ │ └── GitHub-Pro_LightMode.svg │ ├── Security-Advisory-Credit │ │ └── SVG │ │ │ ├── Security-Advisory-Credit_DarkMode.svg │ │ │ └── Security-Advisory-Credit_LightMode.svg │ └── Security-Bug-Bounty-Hunter │ │ └── SVG │ │ ├── Security-Bug-Bounty-Hunter_DarkMode.svg │ │ └── Security-Bug-Bounty-Hunter_LightMode.svg ├── Misc │ └── Emojis │ │ ├── 1f3c5.png │ │ ├── 1f3c6.png │ │ ├── 1f44b.png │ │ ├── 1f4c3.png │ │ ├── 1f525.png │ │ ├── 2139.png │ │ ├── 2728.png │ │ └── 274c.png ├── achievement-png.png ├── blog-png.png ├── c1.png ├── c2.png ├── c3.png ├── c4.png ├── c5.png ├── c6.png ├── c7.png ├── code-of-conduct.png ├── compare.png ├── events.png ├── hacktoberfest.png ├── recode-hive.png └── recode.png ├── blog.json ├── dashboard.css ├── dashboard.html ├── index.html ├── index.js ├── login.css ├── login.html ├── login.js ├── package-lock.json ├── package.json ├── pages ├── blog.html ├── compare.html ├── construction.html ├── events.html ├── exploremore.html ├── faq.html ├── githubbadge.html ├── help.html ├── recode-hive.png ├── recomendation.html ├── saved-blogs.html ├── skillMatcher.html ├── stats.html ├── testimonial.html └── videos.html ├── recode-hive.png ├── screenshots └── sanjay-kv-image.png ├── scripts ├── ScrollToTop.js ├── blog.js ├── capture-screenshot.js ├── compare.js ├── dark-mode.js ├── hamburger.js ├── profileModal.js ├── retriveprofile.js ├── revealelementsonscroll.js ├── speechRecognition.js └── videos.js ├── server.js └── styles ├── blog.css ├── compare.css ├── construction.css ├── construction.css.map ├── events.css ├── explore.css ├── faq.css ├── githubbadge.css ├── hamburger.css ├── help.css ├── modal.css ├── pagination.css ├── speech.css ├── styles.css ├── update login.js └── videos.css /.gitignore: -------------------------------------------------------------------------------- 1 | # Logs 2 | logs 3 | *.log 4 | npm-debug.log* 5 | yarn-debug.log* 6 | yarn-error.log* 7 | pnpm-debug.log* 8 | lerna-debug.log* 9 | 10 | node_modules 11 | dist 12 | dist-ssr 13 | *.local 14 | .env 15 | 16 | # Editor directories and files 17 | .vscode/* 18 | !.vscode/extensions.json 19 | .idea 20 | .DS_Store 21 | *.suo 22 | *.ntvs* 23 | *.njsproj 24 | *.sln 25 | *.sw? -------------------------------------------------------------------------------- /.vscode/settings.json: -------------------------------------------------------------------------------- 1 | { 2 | "liveServer.settings.port": 5501 3 | } -------------------------------------------------------------------------------- /404.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 404 PAGE 7 | 8 | 9 | 10 | 41 | 42 | 43 | 44 | 45 | 46 |
47 |
48 |
49 |
50 |
51 |
52 |

404

53 | 54 | 55 |
56 | 57 |
58 |

59 | Look like you're lost 60 |

61 | 62 |

The page you are looking for not available!

63 | 64 | Go to Home 65 |
66 |
67 |
68 |
69 |
70 |
71 | 72 | 73 | 74 | -------------------------------------------------------------------------------- /CODE_OF_CONDUCT.md: -------------------------------------------------------------------------------- 1 | # ✨Contributor Covenant Code of Conduct✨ 2 | 3 | --- 4 | 5 | ## 🌟Our Pledge 6 | --- 7 | We as members, contributors, and leaders pledge to make participation in our 8 | community a harassment-free experience for everyone, regardless of age, body 9 | size, visible or invisible disability, ethnicity, sex characteristics, gender 10 | identity and expression, level of experience, education, socio-economic status, 11 | nationality, personal appearance, race, religion, or sexual identity 12 | and orientation. 13 | 14 | We pledge to act and interact in ways that contribute to an open, welcoming, 15 | diverse, inclusive, and healthy community. 16 | 17 | --- 18 | ## 🚦Our Standards 19 | 20 | Examples of behavior that contributes to a positive environment for our 21 | community include: 22 | 23 | * 💖Demonstrating empathy and kindness toward other people 24 | * 🤝Being respectful of differing opinions, viewpoints, and experiences 25 | * 📝Giving and gracefully accepting constructive feedback 26 | * 🌱Accepting responsibility and apologizing to those affected by our mistakes, 27 | and learning from the experience 28 | * 🎯Focusing on what is best not just for us as individuals, but for the 29 | overall community 30 | 31 | Examples of unacceptable behavior include: 32 | 33 | * 🚫The use of sexualized language or imagery, and sexual attention or 34 | advances of any kind 35 | * 🛑Trolling, insulting or derogatory comments, and personal or political attacks 36 | * ⚠️Public or private harassment 37 | * 🔒Publishing others' private information, such as a physical or email 38 | address, without their explicit permission 39 | * ❌Other conduct which could reasonably be considered inappropriate in a 40 | professional setting 41 | 42 | --- 43 | 44 | ## 👨‍⚖️Enforcement Responsibilities 45 | 46 | Community leaders are responsible for clarifying and enforcing our standards of 47 | acceptable behavior and will take appropriate and fair corrective action in 48 | response to any behavior that they deem inappropriate, threatening, offensive, 49 | or harmful. 50 | 51 | Community leaders have the right and responsibility to remove, edit, or reject 52 | comments, commits, code, wiki edits, issues, and other contributions that are 53 | not aligned to this Code of Conduct, and will communicate reasons for moderation 54 | decisions when appropriate. 55 | 56 | --- 57 | ## 🌐Scope 58 | 59 | This Code of Conduct applies within all community spaces, and also applies when 60 | an individual is officially representing the community in public spaces. 61 | Examples of representing our community include using an official e-mail address, 62 | posting via an official social media account, or acting as an appointed 63 | representative at an online or offline event. 64 | 65 | --- 66 | ## 📋Pull Request Guidelines 67 | 68 | Contributions, including pull requests, must align with this Code of Conduct. 69 | All contributors are expected to submit work that fosters a positive and inclusive community. 70 | Inappropriate behavior, language, or content in pull requests may result in the rejection of 71 | the contribution and further enforcement actions as outlined in the guidelines. 72 | 73 | --- 74 | ## 🛡️Enforcement 75 | 76 | Instances of abusive, harassing, or otherwise unacceptable behavior may be 77 | reported to the community leaders responsible for enforcement at 78 | . 79 | All complaints will be reviewed and investigated promptly and fairly. 80 | 81 | All community leaders are obligated to respect the privacy and security of the 82 | reporter of any incident. 83 | 84 | --- 85 | ## 📖Enforcement Guidelines 86 | 87 | Community leaders will follow these Community Impact Guidelines in determining 88 | the consequences for any action they deem in violation of this Code of Conduct: 89 | 90 | ### 1. ✏️Correction 91 | 92 | **Community Impact**: Use of inappropriate language or other behavior deemed 93 | unprofessional or unwelcome in the community. 94 | 95 | **Consequence**: A private, written warning from community leaders, providing 96 | clarity around the nature of the violation and an explanation of why the 97 | behavior was inappropriate. A public apology may be requested. 98 | 99 | ### 2. ⚠️Warning 100 | 101 | **Community Impact**: A violation through a single incident or series 102 | of actions. 103 | 104 | **Consequence**: A warning with consequences for continued behavior. No 105 | interaction with the people involved, including unsolicited interaction with 106 | those enforcing the Code of Conduct, for a specified period of time. This 107 | includes avoiding interactions in community spaces as well as external channels 108 | like social media. Violating these terms may lead to a temporary or 109 | permanent ban. 110 | 111 | ### 3. ⏳Temporary Ban 112 | 113 | **Community Impact**: A serious violation of community standards, including 114 | sustained inappropriate behavior. 115 | 116 | **Consequence**: A temporary ban from any sort of interaction or public 117 | communication with the community for a specified period of time. No public or 118 | private interaction with the people involved, including unsolicited interaction 119 | with those enforcing the Code of Conduct, is allowed during this period. 120 | Violating these terms may lead to a permanent ban. 121 | 122 | ### 4. 🚫Permanent Ban 123 | 124 | **Community Impact**: Demonstrating a pattern of violation of community 125 | standards, including sustained inappropriate behavior, harassment of an 126 | individual, or aggression toward or disparagement of classes of individuals. 127 | 128 | **Consequence**: A permanent ban from any sort of public interaction within 129 | the community. 130 | 131 | --- 132 | ## 📜Attribution 133 | 134 | This Code of Conduct is adapted from the [Contributor Covenant][homepage], 135 | version 2.0, available at 136 | https://www.contributor-covenant.org/version/2/0/code_of_conduct.html. 137 | 138 | Community Impact Guidelines were inspired by [Mozilla's code of conduct 139 | enforcement ladder](https://github.com/mozilla/diversity). 140 | 141 | [homepage]: https://www.contributor-covenant.org 142 | 143 | For answers to common questions about this code of conduct, see the FAQ at 144 | https://www.contributor-covenant.org/faq. Translations are available at 145 | https://www.contributor-covenant.org/translations. -------------------------------------------------------------------------------- /CONTRIBUTING.md: -------------------------------------------------------------------------------- 1 | # Contributing to Awesome GitHub Profiles 2 | 3 | Welcome to our project! We're thrilled to have you contribute. Your efforts, big or small, make a difference. Please ensure that you follow our [Code of Conduct](CODE_OF_CONDUCT.md) in all interactions. 4 | 5 |
6 | 7 | # Need Help with the Basics? 🤔 8 | 9 | If you're new to Git and GitHub, no worries! Here are some useful resources: 10 | 11 | - [Forking a Repository](https://help.github.com/en/github/getting-started-with-github/fork-a-repo) 12 | - [Cloning a Repository](https://help.github.com/en/desktop/contributing-to-projects/creating-an-issue-or-pull-request) 13 | - [How to Create a Pull Request](https://opensource.com/article/19/7/create-pull-request-github) 14 | - [Getting Started with Git and GitHub](https://towardsdatascience.com/getting-started-with-git-and-github-6fcd0f2d4ac6) 15 | - [Learn GitHub from Scratch](https://docs.github.com/en/get-started/start-your-journey/git-and-github-learning-resources) 16 | 17 | # Project Structure 📂 18 | 19 | ```bash 20 | Awesome-github-profiles/ 21 | ├── .vscode/ # Visual Studio Code configuration files 22 | │ └── settings.json # Settings for the project 23 | ├── assets/ # Asset files 24 | ├── awesome-github-profiles/ # GitHub profiles showcase 25 | ├── node_modules/ # Project dependencies 26 | │ ├── .bin # Executable files 27 | │ ├── @babel/ # Babel packages 28 | │ ├── @puppeteer/browsers/ # Puppeteer browser binaries 29 | │ ├── @tootallnate/quickjs-emscripten/ 30 | │ ├── @types/ # Type definitions 31 | │ ├── agent-base/ # HTTP agent base 32 | │ ├── ansi-regex/ # ANSI regex utilities 33 | │ ├── ansi-styles/ # ANSI styles 34 | │ ├── argparse/ # Argument parsing library 35 | │ ├── ast-types/ # AST type definitions 36 | │ ├── ... # Other dependencies 37 | ├── pages/ # HTML pages 38 | │ ├── 404.html # 404 error page 39 | │ ├── blog.html # Blog page 40 | │ ├── compare.html # Comparison page 41 | │ ├── construction.html # Under construction page 42 | │ ├── events.html # Events page 43 | │ ├── exploremore.html # Explore more page 44 | │ ├── faq.html # Frequently Asked Questions page 45 | │ ├── githubbadge.html # GitHub badge page 46 | │ ├── help.html # Help page 47 | │ ├── saved-blogs.html # Saved blogs page 48 | │ └── screenshots/ # Screenshots directory 49 | ├── scripts/ # JavaScript files 50 | │ ├── ScrollToTop.js # Scroll to top functionality 51 | │ ├── blog.js # Blog related scripts 52 | │ ├── capture-screenshot.js # Screenshot capturing script 53 | │ ├── compare.js # Comparison functionality 54 | │ ├── dark-mode.js # Dark mode toggle 55 | │ ├── hamburger.js # Hamburger menu functionality 56 | │ ├── profileModal.js # Profile modal functionality 57 | │ ├── retriveprofile.js # Profile retrieval script 58 | │ ├── revealelementsonscroll.js # Reveal elements on scroll 59 | │ └── speechRecognition.js # Speech recognition functionality 60 | ├── styles/ # CSS styles 61 | │ ├── blog.css # Blog styles 62 | │ ├── compare.css # Comparison styles 63 | │ ├── construction.css # Construction styles 64 | │ ├── events.css # Events styles 65 | │ ├── explore.css # Explore more styles 66 | │ ├── faq.css # FAQ styles 67 | │ ├── githubbadge.css # GitHub badge styles 68 | │ ├── hamburger.css # Hamburger menu styles 69 | │ ├── help.css # Help page styles 70 | │ ├── modal.css # Modal styles 71 | │ ├── pagination.css # Pagination styles 72 | │ ├── speech.css # Speech recognition styles 73 | │ └── styles.css # General styles 74 | ├── .package-lock.json # Lock file for npm dependencies 75 | ├── CONTRIBUTING.md # Contribution guidelines 76 | ├── LICENSE.md # License file 77 | ├── README.md # Main README file with project details 78 | ├── blog.json # JSON data for blogs 79 | ├── dashboard.css # Dashboard styles 80 | ├── dashboard.html # Dashboard page 81 | ├── index.html # Main index page 82 | ├── login.css # Login page styles 83 | ├── login.html # Login page 84 | ├── login.js # Login functionality 85 | ├── package-lock.json # Lock file for npm dependencies 86 | ├── package.json # Project dependencies and scripts 87 | └── recode-hive.png # Preloader image 88 | 89 | 90 | ``` 91 | 92 | 93 | 94 | # First Pull Request ✨ 95 | 96 | 1. **Star this repository** 97 | Click on the top right corner marked as **Stars** at last. 98 | 99 | 2. **Fork this repository** 100 | Click on the top right corner marked as **Fork** at second last. 101 | 102 | 3. **Clone the forked repository** 103 | 104 | ```bash 105 | git clone https://github.com//Awesome-github-profilesgit 106 | ``` 107 | 108 | 4. **Navigate to the project directory** 109 | 110 | ```bash 111 | cd Awesome-github-profiles 112 | ``` 113 | 114 | 5. **Create a new branch** 115 | 116 | ```bash 117 | git checkout -b 118 | ``` 119 | 120 | 6. **To make changes** 121 | 122 | ```bash 123 | git add . 124 | ``` 125 | 126 | 7. **Now to commit** 127 | 128 | ```bash 129 | git commit -m "add comment according to your changes or addition of features inside this" 130 | ``` 131 | 132 | 8. **Push your local commits to the remote repository** 133 | 134 | ```bash 135 | git push -u origin 136 | ``` 137 | 138 | 9. **Create a Pull Request** 139 | 140 | 10. **Congratulations! 🎉 you've made your contribution** 141 | 142 |
143 | 144 | # Alternatively contribute using GitHub Desktop 🖥️ 145 | 146 | 1. **Open GitHub Desktop:** 147 | Launch GitHub Desktop and log in to your GitHub account if you haven't already. 148 | 149 | 2. **Clone the Repository:** 150 | - If you haven't cloned the repository yet, you can do so by clicking on the "File" menu and selecting "Clone Repository." 151 | - Choose the repository from the list of repositories on GitHub and clone it to your local machine. 152 | 153 | 3. **Switch to the Correct Branch:** 154 | - Ensure you are on the branch that you want to submit a pull request for. 155 | - If you need to switch branches, you can do so by clicking on the "Current Branch" dropdown menu and selecting the desired branch. 156 | 157 | 4. **Make Changes:** 158 | Make your changes to the code or files in the repository using your preferred code editor. 159 | 160 | 5. **Commit Changes:** 161 | - In GitHub Desktop, you'll see a list of the files you've changed. Check the box next to each file you want to include in the commit. 162 | - Enter a summary and description for your changes in the "Summary" and "Description" fields, respectively. Click the "Commit to " button to commit your changes to the local branch. 163 | 164 | 6. **Push Changes to GitHub:** 165 | After committing your changes, click the "Push origin" button in the top right corner of GitHub Desktop to push your changes to your forked repository on GitHub. 166 | 167 | 7. **Create a Pull Request:** 168 | - Go to the GitHub website and navigate to your fork of the repository. 169 | - You should see a button to "Compare & pull request" between your fork and the original repository. Click on it. 170 | 171 | 8. **Review and Submit:** 172 | - On the pull request page, review your changes and add any additional information, such as a title and description, that you want to include with your pull request. 173 | - Once you're satisfied, click the "Create pull request" button to submit your pull request. 174 | 175 | 9. **Wait for Review:** 176 | Your pull request will now be available for review by the project maintainers. They may provide feedback or ask for changes before merging your pull request into the main branch of the repository. 177 | 178 |
179 | 180 | 181 | # Good Coding Practices 🧑‍💻 182 | 183 | 1. **Follow the Project's Code Style** 184 | 185 | - Maintain consistency with the existing code style (indentation, spacing, comments). 186 | - Use meaningful and descriptive names for variables, functions, and classes. 187 | - Keep functions short and focused on a single task. 188 | - Avoid hardcoding values; instead, use constants or configuration files when possible. 189 | 190 | 2. **Write Clear and Concise Comments** 191 | 192 | - Use comments to explain why you did something, not just what you did. 193 | - Avoid unnecessary comments that state the obvious. 194 | - Document complex logic and functions with brief explanations to help others understand your thought -process. 195 | 196 | 3. **Keep Code DRY (Don't Repeat Yourself)** 197 | 198 | - Avoid duplicating code. Reuse functions, methods, and components whenever possible. 199 | - If you find yourself copying and pasting code, consider creating a new function or component. 200 | 201 | 4. **Write Tests** 202 | 203 | - Write unit tests for your functions and components. 204 | - Ensure your tests cover both expected outcomes and edge cases. 205 | - Run tests locally before making a pull request to make sure your changes don’t introduce new bugs. 206 | 207 | 5. **Code Reviews and Feedback** 208 | 209 | - Be open to receiving constructive feedback from other contributors. 210 | - Conduct code reviews for others and provide meaningful suggestions to improve the code. 211 | - Always refactor your code based on feedback to meet the project's standards. 212 | 213 |
214 | 215 | # Pull Request Process 🚀 216 | 217 | When submitting a pull request, please adhere to the following: 218 | 219 | 1. **Self-review your code** before submission. 220 | 2. Include a detailed description of the functionality you’ve added or modified. 221 | 3. Comment your code, especially in complex sections, to aid understanding. 222 | 4. Add relevant screenshots to assist in the review process. 223 | 5. Submit your PR using the provided template and hang tight; we'll review it as soon as possible! 🚀 224 | 225 |
226 | 227 | # Issue Report Process 📌 228 | 229 | To report an issue, follow these steps: 230 | 231 | 1. Navigate to the project's issues section :- [Issues](https://github.com/recodehive/Awesome-github-profilesissues) 232 | 2. Provide a clear and concise description of the issue. 233 | 3. **Avoid spamming** to claim an issue. Patience is key! 234 | 4. Wait until someone looks into your report. 235 | 5. Begin working on the issue only after you have been assigned to it. 🚀 236 | 237 |
238 | 239 | # Thank you for contributing 💗 240 | 241 | We truly appreciate your time and effort to help improve our project. Feel free to reach out if you have any questions or need guidance. Happy coding! 🚀 242 | 243 | ## 244 | -------------------------------------------------------------------------------- /LICENSE.md: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2024 Recode Hive 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 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | [![Typing SVG](https://readme-typing-svg.herokuapp.com?font=Fira+Code&weight=700&size=25&duration=2000&pause=1000¢er=true&width=900&lines=Awesome+GitHub+Profiles)](https://git.io/typing-svg) 2 | 3 | 4 | ## 📊 Project Metrics 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 |
🌟 Stars🍴 Forks🐛 Issues🔔 Open PRs🔕 Closed PRs
StarsForksIssuesOpen Pull RequestsClosed Pull Requests
26 | 27 | 28 | 29 | 30 |
31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 🔍Welcome to the awesome-github-profiles repo project! 🌟. 39 | 40 |

This README will guide you through the contribution process and provide essential information about the project.

41 |
42 | 43 | 44 | 45 | 46 | 47 |

Before Getting Started⭐

48 | 49 | Watch the below video: 50 | 51 | ![image](https://github.com/user-attachments/assets/e558ee7d-9e59-421b-ba6d-e72e726b9aab) 52 | 53 | 54 | ## Running in your local directory ✨ 55 | 56 | - npm install ( this will install all the required npm modules) 57 | 58 | 59 | 1. **Fork the Repository:** 60 | 61 | - Click the "Fork" button on the top right of the repository page. This creates a copy of the repository under your GitHub account. 62 | 63 | 2. **Clone Your Fork:** 64 | 65 | - Run the following command in your terminal: 66 | ```bash 67 | git clone https://github.com/YOUR_USERNAME/awesome-github-profiles.git 68 | ``` 69 | - This command downloads your fork to your local machine. 70 | 71 | 3. **Create a Branch:** 72 | 73 | - Navigate into the cloned repository and switch to the `gh-pages` branch: 74 | ```bash 75 | cd awesome-github-profiles 76 | git checkout gh-pages 77 | ``` 78 | - Create a new branch for your feature or fix: 79 | ```bash 80 | git checkout -b your-feature-branch 81 | ``` 82 | 83 | 4. **Make Your Changes:** 84 | 85 | - Implement your changes in your local repository. Make sure your code is clean and follows the project's coding style guidelines. 86 | 87 | 5. **Test Your Changes:** 88 | 89 | - If applicable, run tests to ensure that your changes do not break existing functionality. 90 | ```bash 91 | npm start 92 | ``` 93 | 6. **Stage Your Changes:** 94 | 95 | - Use the `git add` command to stage the changes you want to commit. 96 | ```bash 97 | git add . # Stages all modified files 98 | ``` 99 | - You can also stage specific files by replacing `.` with the file names: 100 | ```bash 101 | git add 102 | ``` 103 | 104 | 7. **Commit Your Changes:** 105 | 106 | - Commit your changes with a clear and descriptive message: 107 | ```bash 108 | git commit -m "Add a feature or fix a bug" 109 | ``` 110 | 111 | 8. **Push to Your Fork:** 112 | 113 | - Push your changes back to your forked repository: 114 | ```bash 115 | git push origin your-feature-branch 116 | ``` 117 | 118 | 9. **Create a Pull Request:** 119 | - Navigate to the original repository where you want to propose your changes. 120 | - Click on "New Pull Request" and follow the instructions to submit your changes for review. 121 | For even more detailed instructions on how to contribute, you can always check out the [CONTRIBUTING.md](./CONTRIBUTING.md) file. 122 |
123 | 124 | 125 | 126 | ## Screenshots of Features ✨ 127 | ### Home Page : 128 | ![image](https://github.com/user-attachments/assets/f8408ac2-ad5c-42c6-af1f-ea2dd635b77f) 129 | 130 | ### Login Page: 131 | ![image](https://github.com/user-attachments/assets/c8829b33-16d5-4628-b665-b8fb1dec2701) 132 | 133 | ### Add Profile: 134 | ![image](https://github.com/user-attachments/assets/cd395384-32cf-4b74-8425-b164e2ecad93) 135 | 136 | ### Github Badge: 137 | ![image](https://github.com/user-attachments/assets/fec17081-f750-4c12-bb0e-8ff23c89b408) 138 | 139 | 140 | 141 | ## Code of Conduct 142 | 143 | To foster a positive and inclusive community, please adhere to the following guidelines: 144 | 145 | - **Be Respectful:** Treat everyone with respect. Engage in constructive conversations. 146 | - **No Harassment:** Harassment, bullying, or discrimination will not be tolerated. 147 | - **Report Issues:** If you witness or experience any unacceptable behavior, please report it to the project maintainers. 148 | 149 | Please read the [Code of Conduct](CODE_OF_CONDUCT.md) for more clear understanding. 150 | 151 | 152 |

Tutorials

153 | 154 | - ["Create Impressive GitHub Portfolio"](https://www.youtube.com/watch?v=dkE4mVhwMB4) - _MTECHVIRAL_ 155 | 156 |

Contribute

157 | 158 | Contributions are always welcome! 159 | To ensure a smooth collaboration process, Follow these steps: 160 | 161 | 162 | 163 | 164 | 165 |

Special Thanks 🙇

166 | 167 | - [Dinesh Talwadker](https://github.com/dinxsh) [Hemant](https://github.com/Hemu21), [Nishant](https://github.com/nishant0708), [Ayushman]() for being early contributor for this repo! 168 | ## Contact Information 169 | 170 | If you have questions, suggestions, or feedback, please reach out via email at sanjay@recodehive.com.
You can also join our discussion forum [here](https://github.com/recodehive/awesome-github-profiles/discussions). We value open communication and are happy to help! 171 | 172 | ## Contributors ✨ 173 | 174 | Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/docs/en/emoji-key)): 175 | 176 | 177 | 178 | 179 | 180 | 181 | 182 | 183 | This project follows the [All-contributors](https://github.com/all-contributors/all-contributors) specification. Contributions of any kind welcome! 184 |

Each profile in this repository is designed to showcase individual GitHub contributions effectively.

185 | 186 | 187 | 188 | 189 | 190 | 191 | 192 | 193 | 194 | 195 |
MD REHAN
Sanjay KV

👀
196 | 197 | 198 | 199 | 200 | 201 | 202 |
203 | 204 | Happy opensource and here’s to your career success! 🎉 205 |
206 | ### re:codehive 2025 207 | 208 | [Website](https://recodehive.com/) | [Instagram](https://www.instagram.com/sanjay.viswa_/) | [LinkedIn](https://www.linkedin.com/in/sanjay-k-v/) | [Twitter](https://x.com/sanjay_kv_) | [YouTube](https://www.youtube.com/@RecodeHive)
209 | **🔔 Don’t miss a beat!**
210 | Subscribe to receive our newsletter directly in your inbox for the latest career insights & tailored to your journey.
211 | [![Subscribe to Our Newsletter](https://img.shields.io/badge/Subscribe%20to%20Our%20Newsletter-%F0%9F%93%A9-blue)](https://recodehive.substack.com/)
212 | 213 |
214 | 215 | ## Code Structure 216 | 217 | The repository is organized into several main directories and files, each serving a specific purpose. Below is an overview of the main directories and files: 218 | 219 | ### Directories 220 | 221 | - **assets**: Contains various assets such as images, icons, and other media files used in the project. 222 | - **pages**: Contains HTML files for different pages of the project, such as the home page, login page, and other feature-specific pages. 223 | - **scripts**: Contains JavaScript files that provide functionality to the project, such as handling user interactions, fetching data, and manipulating the DOM. 224 | - **styles**: Contains CSS files that define the styling and layout of the project. 225 | 226 | ### Files 227 | 228 | - **index.html**: The main HTML file that serves as the entry point for the project. 229 | - **README.md**: The main README file that provides an overview of the project, instructions for contributing, and other important information. 230 | - **CONTRIBUTING.md**: Contains guidelines and instructions for contributing to the project. 231 | - **CODE_OF_CONDUCT.md**: Outlines the code of conduct for contributors to ensure a positive and inclusive community. 232 | 233 | Each directory and file plays a crucial role in the overall structure and functionality of the project. Understanding the purpose of each component will help you navigate and contribute to the project more effectively. 234 | -------------------------------------------------------------------------------- /SECURITY.md: -------------------------------------------------------------------------------- 1 | Security Policy 2 | Supported Versions 3 | The following versions of Awesome-Github-Profiles are currently supported with security updates: 4 | 5 | Version Supported 6 | 1.x.x ✅ Supported 7 | 0.x.x ❌ Not supported 8 | Reporting a Vulnerability 9 | If you discover a security vulnerability in Awesome-Github-Profiles, we encourage you to report it as soon as possible. We will investigate all legitimate reports and do our best to quickly fix the issue. 10 | 11 | How to Report 12 | Please report vulnerabilities by emailing us at Awesome-Github-Profiles@gmail.com. Include as much detail as possible to help us identify and fix the issue swiftly. 13 | Do not share the vulnerability publicly until it has been addressed and a patch is available. 14 | 15 | Security Updates 16 | We will notify users via GitHub releases for any critical security updates. 17 | Minor security patches will be included in regular updates as needed. 18 | Security Best Practices 19 | Make sure to use the latest version of Awesome-Github-Profiles for the latest security features and patches. 20 | Follow password best practices, such as using strong, unique passwords for each account. 21 | Regularly update your dependencies to the latest versions. 22 | 23 | Acknowledgements 24 | We appreciate contributions from the community and researchers who help us improve the security of EzyShop. Thank you for keeping the platform secure for everyone! 25 | 26 | -------------------------------------------------------------------------------- /assets/Badges/2020-Arctic-Code-Vault-Contributor/PNG/2020ArcticCodeVaultBadge.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/recodehive/awesome-github-profiles/e87e6aa88cd2b2072a99c2599b6263113ba3d34c/assets/Badges/2020-Arctic-Code-Vault-Contributor/PNG/2020ArcticCodeVaultBadge.png -------------------------------------------------------------------------------- /assets/Badges/2020-Arctic-Code-Vault-Contributor/SVG/README.md: -------------------------------------------------------------------------------- 1 | An SVG version is not currently available. 2 | -------------------------------------------------------------------------------- /assets/Badges/Galaxy-Brain/PNG/GalaxyBrain.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/recodehive/awesome-github-profiles/e87e6aa88cd2b2072a99c2599b6263113ba3d34c/assets/Badges/Galaxy-Brain/PNG/GalaxyBrain.png -------------------------------------------------------------------------------- /assets/Badges/Galaxy-Brain/PNG/GalaxyBrain_Bronze.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/recodehive/awesome-github-profiles/e87e6aa88cd2b2072a99c2599b6263113ba3d34c/assets/Badges/Galaxy-Brain/PNG/GalaxyBrain_Bronze.png -------------------------------------------------------------------------------- /assets/Badges/Galaxy-Brain/PNG/GalaxyBrain_Gold.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/recodehive/awesome-github-profiles/e87e6aa88cd2b2072a99c2599b6263113ba3d34c/assets/Badges/Galaxy-Brain/PNG/GalaxyBrain_Gold.png -------------------------------------------------------------------------------- /assets/Badges/Galaxy-Brain/PNG/GalaxyBrain_Silver.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/recodehive/awesome-github-profiles/e87e6aa88cd2b2072a99c2599b6263113ba3d34c/assets/Badges/Galaxy-Brain/PNG/GalaxyBrain_Silver.png -------------------------------------------------------------------------------- /assets/Badges/Galaxy-Brain/SVG/README.md: -------------------------------------------------------------------------------- 1 | An SVG version is not currently available. 2 | -------------------------------------------------------------------------------- /assets/Badges/GitHub-Sponsor/PNG/GitHubSponsorBadge.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/recodehive/awesome-github-profiles/e87e6aa88cd2b2072a99c2599b6263113ba3d34c/assets/Badges/GitHub-Sponsor/PNG/GitHubSponsorBadge.png -------------------------------------------------------------------------------- /assets/Badges/GitHub-Sponsor/SVG/README.md: -------------------------------------------------------------------------------- 1 | An SVG version is not currently available. 2 | -------------------------------------------------------------------------------- /assets/Badges/Heart-on-your-sleeve/PNG/HeartOnYourSleeve.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/recodehive/awesome-github-profiles/e87e6aa88cd2b2072a99c2599b6263113ba3d34c/assets/Badges/Heart-on-your-sleeve/PNG/HeartOnYourSleeve.png -------------------------------------------------------------------------------- /assets/Badges/Heart-on-your-sleeve/PNG/HeartOnYourSleeve_Bronze.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/recodehive/awesome-github-profiles/e87e6aa88cd2b2072a99c2599b6263113ba3d34c/assets/Badges/Heart-on-your-sleeve/PNG/HeartOnYourSleeve_Bronze.png -------------------------------------------------------------------------------- /assets/Badges/Heart-on-your-sleeve/PNG/HeartOnYourSleeve_Gold.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/recodehive/awesome-github-profiles/e87e6aa88cd2b2072a99c2599b6263113ba3d34c/assets/Badges/Heart-on-your-sleeve/PNG/HeartOnYourSleeve_Gold.png -------------------------------------------------------------------------------- /assets/Badges/Heart-on-your-sleeve/PNG/HeartOnYourSleeve_Silver.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/recodehive/awesome-github-profiles/e87e6aa88cd2b2072a99c2599b6263113ba3d34c/assets/Badges/Heart-on-your-sleeve/PNG/HeartOnYourSleeve_Silver.png -------------------------------------------------------------------------------- /assets/Badges/Heart-on-your-sleeve/SVG/README.md: -------------------------------------------------------------------------------- 1 | An SVG version is not currently available. 2 | -------------------------------------------------------------------------------- /assets/Badges/Mars-2020-Contributor/PNG/Mars2020ContributorBadge.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/recodehive/awesome-github-profiles/e87e6aa88cd2b2072a99c2599b6263113ba3d34c/assets/Badges/Mars-2020-Contributor/PNG/Mars2020ContributorBadge.png -------------------------------------------------------------------------------- /assets/Badges/Mars-2020-Contributor/SVG/README.md: -------------------------------------------------------------------------------- 1 | An SVG version is not currently available. 2 | -------------------------------------------------------------------------------- /assets/Badges/Open-Sourcerer/PNG/OpenSourcerer.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/recodehive/awesome-github-profiles/e87e6aa88cd2b2072a99c2599b6263113ba3d34c/assets/Badges/Open-Sourcerer/PNG/OpenSourcerer.png -------------------------------------------------------------------------------- /assets/Badges/Open-Sourcerer/PNG/OpenSourcerer_Bronze.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/recodehive/awesome-github-profiles/e87e6aa88cd2b2072a99c2599b6263113ba3d34c/assets/Badges/Open-Sourcerer/PNG/OpenSourcerer_Bronze.png -------------------------------------------------------------------------------- /assets/Badges/Open-Sourcerer/PNG/OpenSourcerer_Gold.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/recodehive/awesome-github-profiles/e87e6aa88cd2b2072a99c2599b6263113ba3d34c/assets/Badges/Open-Sourcerer/PNG/OpenSourcerer_Gold.png -------------------------------------------------------------------------------- /assets/Badges/Open-Sourcerer/PNG/OpenSourcerer_Silver.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/recodehive/awesome-github-profiles/e87e6aa88cd2b2072a99c2599b6263113ba3d34c/assets/Badges/Open-Sourcerer/PNG/OpenSourcerer_Silver.png -------------------------------------------------------------------------------- /assets/Badges/Open-Sourcerer/SVG/README.md: -------------------------------------------------------------------------------- 1 | An SVG version is not currently available. 2 | -------------------------------------------------------------------------------- /assets/Badges/Pair-Extraordinaire/PNG/PairExtraordinaire.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/recodehive/awesome-github-profiles/e87e6aa88cd2b2072a99c2599b6263113ba3d34c/assets/Badges/Pair-Extraordinaire/PNG/PairExtraordinaire.png -------------------------------------------------------------------------------- /assets/Badges/Pair-Extraordinaire/PNG/PairExtraordinaire_Bronze.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/recodehive/awesome-github-profiles/e87e6aa88cd2b2072a99c2599b6263113ba3d34c/assets/Badges/Pair-Extraordinaire/PNG/PairExtraordinaire_Bronze.png -------------------------------------------------------------------------------- /assets/Badges/Pair-Extraordinaire/PNG/PairExtraordinaire_Gold.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/recodehive/awesome-github-profiles/e87e6aa88cd2b2072a99c2599b6263113ba3d34c/assets/Badges/Pair-Extraordinaire/PNG/PairExtraordinaire_Gold.png -------------------------------------------------------------------------------- /assets/Badges/Pair-Extraordinaire/PNG/PairExtraordinaire_Silver.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/recodehive/awesome-github-profiles/e87e6aa88cd2b2072a99c2599b6263113ba3d34c/assets/Badges/Pair-Extraordinaire/PNG/PairExtraordinaire_Silver.png -------------------------------------------------------------------------------- /assets/Badges/Pair-Extraordinaire/SVG/README.md: -------------------------------------------------------------------------------- 1 | An SVG version is not currently available. 2 | -------------------------------------------------------------------------------- /assets/Badges/Pull-Shark/GIF/PullShark_Animated.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/recodehive/awesome-github-profiles/e87e6aa88cd2b2072a99c2599b6263113ba3d34c/assets/Badges/Pull-Shark/GIF/PullShark_Animated.gif -------------------------------------------------------------------------------- /assets/Badges/Pull-Shark/PNG/PullShark.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/recodehive/awesome-github-profiles/e87e6aa88cd2b2072a99c2599b6263113ba3d34c/assets/Badges/Pull-Shark/PNG/PullShark.png -------------------------------------------------------------------------------- /assets/Badges/Pull-Shark/PNG/PullShark_Bronze.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/recodehive/awesome-github-profiles/e87e6aa88cd2b2072a99c2599b6263113ba3d34c/assets/Badges/Pull-Shark/PNG/PullShark_Bronze.png -------------------------------------------------------------------------------- /assets/Badges/Pull-Shark/PNG/PullShark_Gold.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/recodehive/awesome-github-profiles/e87e6aa88cd2b2072a99c2599b6263113ba3d34c/assets/Badges/Pull-Shark/PNG/PullShark_Gold.png -------------------------------------------------------------------------------- /assets/Badges/Pull-Shark/PNG/PullShark_Silver.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/recodehive/awesome-github-profiles/e87e6aa88cd2b2072a99c2599b6263113ba3d34c/assets/Badges/Pull-Shark/PNG/PullShark_Silver.png -------------------------------------------------------------------------------- /assets/Badges/Pull-Shark/SVG/README.md: -------------------------------------------------------------------------------- 1 | An SVG version is not currently available. 2 | -------------------------------------------------------------------------------- /assets/Badges/Quick-Draw/PNG/Skin-Tones/QuickDraw_SkinTone1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/recodehive/awesome-github-profiles/e87e6aa88cd2b2072a99c2599b6263113ba3d34c/assets/Badges/Quick-Draw/PNG/Skin-Tones/QuickDraw_SkinTone1.png -------------------------------------------------------------------------------- /assets/Badges/Quick-Draw/PNG/Skin-Tones/QuickDraw_SkinTone2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/recodehive/awesome-github-profiles/e87e6aa88cd2b2072a99c2599b6263113ba3d34c/assets/Badges/Quick-Draw/PNG/Skin-Tones/QuickDraw_SkinTone2.png -------------------------------------------------------------------------------- /assets/Badges/Quick-Draw/PNG/Skin-Tones/QuickDraw_SkinTone3.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/recodehive/awesome-github-profiles/e87e6aa88cd2b2072a99c2599b6263113ba3d34c/assets/Badges/Quick-Draw/PNG/Skin-Tones/QuickDraw_SkinTone3.png -------------------------------------------------------------------------------- /assets/Badges/Quick-Draw/PNG/Skin-Tones/QuickDraw_SkinTone4.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/recodehive/awesome-github-profiles/e87e6aa88cd2b2072a99c2599b6263113ba3d34c/assets/Badges/Quick-Draw/PNG/Skin-Tones/QuickDraw_SkinTone4.png -------------------------------------------------------------------------------- /assets/Badges/Quick-Draw/PNG/Skin-Tones/QuickDraw_SkinTone5.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/recodehive/awesome-github-profiles/e87e6aa88cd2b2072a99c2599b6263113ba3d34c/assets/Badges/Quick-Draw/PNG/Skin-Tones/QuickDraw_SkinTone5.png -------------------------------------------------------------------------------- /assets/Badges/Quick-Draw/PNG/Skin-Tones/QuickDraw_SkinTone6.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/recodehive/awesome-github-profiles/e87e6aa88cd2b2072a99c2599b6263113ba3d34c/assets/Badges/Quick-Draw/PNG/Skin-Tones/QuickDraw_SkinTone6.png -------------------------------------------------------------------------------- /assets/Badges/Quick-Draw/SVG/README.md: -------------------------------------------------------------------------------- 1 | An SVG version is not currently available. 2 | -------------------------------------------------------------------------------- /assets/Badges/Star-Struck/PNG/Skin-Tones/StarStruck_SkinTone1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/recodehive/awesome-github-profiles/e87e6aa88cd2b2072a99c2599b6263113ba3d34c/assets/Badges/Star-Struck/PNG/Skin-Tones/StarStruck_SkinTone1.png -------------------------------------------------------------------------------- /assets/Badges/Star-Struck/PNG/Skin-Tones/StarStruck_SkinTone2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/recodehive/awesome-github-profiles/e87e6aa88cd2b2072a99c2599b6263113ba3d34c/assets/Badges/Star-Struck/PNG/Skin-Tones/StarStruck_SkinTone2.png -------------------------------------------------------------------------------- /assets/Badges/Star-Struck/PNG/Skin-Tones/StarStruck_SkinTone3.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/recodehive/awesome-github-profiles/e87e6aa88cd2b2072a99c2599b6263113ba3d34c/assets/Badges/Star-Struck/PNG/Skin-Tones/StarStruck_SkinTone3.png -------------------------------------------------------------------------------- /assets/Badges/Star-Struck/PNG/Skin-Tones/StarStruck_SkinTone4.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/recodehive/awesome-github-profiles/e87e6aa88cd2b2072a99c2599b6263113ba3d34c/assets/Badges/Star-Struck/PNG/Skin-Tones/StarStruck_SkinTone4.png -------------------------------------------------------------------------------- /assets/Badges/Star-Struck/PNG/Skin-Tones/StarStruck_SkinTone5.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/recodehive/awesome-github-profiles/e87e6aa88cd2b2072a99c2599b6263113ba3d34c/assets/Badges/Star-Struck/PNG/Skin-Tones/StarStruck_SkinTone5.png -------------------------------------------------------------------------------- /assets/Badges/Star-Struck/PNG/Skin-Tones/StarStruck_SkinTone6.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/recodehive/awesome-github-profiles/e87e6aa88cd2b2072a99c2599b6263113ba3d34c/assets/Badges/Star-Struck/PNG/Skin-Tones/StarStruck_SkinTone6.png -------------------------------------------------------------------------------- /assets/Badges/Star-Struck/PNG/StarStruck_Bronze.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/recodehive/awesome-github-profiles/e87e6aa88cd2b2072a99c2599b6263113ba3d34c/assets/Badges/Star-Struck/PNG/StarStruck_Bronze.png -------------------------------------------------------------------------------- /assets/Badges/Star-Struck/PNG/StarStruck_Gold.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/recodehive/awesome-github-profiles/e87e6aa88cd2b2072a99c2599b6263113ba3d34c/assets/Badges/Star-Struck/PNG/StarStruck_Gold.png -------------------------------------------------------------------------------- /assets/Badges/Star-Struck/PNG/StarStruck_Silver.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/recodehive/awesome-github-profiles/e87e6aa88cd2b2072a99c2599b6263113ba3d34c/assets/Badges/Star-Struck/PNG/StarStruck_Silver.png -------------------------------------------------------------------------------- /assets/Badges/Star-Struck/SVG/README.md: -------------------------------------------------------------------------------- 1 | An SVG version is not currently available. 2 | -------------------------------------------------------------------------------- /assets/Badges/YOLO/PNG/YOLO_Badge.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/recodehive/awesome-github-profiles/e87e6aa88cd2b2072a99c2599b6263113ba3d34c/assets/Badges/YOLO/PNG/YOLO_Badge.png -------------------------------------------------------------------------------- /assets/Badges/YOLO/SVG/README.md: -------------------------------------------------------------------------------- 1 | An SVG version is not currently available. 2 | -------------------------------------------------------------------------------- /assets/GSSoC-Ext.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/recodehive/awesome-github-profiles/e87e6aa88cd2b2072a99c2599b6263113ba3d34c/assets/GSSoC-Ext.png -------------------------------------------------------------------------------- /assets/GitHub_Logo/172940773-7ef23b63-3356-4634-9e52-34f2676e2854.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/recodehive/awesome-github-profiles/e87e6aa88cd2b2072a99c2599b6263113ba3d34c/assets/GitHub_Logo/172940773-7ef23b63-3356-4634-9e52-34f2676e2854.png -------------------------------------------------------------------------------- /assets/GitHub_Logo/172941149-31258408-bfc3-496a-8a58-e34794b21813.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/recodehive/awesome-github-profiles/e87e6aa88cd2b2072a99c2599b6263113ba3d34c/assets/GitHub_Logo/172941149-31258408-bfc3-496a-8a58-e34794b21813.png -------------------------------------------------------------------------------- /assets/GitHub_Logo/favicon-dark.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/recodehive/awesome-github-profiles/e87e6aa88cd2b2072a99c2599b6263113ba3d34c/assets/GitHub_Logo/favicon-dark.png -------------------------------------------------------------------------------- /assets/GitHub_Logo/favicon-dark.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /assets/GitHub_Logo/fluidicon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/recodehive/awesome-github-profiles/e87e6aa88cd2b2072a99c2599b6263113ba3d34c/assets/GitHub_Logo/fluidicon.png -------------------------------------------------------------------------------- /assets/GitHub_Logo/pinned-octocat.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 5 | 11 | 12 | -------------------------------------------------------------------------------- /assets/Highlights/Developer-Program-Member/SVG/DeveloperProgramMember_DarkMode.svg: -------------------------------------------------------------------------------- 1 | 5 | 6 | -------------------------------------------------------------------------------- /assets/Highlights/Developer-Program-Member/SVG/DeveloperProgramMember_LightMode.svg: -------------------------------------------------------------------------------- 1 | 5 | 6 | -------------------------------------------------------------------------------- /assets/Highlights/GitHub-Campus-Expert/SVG/GitHub-Campus-Expert_DarkMode.svg: -------------------------------------------------------------------------------- 1 | 5 | 6 | -------------------------------------------------------------------------------- /assets/Highlights/GitHub-Campus-Expert/SVG/GitHub-Campus-Expert_LightMode.svg: -------------------------------------------------------------------------------- 1 | 5 | 6 | -------------------------------------------------------------------------------- /assets/Highlights/GitHub-Pro/SVG/GitHub-Pro_DarkMode.svg: -------------------------------------------------------------------------------- 1 | 6 | 7 | -------------------------------------------------------------------------------- /assets/Highlights/GitHub-Pro/SVG/GitHub-Pro_LightMode.svg: -------------------------------------------------------------------------------- 1 | 6 | 7 | -------------------------------------------------------------------------------- /assets/Highlights/Security-Advisory-Credit/SVG/Security-Advisory-Credit_DarkMode.svg: -------------------------------------------------------------------------------- 1 | 5 | 6 | -------------------------------------------------------------------------------- /assets/Highlights/Security-Advisory-Credit/SVG/Security-Advisory-Credit_LightMode.svg: -------------------------------------------------------------------------------- 1 | 5 | 6 | -------------------------------------------------------------------------------- /assets/Highlights/Security-Bug-Bounty-Hunter/SVG/Security-Bug-Bounty-Hunter_DarkMode.svg: -------------------------------------------------------------------------------- 1 | 5 | 6 | -------------------------------------------------------------------------------- /assets/Highlights/Security-Bug-Bounty-Hunter/SVG/Security-Bug-Bounty-Hunter_LightMode.svg: -------------------------------------------------------------------------------- 1 | 5 | 6 | -------------------------------------------------------------------------------- /assets/Misc/Emojis/1f3c5.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/recodehive/awesome-github-profiles/e87e6aa88cd2b2072a99c2599b6263113ba3d34c/assets/Misc/Emojis/1f3c5.png -------------------------------------------------------------------------------- /assets/Misc/Emojis/1f3c6.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/recodehive/awesome-github-profiles/e87e6aa88cd2b2072a99c2599b6263113ba3d34c/assets/Misc/Emojis/1f3c6.png -------------------------------------------------------------------------------- /assets/Misc/Emojis/1f44b.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/recodehive/awesome-github-profiles/e87e6aa88cd2b2072a99c2599b6263113ba3d34c/assets/Misc/Emojis/1f44b.png -------------------------------------------------------------------------------- /assets/Misc/Emojis/1f4c3.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/recodehive/awesome-github-profiles/e87e6aa88cd2b2072a99c2599b6263113ba3d34c/assets/Misc/Emojis/1f4c3.png -------------------------------------------------------------------------------- /assets/Misc/Emojis/1f525.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/recodehive/awesome-github-profiles/e87e6aa88cd2b2072a99c2599b6263113ba3d34c/assets/Misc/Emojis/1f525.png -------------------------------------------------------------------------------- /assets/Misc/Emojis/2139.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/recodehive/awesome-github-profiles/e87e6aa88cd2b2072a99c2599b6263113ba3d34c/assets/Misc/Emojis/2139.png -------------------------------------------------------------------------------- /assets/Misc/Emojis/2728.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/recodehive/awesome-github-profiles/e87e6aa88cd2b2072a99c2599b6263113ba3d34c/assets/Misc/Emojis/2728.png -------------------------------------------------------------------------------- /assets/Misc/Emojis/274c.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/recodehive/awesome-github-profiles/e87e6aa88cd2b2072a99c2599b6263113ba3d34c/assets/Misc/Emojis/274c.png -------------------------------------------------------------------------------- /assets/achievement-png.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/recodehive/awesome-github-profiles/e87e6aa88cd2b2072a99c2599b6263113ba3d34c/assets/achievement-png.png -------------------------------------------------------------------------------- /assets/blog-png.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/recodehive/awesome-github-profiles/e87e6aa88cd2b2072a99c2599b6263113ba3d34c/assets/blog-png.png -------------------------------------------------------------------------------- /assets/c1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/recodehive/awesome-github-profiles/e87e6aa88cd2b2072a99c2599b6263113ba3d34c/assets/c1.png -------------------------------------------------------------------------------- /assets/c2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/recodehive/awesome-github-profiles/e87e6aa88cd2b2072a99c2599b6263113ba3d34c/assets/c2.png -------------------------------------------------------------------------------- /assets/c3.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/recodehive/awesome-github-profiles/e87e6aa88cd2b2072a99c2599b6263113ba3d34c/assets/c3.png -------------------------------------------------------------------------------- /assets/c4.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/recodehive/awesome-github-profiles/e87e6aa88cd2b2072a99c2599b6263113ba3d34c/assets/c4.png -------------------------------------------------------------------------------- /assets/c5.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/recodehive/awesome-github-profiles/e87e6aa88cd2b2072a99c2599b6263113ba3d34c/assets/c5.png -------------------------------------------------------------------------------- /assets/c6.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/recodehive/awesome-github-profiles/e87e6aa88cd2b2072a99c2599b6263113ba3d34c/assets/c6.png -------------------------------------------------------------------------------- /assets/c7.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/recodehive/awesome-github-profiles/e87e6aa88cd2b2072a99c2599b6263113ba3d34c/assets/c7.png -------------------------------------------------------------------------------- /assets/code-of-conduct.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/recodehive/awesome-github-profiles/e87e6aa88cd2b2072a99c2599b6263113ba3d34c/assets/code-of-conduct.png -------------------------------------------------------------------------------- /assets/compare.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/recodehive/awesome-github-profiles/e87e6aa88cd2b2072a99c2599b6263113ba3d34c/assets/compare.png -------------------------------------------------------------------------------- /assets/events.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/recodehive/awesome-github-profiles/e87e6aa88cd2b2072a99c2599b6263113ba3d34c/assets/events.png -------------------------------------------------------------------------------- /assets/hacktoberfest.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/recodehive/awesome-github-profiles/e87e6aa88cd2b2072a99c2599b6263113ba3d34c/assets/hacktoberfest.png -------------------------------------------------------------------------------- /assets/recode-hive.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/recodehive/awesome-github-profiles/e87e6aa88cd2b2072a99c2599b6263113ba3d34c/assets/recode-hive.png -------------------------------------------------------------------------------- /assets/recode.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/recodehive/awesome-github-profiles/e87e6aa88cd2b2072a99c2599b6263113ba3d34c/assets/recode.png -------------------------------------------------------------------------------- /blog.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "category": "TECH", 4 | "title": "What is Github? Guide to Beginner", 5 | "author": "Shivlal", 6 | "date": "December 16, 2020", 7 | "comments": 0, 8 | "excerpt": "What is Git? For uploading your project to your Github account, you need to install Git first.", 9 | "image": "https://recodehive.com/wp-content/uploads/2020/12/GitHub-Tutorial-Recodehive-1024x576.jpg", 10 | "link": "https://recodehive.com/what-is-github-guide-to-beginner/" 11 | }, 12 | { 13 | "category": "DEV LABS GITHUB", 14 | "title": "How to create Github Account?", 15 | "author": "Sanjay KV", 16 | "date": "April 14, 2021", 17 | "comments": 0, 18 | "excerpt": "What is Github? Github is a way of version control your software development using Git. Github was founded in 2008.", 19 | "image": "https://recodehive.com/wp-content/uploads/2021/04/How-to-use-Github-1024x576.jpg", 20 | "link": "https://recodehive.com/how-to-create-github-account/" 21 | }, 22 | { 23 | "category": "DEV LABS GITHUB", 24 | "title": "How to install Git? Git Tutorial", 25 | "author": "Sanjay KV", 26 | "date": "April 14, 2021", 27 | "comments": 0, 28 | "excerpt": "Git helps us to version controlling. In this post we will look into git installation on windows system and...", 29 | "image": "https://recodehive.com/wp-content/uploads/2021/04/How-to-install-Git-Recodehive-1024x576.jpg", 30 | "link": "https://recodehive.com/how-to-install-git-git-tutorial/" 31 | }, 32 | { 33 | "category": "DEV LABS GITHUB", 34 | "title": "How to create repository in Github?", 35 | "author": "Sanjay KV", 36 | "date": "April 17, 2021", 37 | "comments": 0, 38 | "excerpt": "What is Clone/Push in Github? Once you created Repository and have done your part of the analysis...", 39 | "image": "https://recodehive.com/wp-content/uploads/2021/04/Start-with-Github-1-1024x576.jpg", 40 | "link": "https://recodehive.com/how-to-create-repository-in-github/" 41 | }, 42 | { 43 | "category": "DEV LABS GITHUB", 44 | "title": "Git Cheat Sheet. 50 Git commands |Git Tutorials", 45 | "author": "Sanjay KV", 46 | "date": "April 18, 2021", 47 | "comments": 0, 48 | "excerpt": "Headsup to the Github Cheatsheet. This is part of GitHub/Git Tutorials and a continuation of the previous post.", 49 | "image": "https://recodehive.com/wp-content/uploads/2021/04/Git-Cheatsheet-1024x576.jpg", 50 | "link": "https://recodehive.com/git-cheat-sheet-50-git-commands-git-tutorials/" 51 | }, 52 | { 53 | "category": "DEV LABS GITHUB", 54 | "title": "How to add Collaborators into GitHub Repository?", 55 | "author": "Sanjay KV", 56 | "date": "April 19, 2021", 57 | "comments": 0, 58 | "excerpt": "What is GitHub Collaboration? GitHub collaboration is a space where you can invite another developer to your repository.", 59 | "image": "https://recodehive.com/wp-content/uploads/2021/04/Inviting-Collaborators-to-Github-1024x576.jpg", 60 | "link": "https://recodehive.com/how-to-add-collaborators-into-github-repository/" 61 | }, 62 | { 63 | "category": "DEV LABS GITHUB", 64 | "title": "How to Create new branch and Merge in Github?", 65 | "author": "Sanjay KV", 66 | "date": "April 20, 2021", 67 | "comments": 0, 68 | "excerpt": "What is GitHub Collaboration? GitHub collaboration is a space where you can invite another developer to your repository.", 69 | "image": "https://recodehive.com/wp-content/uploads/2021/04/How-to-git-branch-1024x576.jpg", 70 | "link": "https://recodehive.com/how-to-create-new-branch-and-merge-in-github/" 71 | }, 72 | { 73 | "category": "DEV LABS GITHUB", 74 | "title": "How to resolve merge conflicts in GitHub?", 75 | "author": "Sanjay KV", 76 | "date": "April 23, 2021", 77 | "comments": 0, 78 | "excerpt": "Understanding GitHub Conflicts: Let’s imagine a case where two developers are working on one repository by creating 2 different branches.", 79 | "image": "https://recodehive.com/wp-content/uploads/2021/04/Github-working-with-conflicts-1024x576.jpg", 80 | "link": "https://recodehive.com/how-to-resolve-merge-conflicts-in-github/" 81 | }, 82 | { 83 | "category": "DEV LABS GITHUB", 84 | "title": "Push large files to Github | Git LFS tutorial", 85 | "author": "Sanjay KV", 86 | "date": "May 01, 2021", 87 | "comments": 0, 88 | "excerpt": "Failed to Push Some Refs | Git Error: I was trying to push a file size more than 100 MB to Github.", 89 | "image": "https://recodehive.com/wp-content/uploads/2021/05/GIT-LFS-recodehive-1024x576.jpg", 90 | "link": "https://recodehive.com/push-large-files-to-github-git-lfs-tutorial/" 91 | }, 92 | { 93 | "category": "Tech", 94 | "title": "How to host a website using GitHub", 95 | "author": "Sanjay KV", 96 | "date": "September 28, 2021", 97 | "comments": 0, 98 | "excerpt": "This is a part of GitHub’s complete Tutorial available on this website. We will look at how to host a website using GitHub.", 99 | "image": "https://recodehive.com/wp-content/uploads/2021/09/Github-Pages-hosting-1-1024x576.png", 100 | "link": "https://recodehive.com/how-to-host-a-website-using-github/" 101 | }, 102 | { 103 | "category": "Tech", 104 | "title": "How to Setup Custom Domain on GitHub Pages", 105 | "author": "Sanjay KV", 106 | "date": "October 2, 2021", 107 | "comments": 0, 108 | "excerpt": "This is a continuation of the previous post. We have already created a repository on the same; if not, please do that first.", 109 | "image": "https://recodehive.com/wp-content/uploads/2021/10/GitHub-Pages-custome-Domain-1024x576.png", 110 | "link": "https://recodehive.com/how-to-setup-custom-domain-on-github-pages/" 111 | }, 112 | { 113 | "category": "Tech", 114 | "title": "How to Fork a Repository in Github", 115 | "author": "Sanjay KV", 116 | "date": "October 4, 2021", 117 | "comments": 0, 118 | "excerpt": "What is Forking in GitHub? Forking an existing GitHub repository helps to create a copy of the main repository that you can modify.", 119 | "image": "https://recodehive.com/wp-content/uploads/2021/10/GitHub-Forking-1024x576.png", 120 | "link": "https://recodehive.com/how-to-fork-a-repository-in-github/" 121 | }, 122 | { 123 | "category": "DEV LABS GITHUB", 124 | "title": "How to Make Organization visible in GitHub", 125 | "author": "Sanjay KV", 126 | "date": "November 24, 2021", 127 | "comments": 0, 128 | "excerpt": "Understanding GitHub Organizations: Let’s imagine a case where two developers are working on one repository by creating two different branches.", 129 | "image": "https://recodehive.com/wp-content/uploads/2021/11/Make-Organization-Public-1024x576.jpg", 130 | "link": "https://recodehive.com/how-to-make-organization-visible-in-github/" 131 | }, 132 | { 133 | "category": "Tech", 134 | "title": "Hacktoberfest – How to Find and Contribute to Beginner-Friendly Projects", 135 | "author": "Sowmiya V", 136 | "date": "September 25, 2022", 137 | "comments": 0, 138 | "excerpt": "Hacktoberfest is an annual event that encourages people to contribute to open-source projects. The event takes place throughout the month of October.", 139 | "image": "https://recodehive.com/wp-content/uploads/202 140 | -------------------------------------------------------------------------------- /dashboard.css: -------------------------------------------------------------------------------- 1 | @import url("https://fonts.googleapis.com/css2?family=Poppins:wght@200;300;400;500;600;700;800&display=swap"); 2 | 3 | * { 4 | margin: 0; 5 | padding: 0; 6 | box-sizing: border-box; 7 | font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif; 8 | } 9 | 10 | body, input { 11 | font-family: "Poppins", sans-serif; 12 | } 13 | 14 | .container { 15 | min-height: 100vh; 16 | width: 100%; 17 | background-color: #f4f4f4; 18 | display: flex; 19 | justify-content: center; 20 | align-items: center; 21 | position: relative; 22 | overflow: hidden; 23 | } 24 | 25 | .dashboard-content { 26 | background-color: #ffffff; 27 | padding: 2rem; 28 | border-radius: 10px; 29 | box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1); 30 | text-align: center; 31 | width: 100%; 32 | max-width: 700px; 33 | } 34 | 35 | h1 { 36 | font-size: 2.5rem; 37 | color: #333; 38 | margin-bottom: 1.5rem; 39 | } 40 | 41 | h2 { 42 | font-size: 1.8rem; 43 | color: #444; 44 | margin-bottom: 1rem; 45 | } 46 | 47 | ul { 48 | list-style-type: disc; 49 | padding-left: 20px; 50 | text-align: left; 51 | color: #555; 52 | } 53 | 54 | ul li { 55 | margin-bottom: 10px; 56 | } 57 | 58 | ul li a { 59 | color: #007bff; 60 | text-decoration: none; 61 | font-weight: 500; 62 | } 63 | 64 | ul li a:hover { 65 | text-decoration: underline; 66 | color: #0056b3; 67 | } 68 | 69 | .section { 70 | margin: 2rem 0; 71 | } 72 | 73 | .homeBtn { 74 | position: absolute; 75 | top: 20px; 76 | left: 20px; 77 | background: #000000; 78 | color: #ffffff; 79 | padding: 10px 20px; 80 | border-radius: 10px; 81 | font-size: 1rem; 82 | font-weight: 500; 83 | text-decoration: none; 84 | cursor: pointer; 85 | transition: 0.3s; 86 | } 87 | 88 | .homeBtn:hover { 89 | background-color: #444444; 90 | } 91 | 92 | /* Responsive styles */ 93 | @media (max-width: 768px) { 94 | .dashboard-content { 95 | padding: 1.5rem; 96 | } 97 | 98 | h1 { 99 | font-size: 2rem; 100 | } 101 | 102 | h2 { 103 | font-size: 1.6rem; 104 | } 105 | 106 | ul li { 107 | font-size: 0.9rem; 108 | } 109 | 110 | .homeBtn { 111 | font-size: 0.9rem; 112 | } 113 | } 114 | -------------------------------------------------------------------------------- /dashboard.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Dashboard 7 | 8 | 9 | 10 | 11 |
12 | 15 | 16 |
17 |

Welcome,User

18 |
19 |

DASHBOARD

20 |

Achievements

21 |
    22 |
  • 100 Days Coding Challenge - Completed
  • 23 |
  • 200 Days Coding Challenge - In Progress
  • 24 |
  • Top Performer in Python - 2023
  • 25 |
26 |
27 | 28 |
29 |

Projects

30 | 35 |
36 |
37 |
38 | 39 | 40 | -------------------------------------------------------------------------------- /index.js: -------------------------------------------------------------------------------- 1 | // GSAP File 2 | var tl = gsap.timeline() 3 | tl.from(".navbar-left",{ 4 | opacity:0, 5 | y:-30, 6 | delay:1, 7 | duration:1 8 | }) 9 | tl.from(".navbar-right a",{ 10 | opacity:0, 11 | y:-30, 12 | duration:1, 13 | stagger:0.3 14 | }) 15 | tl.from(".toggle-switch",{ 16 | opacity:0, 17 | y:-30, 18 | duration:1 19 | }) 20 | -------------------------------------------------------------------------------- /login.css: -------------------------------------------------------------------------------- 1 | @import url("https://fonts.googleapis.com/css2?family=Poppins:wght@200;300;400;500;600;700;800&display=swap"); 2 | 3 | * { 4 | margin: 0; 5 | padding: 0; 6 | box-sizing: border-box; 7 | font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif; 8 | } 9 | 10 | body, 11 | input { 12 | font-family: "Poppins", sans-serif; 13 | } 14 | 15 | .container { 16 | position: relative; 17 | width: 100%; 18 | background-color: #ffffff; 19 | min-height: 100vh; 20 | overflow: hidden; 21 | } 22 | 23 | .forms-container { 24 | position: absolute; 25 | width: 100%; 26 | height: 100%; 27 | top: 0; 28 | left: 0; 29 | } 30 | 31 | .signin-signup { 32 | position: absolute; 33 | top: 50%; 34 | transform: translate(-50%, -50%); 35 | left: 75%; 36 | width: 50%; 37 | transition: 1s 0.7s ease-in-out; 38 | display: grid; 39 | grid-template-columns: 1fr; 40 | z-index: 5; 41 | } 42 | 43 | .auth-form { 44 | display: flex; 45 | align-items: center; 46 | justify-content: center; 47 | flex-direction: column; 48 | padding: 0rem 5rem; 49 | transition: all 0.2s 0.7s; 50 | overflow: hidden; 51 | grid-column: 1 / 2; 52 | grid-row: 1 / 2; 53 | } 54 | 55 | .github-login { 56 | cursor: pointer; 57 | background-color: transparent; 58 | border: none; 59 | outline: none; 60 | padding: 1rem; 61 | transition: transform 0.3s ease; 62 | } 63 | 64 | .github-login:hover { 65 | transform: scale(1.1); 66 | } 67 | 68 | .title { 69 | font-size: 2.2rem; 70 | color: #444; 71 | margin-bottom: 1rem; 72 | text-align: center; 73 | } 74 | 75 | .auth-text { 76 | color: #666; 77 | font-size: 1.1rem; 78 | margin-bottom: 2rem; 79 | text-align: center; 80 | } 81 | 82 | .social-media { 83 | display: flex; 84 | justify-content: center; 85 | margin-top: 1rem; 86 | } 87 | 88 | .panels-container { 89 | position: absolute; 90 | height: 100%; 91 | width: 100%; 92 | top: 0; 93 | left: 0; 94 | display: grid; 95 | grid-template-columns: repeat(2, 1fr); 96 | } 97 | 98 | .container:before { 99 | content: ""; 100 | position: absolute; 101 | height: 2000px; 102 | width: 2000px; 103 | top: -10%; 104 | right: 48%; 105 | transform: translateY(-50%); 106 | background-image: linear-gradient(-45deg, #000000 0%, #000000 100%); 107 | transition: 1.8s ease-in-out; 108 | border-radius: 50%; 109 | z-index: 6; 110 | } 111 | 112 | .image { 113 | width: 100%; 114 | transition: transform 1.1s ease-in-out; 115 | transition-delay: 0.4s; 116 | } 117 | 118 | .panel { 119 | display: flex; 120 | flex-direction: column; 121 | justify-content: space-around; 122 | text-align: center; 123 | z-index: 6; 124 | } 125 | 126 | .left-panel { 127 | pointer-events: all; 128 | padding: 4rem 17% 2rem 12%; 129 | } 130 | 131 | .panel .content { 132 | color: #ffffff; 133 | transition: transform 0.9s ease-in-out; 134 | transition-delay: 0.6s; 135 | } 136 | 137 | .panel h3 { 138 | font-weight: 600; 139 | line-height: 1; 140 | font-size: 1.5rem; 141 | } 142 | 143 | .panel p { 144 | font-size: 0.95rem; 145 | padding: 0.7rem 0; 146 | } 147 | 148 | .homeBtn { 149 | position: absolute; 150 | top: 20px; 151 | left: 20px; 152 | background: #ffffff; 153 | color: #ffffff; 154 | padding: 10px; 155 | border-radius: 10px; 156 | cursor: pointer; 157 | transition: 0.3s; 158 | text-decoration: none; 159 | z-index: 10; 160 | } 161 | 162 | .homeBtn:hover { 163 | transform: scale(1.1); 164 | } 165 | 166 | @media (max-width: 870px) { 167 | .container { 168 | min-height: 800px; 169 | height: 100vh; 170 | } 171 | 172 | .signin-signup { 173 | width: 100%; 174 | top: 95%; 175 | transform: translate(-50%, -100%); 176 | transition: 1s 0.8s ease-in-out; 177 | left: 50%; 178 | } 179 | 180 | .panels-container { 181 | grid-template-columns: 1fr; 182 | grid-template-rows: 1fr 2fr 1fr; 183 | } 184 | 185 | .panel { 186 | flex-direction: row; 187 | justify-content: space-around; 188 | align-items: center; 189 | padding: 2.5rem 8%; 190 | grid-column: 1 / 2; 191 | } 192 | 193 | .left-panel { 194 | grid-row: 1 / 2; 195 | } 196 | 197 | .image { 198 | width: 200px; 199 | transition: transform 0.9s ease-in-out; 200 | transition-delay: 0.6s; 201 | } 202 | 203 | .panel .content { 204 | padding-right: 15%; 205 | transition: transform 0.9s ease-in-out; 206 | transition-delay: 0.8s; 207 | } 208 | 209 | .panel h3 { 210 | font-size: 1.2rem; 211 | } 212 | 213 | .panel p { 214 | font-size: 0.7rem; 215 | padding: 0.5rem 0; 216 | } 217 | 218 | .container:before { 219 | width: 1500px; 220 | height: 1500px; 221 | transform: translateX(-50%); 222 | left: 30%; 223 | bottom: 68%; 224 | right: initial; 225 | top: initial; 226 | transition: 2s ease-in-out; 227 | } 228 | 229 | .auth-form { 230 | padding: 0 1.5rem; 231 | } 232 | } 233 | 234 | @media (max-width: 570px) { 235 | .auth-form { 236 | padding: 0 1rem; 237 | } 238 | 239 | .image { 240 | display: none; 241 | } 242 | 243 | .panel .content { 244 | padding: 0.5rem 1rem; 245 | } 246 | 247 | .container { 248 | padding: 1.5rem; 249 | } 250 | 251 | .container:before { 252 | bottom: 72%; 253 | left: 50%; 254 | } 255 | 256 | .title { 257 | font-size: 1.8rem; 258 | } 259 | 260 | .auth-text { 261 | font-size: 1rem; 262 | } 263 | } -------------------------------------------------------------------------------- /login.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | GitHub Login 7 | 8 | 9 | 10 | 11 | 12 |
13 |
14 | 25 |
26 | 27 |
28 | 29 | 30 | 31 | 32 | 33 |
34 |
35 |

Join Our Community

36 |
37 |

38 | Discover new experiences and profiles with awesome-github-profiles
39 | Get access to exclusive content and features.
40 |
41 | Connect with your GitHub account to begin. 42 |

43 |
44 | 45 |
46 |
47 |
48 | 49 | 50 | -------------------------------------------------------------------------------- /login.js: -------------------------------------------------------------------------------- 1 | document.addEventListener("DOMContentLoaded", () => { 2 | const github_auth_btn = document.getElementById("gh-auth-btn"); 3 | 4 | // GitHub Authentication Setup 5 | const GITHUB_CLIENT_ID = "Ov23liz64bw3989HVcKK"; 6 | const BACKEND_URL = "http://localhost:3000"; 7 | 8 | // GitHub button click handler 9 | const initiateGitHubAuth = () => { 10 | const authUrl = new URL('https://github.com/login/oauth/authorize'); 11 | authUrl.searchParams.append('client_id', GITHUB_CLIENT_ID); 12 | authUrl.searchParams.append('scope', 'user'); 13 | // Add parameters to force authorization screen 14 | authUrl.searchParams.append('prompt', 'consent'); 15 | // Clear any existing sessions 16 | authUrl.searchParams.append('login', ''); 17 | window.location.href = authUrl.toString(); 18 | }; 19 | 20 | github_auth_btn.onclick = initiateGitHubAuth; 21 | 22 | // GitHub auth handler 23 | const handleGitHubAuth = () => { 24 | const params = new URLSearchParams(window.location.search); 25 | const code = params.get("code"); 26 | 27 | if (code) { 28 | console.log("OAuth code received:", code); 29 | getGhUser(code); 30 | } 31 | }; 32 | 33 | // Get GitHub user data 34 | const getGhUser = (code) => { 35 | console.log("Starting GitHub user fetch with code:", code); 36 | 37 | fetch(`${BACKEND_URL}/api/auth/github?code=${code}`) 38 | .then(res => { 39 | console.log("Auth response status:", res.status); 40 | if (!res.ok) { 41 | throw new Error(`HTTP error! status: ${res.status}`); 42 | } 43 | return res.json(); 44 | }) 45 | .then(response => { 46 | console.log("Auth response data:", response); 47 | if (!response.data || !response.data.access_token) { 48 | throw new Error('No access token received'); 49 | } 50 | 51 | const token = response.data.access_token; 52 | console.log("Received access token, fetching user data"); 53 | 54 | return fetch(`${BACKEND_URL}/api/auth/github/getUser`, { 55 | headers: { 56 | 'Authorization': `Bearer ${token}` 57 | } 58 | }); 59 | }) 60 | .then(res => { 61 | console.log("User data response status:", res.status); 62 | if (!res.ok) { 63 | throw new Error(`HTTP error! status: ${res.status}`); 64 | } 65 | return res.json(); 66 | }) 67 | .then(response => { 68 | console.log("User data response:", response); 69 | if (!response.user) { 70 | throw new Error('No user data received'); 71 | } 72 | 73 | const { name, email } = response.user; 74 | localStorage.setItem('user-info', JSON.stringify({ name, email })); 75 | localStorage.setItem('isLoggedIn', 'true'); 76 | 77 | // Clean up URL 78 | const cleanUrl = window.location.href.split('?')[0]; 79 | window.history.replaceState({}, '', cleanUrl); 80 | 81 | // Redirect to home page 82 | window.location.href = "/"; 83 | }) 84 | .catch(error => { 85 | console.error("Authentication error:", error); 86 | alert("Failed to authenticate with GitHub. Please try again."); 87 | }); 88 | }; 89 | 90 | // Handle GitHub auth on page load 91 | if (window.location.search.includes("code")) { 92 | handleGitHubAuth(); 93 | } 94 | 95 | // Handle GitHub auth on page load 96 | if (window.location.search.includes("code")) { 97 | handleGitHubAuth(); 98 | } 99 | }); -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "scripts": { 3 | "start": "nodemon server.js" 4 | }, 5 | "dependencies": { 6 | "axios": "^1.7.9", 7 | "cors": "^2.8.5", 8 | "dotenv": "^16.4.7", 9 | "express": "^4.21.2", 10 | "puppeteer": "^22.15.0" 11 | }, 12 | "devDependencies": { 13 | "nodemon": "^3.1.9" 14 | } 15 | } 16 | -------------------------------------------------------------------------------- /pages/construction.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Cranes in a City 7 | 8 | 9 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 55 |
56 |

{ Under construction }

57 |
58 | 59 | 60 | 61 | 62 | -------------------------------------------------------------------------------- /pages/exploremore.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Code of Conduct | GirlScript Summer of Code 2024 | GirlScript Foundation India 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 49 |
50 | Github-Badge 51 | Events 52 | Blog 53 | Add Profile 55 | Login 56 |
57 | 58 | 64 |
65 |
66 |
67 |
68 |
69 |

70 | Code of  71 | Conduct 72 |

73 |
74 |
75 | 76 |
77 |
78 |
79 |
80 |
1
81 |

Do not spam.

82 |
83 |

If any member is found spamming, they will face consequences. Spamming includes 84 | excessive copy-pastes, meme/links/GIF spam, phishing links, NSFW content, and more.

85 |
86 | 87 |
88 |
89 |
2
90 |

No harassment or insults.

91 |
92 |

Harassment, insults, threats, gender-based insults, and cyberbullying will not be 93 | tolerated. Organizers will take strict action on any reported incidents.

94 |
95 | 96 |
97 |
98 |
3
99 |

Respect others' privacy.

100 |
101 |

Respect personal boundaries. Sharing sensitive information without consent or 102 | invading privacy will result in immediate action by organizers.

103 |
104 |
105 |
106 |
107 | 108 | 109 |
110 | 148 | 149 | 156 | 157 | 160 | 161 |
162 | 163 | 164 | 170 | 171 | 172 | 173 | 174 | 175 | 176 | 177 | -------------------------------------------------------------------------------- /pages/recode-hive.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/recodehive/awesome-github-profiles/e87e6aa88cd2b2072a99c2599b6263113ba3d34c/pages/recode-hive.png -------------------------------------------------------------------------------- /pages/recomendation.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | GitHub Project Recommendation Engine 8 | 9 | 138 | 139 | 140 | 141 |
142 |

GitHub Project Recommendation Engine

143 |
144 | 145 | 146 |
147 |
148 |
149 | 150 | 272 | 273 | 274 | -------------------------------------------------------------------------------- /pages/saved-blogs.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | Saved Blogs 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 51 |
52 | Events 53 | Github-Badge 54 | Blog 55 | Add Profile 56 |
57 | 58 | 64 |
65 |
66 |

Saved Blogs

67 | 73 |
74 | All Categories 75 | Dev Labs Github 76 | Tech 77 |
78 |
79 |
80 | 115 | 116 | 123 | 124 | 125 | 126 | 127 | 128 | 131 | 132 |
133 | 180 | 181 | 182 | -------------------------------------------------------------------------------- /pages/skillMatcher.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | GitHub User Skill Search 8 | 103 | 104 | 105 | 106 |
107 |

GitHub User Skill Search

108 |
109 | 110 | 111 |
112 |
113 |
114 | 115 | 181 | 182 | 183 | -------------------------------------------------------------------------------- /recode-hive.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/recodehive/awesome-github-profiles/e87e6aa88cd2b2072a99c2599b6263113ba3d34c/recode-hive.png -------------------------------------------------------------------------------- /screenshots/sanjay-kv-image.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/recodehive/awesome-github-profiles/e87e6aa88cd2b2072a99c2599b6263113ba3d34c/screenshots/sanjay-kv-image.png -------------------------------------------------------------------------------- /scripts/ScrollToTop.js: -------------------------------------------------------------------------------- 1 | document.addEventListener('scroll', () => { 2 | const button = document.getElementById('scrollToTop'); 3 | if (window.scrollY > 300) { // Adjust this value based on when you want the button to appear 4 | button.classList.add('show'); 5 | } else { 6 | button.classList.remove('show'); 7 | } 8 | }); 9 | 10 | document.getElementById('scrollToTop').addEventListener('click', () => { 11 | scrollToTop(); 12 | }); 13 | 14 | // Function to scroll to the top smoothly 15 | function scrollToTop() { 16 | const currentScroll = window.scrollY; 17 | const targetScroll = 0; // Scroll target 18 | const startTime = performance.now(); // Record the start time 19 | const duration = 500; // Duration of the scroll in milliseconds 20 | 21 | function animation(currentTime) { 22 | const elapsedTime = currentTime - startTime; // Calculate elapsed time 23 | const progress = Math.min(elapsedTime / duration, 1); // Normalize to [0, 1] 24 | 25 | // Ease out effect (you can adjust this for different easing) 26 | const easeOut = progress * (2 - progress); 27 | 28 | // Calculate the current scroll position 29 | const scrollPosition = currentScroll * (1 - easeOut); 30 | 31 | // Scroll to the calculated position 32 | window.scrollTo(0, scrollPosition); 33 | 34 | // Continue the animation if not finished 35 | if (progress < 1) { 36 | requestAnimationFrame(animation); // Request the next frame 37 | } 38 | } 39 | 40 | requestAnimationFrame(animation); // Start the animation 41 | } 42 | 43 | window.onscroll = function () { 44 | updateProgressBar(); 45 | }; 46 | 47 | 48 | function updateProgressBar() { 49 | var scrollTop = document.documentElement.scrollTop || document.body.scrollTop; 50 | var scrollHeight = document.documentElement.scrollHeight - document.documentElement.clientHeight; 51 | var scrollPercent = (scrollTop / scrollHeight) * 100; 52 | 53 | document.getElementById("progressBar").style.width = scrollPercent + "%"; 54 | } 55 | 56 | document.addEventListener("DOMContentLoaded", function () { 57 | const navbarLinks = document.querySelectorAll(".navbar-link"); 58 | 59 | // Function to check if the user is already on the current page 60 | function isSamePage(link) { 61 | return window.location.pathname === link.pathname; 62 | } 63 | 64 | // Smooth scroll to top function 65 | function scrollToTop() { 66 | window.scrollTo({ 67 | top: 0, 68 | behavior: "smooth", 69 | }); 70 | } 71 | 72 | navbarLinks.forEach(link => { 73 | link.addEventListener("click", function (event) { 74 | if (isSamePage(this)) { 75 | event.preventDefault(); // Prevent default link behavior if it's the same page 76 | scrollToTop(); 77 | } 78 | }); 79 | }); 80 | }); -------------------------------------------------------------------------------- /scripts/blog.js: -------------------------------------------------------------------------------- 1 | document.addEventListener("DOMContentLoaded", () => { 2 | fetch("../blog.json") 3 | .then((response) => response.json()) 4 | .then((data) => { 5 | const blogContainer = document.getElementById("blogContainer"); 6 | // Get saved blogs from local storage 7 | const savedBlogs = JSON.parse(localStorage.getItem("savedBlogs")) || []; 8 | 9 | // Render blogs 10 | data.forEach((blog) => { 11 | const blogCard = document.createElement("div"); 12 | blogCard.className = "blog-card blog-post"; 13 | blogCard.innerHTML = ` 14 |
15 | ${blog.title} 16 |
17 |
18 |
${blog.category}
19 |
${blog.title}
20 |
21 | ${blog.author} · 22 | ${blog.date} · 23 | ${ 24 | blog.comments 25 | } Comments 26 |
27 |
${blog.excerpt}
28 |
29 | Read More 32 |
${ 33 | isBlogSaved(blog) 34 | ? ' Unsave Blog' 35 | : ' Save Blog' 36 | }
37 |
38 |
39 | `; 40 | 41 | const saveBtn = blogCard.querySelector(".save-btn"); 42 | 43 | // Check if blog is already saved 44 | if (isBlogSaved(blog)) { 45 | saveBtn.classList.add("saved"); 46 | } 47 | 48 | saveBtn.addEventListener("click", () => { 49 | if (isBlogSaved(blog)) { 50 | unsaveBlog(blog); 51 | saveBtn.innerHTML = ' Save Blog'; 52 | saveBtn.classList.remove("saved"); 53 | showToast("Blog Unsaved", "unlike"); 54 | } else { 55 | saveBlog(blog); 56 | saveBtn.innerHTML = ' Unsave Blog'; 57 | saveBtn.classList.add("saved"); 58 | showToast("Blog Saved For Later", "like"); 59 | } 60 | }); 61 | 62 | const imageWrapper = blogCard.querySelector(".image-wrapper"); 63 | const blogTitle = blogCard.querySelector(".blogtitle"); 64 | 65 | imageWrapper.addEventListener("click", () => { 66 | window.location.href = blog.link; 67 | }); 68 | 69 | blogTitle.addEventListener("click", () => { 70 | window.location.href = blog.link; 71 | }); 72 | 73 | blogContainer.appendChild(blogCard); 74 | }); 75 | 76 | // Search functionality 77 | const searchInput = document.getElementById("search-input"); 78 | const searchButton = document.getElementById("search-btn"); 79 | searchButton.addEventListener("click", () => { 80 | const query = searchInput.value.toLowerCase(); 81 | const blogPosts = document.querySelectorAll(".blog-post"); 82 | 83 | blogPosts.forEach((post) => { 84 | const title = post.querySelector(".blogtitle").innerText.toLowerCase(); 85 | if (title.includes(query)) { 86 | post.style.display = "block"; 87 | } else { 88 | post.style.display = "none"; 89 | } 90 | }); 91 | }); 92 | 93 | // Search on Enter key press 94 | searchInput.addEventListener("keyup", (event) => { 95 | if (event.key === "Enter") { 96 | searchButton.click(); 97 | } 98 | }); 99 | }) 100 | .catch((error) => console.error("Error fetching blog data:", error)); 101 | 102 | function saveBlog(blog) { 103 | let savedBlogs = JSON.parse(localStorage.getItem("savedBlogs")) || []; 104 | if (!savedBlogs.find((b) => b.title === blog.title)) { 105 | savedBlogs.push(blog); 106 | localStorage.setItem("savedBlogs", JSON.stringify(savedBlogs)); 107 | } 108 | } 109 | 110 | function unsaveBlog(blog) { 111 | let savedBlogs = JSON.parse(localStorage.getItem("savedBlogs")) || []; 112 | savedBlogs = savedBlogs.filter((b) => b.title !== blog.title); 113 | localStorage.setItem("savedBlogs", JSON.stringify(savedBlogs)); 114 | } 115 | 116 | function isBlogSaved(blog) { 117 | const savedBlogs = JSON.parse(localStorage.getItem("savedBlogs")) || []; 118 | return savedBlogs.some((b) => b.title === blog.title); 119 | } 120 | 121 | // Function to create and show toast notifications 122 | function showToast(message, type) { 123 | const toastContainer = document.getElementById("toast-container"); 124 | // Create toast element 125 | const toast = document.createElement("div"); 126 | toast.className = `toast ${type} show`; 127 | toast.textContent = message; 128 | // Add close button 129 | const closeBtn = document.createElement("span"); 130 | closeBtn.className = "close-btn"; 131 | closeBtn.textContent = "×"; 132 | closeBtn.onclick = () => { 133 | toast.remove(); 134 | }; 135 | toast.appendChild(closeBtn); 136 | // Append toast to container 137 | toastContainer.appendChild(toast); 138 | // Remove toast after a delay 139 | setTimeout(() => { 140 | toast.classList.remove("show"); 141 | }, 3000); 142 | } 143 | }); 144 | -------------------------------------------------------------------------------- /scripts/capture-screenshot.js: -------------------------------------------------------------------------------- 1 | const puppeteer = require('puppeteer'); 2 | const fs = require('fs'); 3 | const path = require('path'); 4 | 5 | async function takeScreenshot(username) { 6 | const url = `https://github.com/${username}`; 7 | const browser = await puppeteer.launch({ 8 | headless: true, // Ensure the browser is launched in headless mode 9 | args: ['--no-sandbox', '--disable-setuid-sandbox'] // Add these arguments for compatibility 10 | }); 11 | const page = await browser.newPage(); 12 | 13 | try { 14 | // Set the page to use light mode 15 | await page.emulateMediaFeatures([{ name: 'prefers-color-scheme', value: 'light' }]); 16 | 17 | await page.goto(url, { waitUntil: 'networkidle2' }); 18 | await page.setViewport({ width: 1280, height: 800 }); 19 | const screenshotPath = path.join('screenshots', `${username}.png`); 20 | await page.screenshot({ path: screenshotPath, fullPage: true }); 21 | await browser.close(); 22 | return screenshotPath; 23 | } catch (error) { 24 | await browser.close(); 25 | throw error; 26 | } 27 | } 28 | 29 | async function main() { 30 | const username = process.argv[2]; 31 | if (!username) { 32 | console.error('No username provided'); 33 | process.exit(1); 34 | } 35 | 36 | const screenshotDir = path.resolve(__dirname, 'screenshots'); 37 | if (!fs.existsSync(screenshotDir)) { 38 | fs.mkdirSync(screenshotDir); 39 | } 40 | 41 | try { 42 | const screenshotPath = await takeScreenshot(username); 43 | console.log(`Screenshot taken for ${username}: ${screenshotPath}`); 44 | } catch (error) { 45 | console.error(`Error taking screenshot for ${username}:`, error); 46 | } 47 | } 48 | 49 | main(); 50 | -------------------------------------------------------------------------------- /scripts/dark-mode.js: -------------------------------------------------------------------------------- 1 | document.addEventListener("DOMContentLoaded", function () { 2 | const themeToggleCheckboxDesktop = document.querySelector("#theme-toggle"); 3 | const themeToggleCheckboxMobile = document.querySelector("#theme-toggle-mobile"); 4 | const views = document.querySelectorAll('.views'); 5 | 6 | // Function to set the theme 7 | function setTheme(theme) { 8 | if (theme === "dark") { 9 | document.body.classList.add("dark-mode"); 10 | 11 | if (themeToggleCheckboxDesktop) { 12 | themeToggleCheckboxDesktop.checked = true; 13 | } 14 | if (themeToggleCheckboxMobile) { 15 | themeToggleCheckboxMobile.checked = true; 16 | } 17 | 18 | views.forEach(view => { 19 | view.style.color = "white"; 20 | }); 21 | } else { 22 | document.body.classList.remove("dark-mode"); 23 | 24 | if (themeToggleCheckboxDesktop) { 25 | themeToggleCheckboxDesktop.checked = false; 26 | } 27 | if (themeToggleCheckboxMobile) { 28 | themeToggleCheckboxMobile.checked = false; 29 | } 30 | 31 | views.forEach(view => { 32 | view.style.color = "#0a0e0f"; 33 | }); 34 | } 35 | localStorage.setItem("theme", theme); 36 | } 37 | 38 | // Load the theme from localStorage or set it to the system default 39 | const savedTheme = localStorage.getItem("theme"); 40 | const defaultTheme = window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches ? "dark" : "light"; 41 | setTheme(savedTheme || defaultTheme); 42 | 43 | // Add event listeners to both toggle checkboxes if they exist 44 | if (themeToggleCheckboxDesktop) { 45 | themeToggleCheckboxDesktop.addEventListener("change", () => { 46 | const newTheme = themeToggleCheckboxDesktop.checked ? "dark" : "light"; 47 | setTheme(newTheme); 48 | }); 49 | } 50 | 51 | if (themeToggleCheckboxMobile) { 52 | themeToggleCheckboxMobile.addEventListener("change", () => { 53 | const newTheme = themeToggleCheckboxMobile.checked ? "dark" : "light"; 54 | setTheme(newTheme); 55 | }); 56 | } 57 | }); 58 | -------------------------------------------------------------------------------- /scripts/hamburger.js: -------------------------------------------------------------------------------- 1 | document.addEventListener("DOMContentLoaded", function() { 2 | const hamburger = document.getElementById("hamburger"); 3 | const mobileMenu = document.getElementById("mobile-menu"); 4 | 5 | hamburger.addEventListener("click", function() { 6 | hamburger.classList.toggle("active"); 7 | if (mobileMenu.classList.contains("show")) { 8 | mobileMenu.classList.remove("show"); 9 | setTimeout(() => mobileMenu.style.display = "none", 300); 10 | } else { 11 | mobileMenu.style.display = "flex"; 12 | setTimeout(() => mobileMenu.classList.add("show"), 10); 13 | } 14 | }); 15 | }); 16 | 17 | -------------------------------------------------------------------------------- /scripts/profileModal.js: -------------------------------------------------------------------------------- 1 | document.addEventListener("DOMContentLoaded", function() { 2 | // Get modal element 3 | const profileModal = document.getElementById("profileModal"); 4 | 5 | // Get close button 6 | const closeModal = document.getElementById("closeModal"); 7 | 8 | // Function to check if modal has already been shown 9 | function checkModal() { 10 | return localStorage.getItem("modalShown") === "true"; 11 | } 12 | 13 | // Function to show the modal 14 | function showModal() { 15 | if (!checkModal()) { 16 | profileModal.style.display = "block"; // Show the modal 17 | } 18 | } 19 | 20 | // Function to hide the modal 21 | function hideModal() { 22 | profileModal.style.display = "none"; // Hide the modal 23 | localStorage.setItem("modalShown", "true"); // Set item in local storage 24 | } 25 | 26 | // Clear local storage item on page refresh 27 | localStorage.removeItem("modalShown"); 28 | 29 | // Function to check if user has reached near the bottom 30 | function checkIfBottom() { 31 | const scrollPosition = window.scrollY + window.innerHeight; 32 | const pageHeight = document.documentElement.scrollHeight; 33 | 34 | // If user has scrolled to the bottom or near the bottom (e.g., 100px from the bottom) 35 | if (pageHeight - scrollPosition < 100) { 36 | showModal(); 37 | window.removeEventListener("scroll", checkIfBottom); // Remove listener after showing modal 38 | } 39 | } 40 | 41 | // Add scroll event listener to detect if user reaches near the bottom of the page 42 | window.addEventListener("scroll", checkIfBottom); 43 | 44 | // Close modal when the close button is clicked 45 | closeModal.onclick = hideModal; 46 | 47 | // Close modal when clicking outside of the modal content 48 | window.onclick = function(event) { 49 | if (event.target === profileModal) { 50 | hideModal(); 51 | } 52 | }; 53 | }); 54 | -------------------------------------------------------------------------------- /scripts/revealelementsonscroll.js: -------------------------------------------------------------------------------- 1 | ScrollReveal({ 2 | 3 | //reset: true , 4 | 5 | distance : '60px' , 6 | 7 | duration:2500, 8 | 9 | delay:400 10 | 11 | }); 12 | 13 | ScrollReveal().reveal('.main-heading ', { delay: 500 , origin:'left' }); 14 | 15 | ScrollReveal().reveal('.tag,.search-bar', { delay: 530 , origin:'bottom',interval:200 }); 16 | 17 | ScrollReveal().reveal('.profiles', { delay: 600 , origin:'bottom' }); 18 | -------------------------------------------------------------------------------- /scripts/speechRecognition.js: -------------------------------------------------------------------------------- 1 | 2 | function startSearch() { 3 | // get main elements 4 | const input = document.querySelector(".search-input"); 5 | const btnListen = document.querySelector(".mic-button"); 6 | let listening = false; 7 | var SpeechRecognition = SpeechRecognition || webkitSpeechRecognition; 8 | 9 | // if there's speech recognition, show the microphone 10 | if (SpeechRecognition) { 11 | setTimeout(function () { 12 | btnListen.classList.add("show"); 13 | }, 1000); 14 | console.log("listening"); 15 | } 16 | 17 | // show/hide placeholder 18 | 19 | 20 | // listen to speech 21 | btnListen.addEventListener("click", function () { 22 | btnListen.classList.add("listening"); 23 | 24 | if (!listening) { 25 | 26 | const recognition = new SpeechRecognition(); 27 | 28 | recognition.onstart = function () { 29 | btnListen.classList.add("listening"); 30 | listening = true; 31 | }; 32 | 33 | recognition.onspeechend = function () { 34 | recognition.stop(); 35 | btnListen.classList.remove("listening"); 36 | listening = false; 37 | }; 38 | 39 | recognition.onerror = function () { 40 | btnListen.classList.remove("listening"); 41 | listening = false; 42 | }; 43 | 44 | recognition.onresult = function (event) { 45 | const transcript = event.results[0][0].transcript; 46 | const confidence = event.results[0][0].confidence; 47 | 48 | input.value = transcript; 49 | console.log(transcript); 50 | input.focus(); 51 | }; 52 | 53 | recognition.start(); 54 | } 55 | }); 56 | } 57 | 58 | startSearch(); 59 | -------------------------------------------------------------------------------- /scripts/videos.js: -------------------------------------------------------------------------------- 1 | // Function to highlight the active link based on the current hash 2 | const links = document.querySelectorAll(".nav--link"); 3 | 4 | function highlightActiveLink() { 5 | const currentHash = window.location.hash; 6 | links.forEach((link, id) => { 7 | if (currentHash === "" && id === 0) { 8 | link.classList.add("hash--active"); 9 | } else if (link.getAttribute("href") === currentHash) { 10 | link.classList.add("hash--active"); 11 | } else { 12 | link.classList.remove("hash--active"); 13 | } 14 | }); 15 | } 16 | 17 | window.addEventListener("hashchange", highlightActiveLink); 18 | window.addEventListener("load", highlightActiveLink()); 19 | -------------------------------------------------------------------------------- /server.js: -------------------------------------------------------------------------------- 1 | const dotenv = require("dotenv"); 2 | dotenv.config(); 3 | 4 | const express = require("express"); 5 | const axios = require("axios"); 6 | const cors = require("cors"); 7 | 8 | const app = express(); 9 | const port = process.env.PORT || 3000; 10 | 11 | // Middleware 12 | const allowedOrigins = [ 13 | "https://recodehive.github.io/awesome-github-profiles", 14 | "http://127.0.0.1:5502", 15 | "http://127.0.0.1:5501", 16 | "http://localhost:3000", 17 | "https://example.com" 18 | ]; 19 | 20 | // CORS configuration 21 | app.use(cors({ 22 | origin: function (origin, callback) { 23 | // Allow requests with no origin (like mobile apps or curl requests) 24 | if (!origin) return callback(null, true); 25 | 26 | if (allowedOrigins.indexOf(origin) === -1) { 27 | const msg = 'The CORS policy for this site does not allow access from the specified Origin.'; 28 | return callback(new Error(msg), false); 29 | } 30 | return callback(null, true); 31 | }, 32 | credentials: true, 33 | methods: "GET,HEAD,PUT,PATCH,POST,DELETE", 34 | allowedHeaders: ['Content-Type', 'Authorization'] 35 | })); 36 | 37 | app.use(express.json()); 38 | 39 | // Test route 40 | app.get("/", (req, res) => { 41 | res.send("GitHub OAuth backend is running!"); 42 | }); 43 | 44 | // GitHub OAuth route 45 | app.get("/api/auth/github", async (req, res) => { 46 | try { 47 | const { code } = req.query; 48 | 49 | if (!code) { 50 | return res.status(400).json({ message: "Authorization code is required" }); 51 | } 52 | 53 | console.log("Received GitHub code:", code); 54 | 55 | const response = await axios.post( 56 | 'https://github.com/login/oauth/access_token', 57 | { 58 | client_id: process.env.GITHUB_CLIENT_ID, 59 | client_secret: process.env.GITHUB_CLIENT_SECRET, 60 | code: code 61 | }, 62 | { 63 | headers: { 64 | Accept: 'application/json', 65 | 'Content-Type': 'application/json' 66 | } 67 | } 68 | ); 69 | 70 | console.log("GitHub OAuth response:", response.data); 71 | 72 | if (response.data.error) { 73 | throw new Error(response.data.error_description || response.data.error); 74 | } 75 | 76 | res.json({ data: response.data }); 77 | } catch (error) { 78 | console.error('GitHub OAuth error:', error.response?.data || error); 79 | res.status(error.response?.status || 500).json({ 80 | message: "Failed to authenticate with GitHub", 81 | error: error.message 82 | }); 83 | } 84 | }); 85 | 86 | // Get GitHub user data route 87 | app.get("/api/auth/github/getUser", async (req, res) => { 88 | try { 89 | const authHeader = req.get("Authorization"); 90 | 91 | if (!authHeader || !authHeader.startsWith('Bearer ')) { 92 | return res.status(401).json({ message: "Invalid authorization header" }); 93 | } 94 | 95 | const token = authHeader.split(' ')[1]; 96 | console.log("Fetching user data with token:", token.substring(0, 10) + '...'); 97 | 98 | const response = await axios.get("https://api.github.com/user", { 99 | headers: { 100 | Authorization: `Bearer ${token}`, 101 | Accept: 'application/json' 102 | } 103 | }); 104 | 105 | console.log("GitHub user data response:", { 106 | name: response.data.name, 107 | email: response.data.email 108 | }); 109 | 110 | res.status(200).json({ 111 | message: "success", 112 | user: { 113 | name: response.data.name, 114 | email: response.data.email 115 | } 116 | }); 117 | } catch (error) { 118 | console.error('GitHub user data error:', error.response?.data || error); 119 | res.status(error.response?.status || 500).json({ 120 | message: "Failed to fetch user data", 121 | error: error.message 122 | }); 123 | } 124 | }); 125 | 126 | // Start server 127 | app.listen(port, () => { 128 | console.log(`Server running at http://localhost:${port}`); 129 | }); -------------------------------------------------------------------------------- /styles/blog.css: -------------------------------------------------------------------------------- 1 | *{ 2 | font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif; 3 | } 4 | body { 5 | 6 | background-color: #f4f4f4; 7 | margin: 0; 8 | padding: 0; 9 | } 10 | 11 | body img { 12 | max-width: 100vw !important; 13 | } 14 | 15 | .blog-container { 16 | display: flex; 17 | flex-wrap: wrap; 18 | justify-content: space-between; /* Ensures equal spacing between cards */ 19 | align-items: stretch; /* Ensures all cards are of equal height */ 20 | padding: 30px; 21 | } 22 | 23 | .blog-card { 24 | background: white; 25 | border-radius: 8px; 26 | box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); 27 | padding: 20px; 28 | cursor: pointer; 29 | width: 30%; /* Adjusted width to allow for 3 cards per row */ 30 | height: auto; /* Makes sure the card height is flexible */ 31 | transition: transform 0.2s; 32 | margin:20px 0; /* Adds vertical spacing between rows */ 33 | display: flex; 34 | flex-direction: column; /* Ensures content inside card takes full height */ 35 | } 36 | 37 | body.dark-mode .blog-card { 38 | background-color: #333; 39 | } 40 | 41 | body.dark-mode .blog-card .excerpt, 42 | body.dark-mode .blog-card .save-btn { 43 | color: #fff; 44 | } 45 | 46 | 47 | 48 | 49 | 50 | .saved-blogs { 51 | display: flex; 52 | align-items: center; 53 | background-color: #f0f0f0; /* Gray background */ 54 | color: #333; /* Dark text color */ 55 | padding: 10px 20px; 56 | border-radius: 25px; /* Rounded corners */ 57 | text-decoration: none; /* No underline by default */ 58 | font-family: Arial, sans-serif; 59 | transition: background-color 0.3s, transform 0.3s; /* Transition effects */ 60 | position: relative; /* For positioning the arrow */ 61 | } 62 | .dark-mode .saved-blogs { 63 | background-color: #333; /* Dark mode background color */ 64 | color: #fff; /* Dark mode text color */ 65 | } 66 | .dark-mode .saved-blogs:hover { 67 | background: linear-gradient(135deg, #444, #333); /* Dark mode tag hover background */ 68 | } 69 | 70 | 71 | .saved-blogs i { 72 | margin-left: 10px; /* Space between text and arrow */ 73 | transition: transform 0.3s; /* Transition for arrow movement */ 74 | } 75 | 76 | .saved-blogs:hover { 77 | background-color: #e0e0e0; /* Slightly darker gray on hover */ 78 | transform: scale(1.02); /* Slight scale effect on hover */ 79 | text-decoration: none; /* Ensure no underline on hover */ 80 | } 81 | 82 | .saved-blogs:hover i { 83 | transform: translateX(5px); /* Move arrow to the right on hover */ 84 | } 85 | 86 | body.dark-mode .saved-blogs { 87 | color: #d5d5d5; 88 | } 89 | 90 | .blog-card .image-wrapper { 91 | width: 100%; 92 | height: auto; 93 | overflow: hidden; 94 | border-radius: 12px; 95 | } 96 | 97 | /* .blog-card:hover { 98 | transform: scale(1.15); 99 | } */ 100 | 101 | .blog-card img { 102 | scale: 1.15; 103 | width: 100%; 104 | height: 100%; 105 | transition: 0.3s ease-in-out; 106 | } 107 | 108 | .blog-card img:hover { 109 | scale: 1; 110 | } 111 | 112 | .blog-card-content { 113 | padding: 20px 10px; 114 | } 115 | 116 | .blog-card .category { 117 | color: #ff4383; 118 | font-weight: bold; 119 | font-size: 12px; 120 | text-transform: uppercase; 121 | margin-bottom: 10px; 122 | } 123 | 124 | .blog-card .blogtitle { 125 | font-size: 18px; 126 | margin: 10px 0; 127 | transition: 0.5s ease-in-out; 128 | } 129 | 130 | .blog-card .blogtitle:hover { 131 | color: #ff4383; 132 | } 133 | 134 | .blog-card .meta { 135 | color: #999; 136 | font-size: 14px; 137 | margin: 5px 0; 138 | } 139 | 140 | .blog-card .excerpt { 141 | font-size: 14px; 142 | color: #333; 143 | margin: 15px 0; 144 | } 145 | 146 | .blog-card .read-more { 147 | display: block; 148 | width: fit-content; 149 | padding: 10px 15px; 150 | background-color: #007bff; 151 | color: white; 152 | text-align: center; 153 | text-decoration: none; 154 | border-radius: 5px; 155 | margin: 10px 0 0; 156 | font-size: 14px; 157 | } 158 | 159 | .blog-card .read-more:hover { 160 | background-color: #0056b3; 161 | } 162 | 163 | #categoryTags { 164 | display: flex; 165 | justify-content: center; 166 | gap: 15px; 167 | margin-bottom: 20px; 168 | flex-wrap: wrap; 169 | } 170 | 171 | .tag { 172 | padding: 10px 20px; 173 | font-size: 1.1em; 174 | background: linear-gradient(135deg, #f0f0f0, #dcdcdc); /* Light mode tag background */ 175 | color: #333333; /* Light mode text color */ 176 | border-radius: 30px; 177 | cursor: pointer; 178 | box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); 179 | transition: background 0.3s, box-shadow 0.3s, transform 0.2s; 180 | } 181 | .dark-mode .tag { 182 | background: linear-gradient(135deg, #333, #222); /* Dark mode tag background */ 183 | color: #fff; /* Dark mode text color */ 184 | } 185 | .dark-mode .tag:hover { 186 | background: linear-gradient(135deg, #444, #333); /* Dark mode tag hover background */ 187 | } 188 | 189 | .tag:hover { 190 | background: linear-gradient(135deg, #e0e0e0, #c0c0c0); 191 | box-shadow: 0 6px 12px rgba(0, 0, 0, 0.2); 192 | transform: translateY(-2px); 193 | } 194 | 195 | 196 | .tag.active { 197 | background: linear-gradient(135deg, #ffc107, #ff9800); /* Active tag styling */ 198 | color: #fff; /* Active tag text color */ 199 | } 200 | 201 | /* Responsive Styles */ 202 | @media (max-width: 768px) { 203 | .tag { 204 | padding: 8px 15px; 205 | font-size: 1em; 206 | } 207 | } 208 | 209 | 210 | 211 | @media (max-width:976px) { 212 | .blog-card { 213 | width: 40%; 214 | } 215 | } 216 | 217 | @media (max-width:768px) { 218 | .blog-card { 219 | width: 100%; 220 | } 221 | 222 | .ways-content { 223 | padding: 0 !important; 224 | } 225 | } 226 | 227 | 228 | .certificate { 229 | width: 100%; 230 | justify-content: center; 231 | display: flex; 232 | flex-wrap: wrap; 233 | } 234 | 235 | .certificate-left { 236 | width: 40%; 237 | display: flex; 238 | justify-content: center; 239 | flex-direction: column; 240 | align-items: center; 241 | } 242 | 243 | .ways { 244 | width: 100%; 245 | display: flex; 246 | flex-direction: column; 247 | align-items: center; 248 | 249 | } 250 | 251 | .ways-content { 252 | padding: 60px; 253 | padding-top: 30px; 254 | } 255 | 256 | .ways-content h1 { 257 | font-size: 50px !important; 258 | } 259 | 260 | .ways-content p { 261 | font-size: 20px !important; 262 | } 263 | 264 | .ways img { 265 | object-fit: contain !important; 266 | border-radius: 20px; 267 | } 268 | 269 | .ways1 { 270 | width: 80%; 271 | display: flex; 272 | /* flex-wrap: wrap; */ 273 | margin-top: 20px; 274 | margin-bottom: 20px !important; 275 | } 276 | .ways1 img{ 277 | border-radius: 20px; 278 | margin-bottom: 30px !important; 279 | } 280 | .dark-mode .ways1 a{ 281 | color: white !important; 282 | } 283 | .dark-mode .ways2 a{ 284 | color: white !important; 285 | } 286 | 287 | .ways2 { 288 | width: 80%; 289 | display: flex; 290 | flex-direction: row-reverse; 291 | margin-top: 30px; 292 | /* flex-wrap: wrap; */ 293 | margin-bottom: 30px !important; 294 | } 295 | .ways2 img{ 296 | border-radius: 20px; 297 | margin-bottom: 30px !important; 298 | } 299 | 300 | @media only screen and (max-width:1400px) { 301 | .certificate-left { 302 | width: 80%; 303 | } 304 | 305 | .certificate-right { 306 | width: 100%; 307 | height: auto; 308 | } 309 | 310 | .ways1, 311 | .ways2 { 312 | justify-content: center; 313 | flex-wrap: wrap; 314 | } 315 | 316 | .ways1, 317 | .ways2 { 318 | padding: 0px !important; 319 | text-align: center; 320 | } 321 | } 322 | 323 | @media only screen and (max-width:600px) { 324 | .ways img { 325 | object-fit: inherit; 326 | scale: 0.60 !important; 327 | } 328 | } 329 | 330 | .ways a:hover { 331 | text-decoration: underline; 332 | } 333 | 334 | .ways a { 335 | font-size: 30px; 336 | text-decoration: none; 337 | color: black; 338 | font-weight: 600; 339 | } 340 | 341 | .certificate-left h1 { 342 | font-size: 30px; 343 | text-align: start; 344 | } 345 | 346 | .certificate-left p { 347 | font-size: 20px; 348 | text-align: start; 349 | 350 | } 351 | 352 | .certificate-right { 353 | width: 40%; 354 | height: 400px; 355 | } 356 | 357 | 358 | 359 | /* Popup container */ 360 | .popup { 361 | display: none; 362 | /* Hidden by default */ 363 | position: fixed; 364 | /* Stay in place */ 365 | z-index: 1500; 366 | /* Sit on top */ 367 | left: 0; 368 | top: 0; 369 | width: 100%; 370 | /* Full width */ 371 | height: 100%; 372 | /* Full height */ 373 | overflow: hidden; 374 | /* Enable scroll if needed */ 375 | background-color: rgba(0, 0, 0, 0.5); 376 | /* Black with opacity */ 377 | } 378 | 379 | /* Popup content */ 380 | .popup-content { 381 | background-color: #fefefe; 382 | display: flex; 383 | max-width: 700px; 384 | margin: 10% auto; 385 | /* 15% from the top and centered */ 386 | 387 | border: 1px solid #888; 388 | width: 80%; 389 | /* Could be more or less, depending on screen size */ 390 | position: relative; 391 | border-radius: 20px; 392 | } 393 | 394 | .main-popup-content .card-footer a:hover{ 395 | color: blue !important; 396 | /* padding: 10px; */ 397 | } 398 | 399 | /* Dark Mode */ 400 | .dark-mode .main-popup-content, 401 | .dark-mode .side-content{ 402 | background-color: #0a0e0f;; 403 | } 404 | 405 | .dark-mode .main-popup-content i, 406 | .dark-mode .main-popup-content span, 407 | .dark-mode .main-popup-content h1, 408 | .dark-mode .main-popup-content p, 409 | .dark-mode .main-popup-content a, 410 | .dark-mode .main-popup-content .card-footer, 411 | .dark-mode .main-popup-content .side-content { 412 | color: white !important; 413 | } 414 | 415 | /* Light Mode */ 416 | .main-popup-content { 417 | background-color: white; 418 | } 419 | 420 | .main-popup-content i, 421 | .main-popup-content span, 422 | .main-popup-content h1, 423 | .main-popup-content a, 424 | .main-popup-content .card-footer{ 425 | color: black !important; 426 | } 427 | 428 | .line { 429 | width: 100px; 430 | border-right: solid 1px black; 431 | border-right-style: dashed; 432 | } 433 | 434 | /* Close button */ 435 | .popup-close { 436 | color: #aaa; 437 | float: right; 438 | font-size: 28px; 439 | font-weight: bold; 440 | position: absolute; 441 | right: 20px; 442 | top: 10px; 443 | } 444 | 445 | .popup-close:hover, 446 | .popup-close:focus { 447 | color: black; 448 | text-decoration: none; 449 | cursor: pointer; 450 | } 451 | 452 | /* Button inside popup */ 453 | .popup-button { 454 | background-color: #4CAF50; 455 | /* Green */ 456 | border: none; 457 | color: white; 458 | padding: 10px 20px; 459 | text-decoration: none; 460 | display: inline-block; 461 | font-size: 16px; 462 | margin: 10px 2px; 463 | cursor: pointer; 464 | } 465 | 466 | .popup-button:hover { 467 | background-color: #45a049; 468 | } 469 | 470 | .main-popup-content { 471 | padding-left: 20px; 472 | padding-top: 20px; 473 | width: 500px; 474 | height: 417px; 475 | 476 | } 477 | 478 | .main-popup-content h1 { 479 | margin-bottom: 40px; 480 | } 481 | 482 | .call { 483 | display: flex; 484 | height: 70px; 485 | align-items: center; 486 | justify-content: space-between; 487 | font-weight: 500; 488 | font-size: 20px; 489 | color: black; 490 | } 491 | 492 | .card-footer { 493 | height: 80px; 494 | padding-bottom: 20px; 495 | font-size: 20px; 496 | } 497 | 498 | .card-footer a { 499 | text-decoration: none; 500 | color: black; 501 | } 502 | 503 | .side-content { 504 | height: 100%; 505 | display: flex; 506 | width: 300px; 507 | align-items: center; 508 | flex-direction: column; 509 | justify-content: center; 510 | height: 417px; 511 | } 512 | 513 | .side-content svg { 514 | position: relative; 515 | top: 100px; 516 | } 517 | 518 | @media only screen and (max-width:700px) { 519 | .side-content { 520 | height: auto; 521 | } 522 | 523 | .main-popup-content { 524 | height: auto; 525 | } 526 | 527 | .main-popup-content h1 { 528 | font-size: 30px !important; 529 | margin-bottom: 10px; 530 | } 531 | 532 | .main-popup-content p { 533 | margin-bottom: 4px; 534 | } 535 | 536 | .call { 537 | flex-direction: column; 538 | gap: 10px; 539 | align-items: start; 540 | } 541 | 542 | .popup-content { 543 | margin: 15% auto; 544 | width: 95vw; 545 | } 546 | } 547 | 548 | 549 | .blog-save { 550 | display: flex; 551 | justify-content: space-between; 552 | } 553 | 554 | .save-btn { 555 | display: flex; 556 | gap: 10px; 557 | cursor: pointer; 558 | justify-content: center; 559 | align-items: center; 560 | color: rgb(69, 69, 69); 561 | font-size: 20px; 562 | font-weight: 500; 563 | } 564 | 565 | .saved-blogs { 566 | font-size: 20px; 567 | text-align: center; 568 | text-decoration: none; 569 | color: rgb(61, 61, 61); 570 | } 571 | 572 | .saved-blogs:hover { 573 | text-decoration: underline; 574 | } 575 | 576 | #progressBarContainer { 577 | position: fixed; 578 | top: 0; 579 | left: 0; 580 | width: 100%; 581 | height: 7px; 582 | background-color: #333; 583 | z-index: 9999; 584 | } 585 | 586 | #progressBar { 587 | height: 100%; 588 | width: 0%; 589 | background: white; 590 | transition: width 0.2s ease; 591 | } -------------------------------------------------------------------------------- /styles/compare.css: -------------------------------------------------------------------------------- 1 | * { 2 | font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif; 3 | } 4 | 5 | body { 6 | background-color: #f4f4f9; 7 | color: #333; 8 | margin: 0; 9 | padding: 0; 10 | } 11 | 12 | .container { 13 | width: 90%; 14 | max-width: 1200px; 15 | margin: 0 auto; 16 | padding: 20px; 17 | min-height: 41vh !important; 18 | } 19 | 20 | #result-container { 21 | margin-top: 20px; 22 | height: 400px; 23 | } 24 | 25 | h1, h2 { 26 | text-align: center; 27 | color: #333; 28 | } 29 | 30 | label { 31 | font-size: 20px; 32 | } 33 | 34 | .form-group { 35 | margin-bottom: 15px; 36 | } 37 | 38 | .label { 39 | display: block; 40 | margin-bottom: 5px; 41 | font-weight: bold; 42 | } 43 | 44 | .select { 45 | width: 100%; 46 | padding: 10px; 47 | border: 1px solid #ddd; 48 | border-radius: 12px; 49 | font-size: 16px; 50 | transition: border-color 0.3s ease, background-color 0.3s ease; 51 | } 52 | 53 | .select:hover { 54 | background-color: #f0f8ff; 55 | } 56 | 57 | .button { 58 | display: block; 59 | width: 25%; 60 | padding: 10px; 61 | background-color: #007bff; 62 | color: white; 63 | border: none; 64 | border-radius: 12px; 65 | font-size: 16px; 66 | cursor: pointer; 67 | transition: background-color 0.3s ease, transform 0.2s ease, box-shadow 0.3s ease; 68 | } 69 | 70 | .button:hover { 71 | background-color: #0069d9; 72 | transform: scale(1.05); 73 | box-shadow: 0 0 8px rgba(0, 123, 255, 0.4); 74 | } 75 | 76 | .comparison { 77 | margin-top: 20px; 78 | } 79 | 80 | table { 81 | width: 100%; 82 | border-collapse: collapse; 83 | margin-top: 20px; 84 | border-radius: 12px; 85 | overflow: hidden; 86 | } 87 | 88 | th, td { 89 | padding: 12px; 90 | text-align: center; 91 | border: 1px solid #ddd; 92 | transition: background-color 0.2s ease; 93 | } 94 | 95 | th { 96 | background-color: #007bff; 97 | color: white; 98 | } 99 | 100 | tr:nth-child(even) { 101 | background-color: #f9f9f9; 102 | } 103 | 104 | .dark-mode tr:nth-child(even) { 105 | background-color: #1a1717; 106 | } 107 | 108 | .hidden { 109 | display: none; 110 | } 111 | 112 | @media (max-width: 768px) { 113 | .container { 114 | padding: 10px; 115 | } 116 | 117 | .button { 118 | font-size: 14px; 119 | } 120 | 121 | #result-container { 122 | height: 300px; 123 | } 124 | } 125 | 126 | select { 127 | background: transparent; 128 | outline: none; 129 | border: 1px solid gray; 130 | padding: 10px; 131 | font-size: 20px; 132 | border-radius: 12px; 133 | transition: border-color 0.3s ease, background-color 0.3s ease; 134 | } 135 | 136 | select:focus { 137 | border-color: #007bff; 138 | } 139 | 140 | .dark-mode select { 141 | color: white; 142 | background-color: #0a0e0f; 143 | } 144 | 145 | #avatarImg1, #avatarImg2 { 146 | --s: 10px; 147 | padding: var(--s); 148 | border: calc(2 * var(--s)) solid #ffffff00; 149 | outline: 1px solid #ffffff; 150 | outline-offset: calc(-1 * var(--s)); 151 | background: conic-gradient(from 90deg at 1px 1px, #ffffff00 25%, #ffffff 0); 152 | width: 200px; 153 | height: 200px; 154 | border-radius: 12px; 155 | -webkit-user-drag: none; 156 | -moz-user-drag: none; 157 | -o-user-drag: none; 158 | } 159 | 160 | .spinner { 161 | border: 4px solid rgba(0, 0, 0, 0.1); 162 | border-radius: 50%; 163 | border-top: 4px solid #007bff; 164 | width: 40px; 165 | height: 40px; 166 | animation: spin 1s linear infinite; 167 | margin: 10px auto; 168 | } 169 | 170 | @keyframes spin { 171 | 0% { transform: rotate(0deg); } 172 | 100% { transform: rotate(360deg); } 173 | } 174 | 175 | #progressBarContainer { 176 | position: fixed; 177 | top: 0; 178 | left: 0; 179 | width: 100%; 180 | height: 7px; 181 | background-color: #333; 182 | z-index: 9999; 183 | } 184 | 185 | #progressBar { 186 | height: 100%; 187 | width: 0%; 188 | background: #007bff; 189 | transition: width 0.2s ease; 190 | } 191 | 192 | .list { 193 | display: grid; 194 | grid-template-columns: repeat(2, 1fr); 195 | gap: 10px; 196 | padding: 10px; 197 | } 198 | 199 | .user { 200 | display: flex; 201 | align-items: center; 202 | padding: 10px; 203 | border: 1px solid #ddd; 204 | border-radius: 12px; 205 | cursor: pointer; 206 | transition: border-color 0.3s ease, box-shadow 0.3s ease, transform 0.2s ease; 207 | } 208 | 209 | .user:hover { 210 | border-color: #007bff; 211 | box-shadow: 0 0 8px rgba(0, 123, 255, 0.4); 212 | transform: scale(1.03); 213 | } 214 | 215 | .search-bar-components { 216 | display: flex; 217 | flex-wrap: wrap; 218 | justify-content: space-around; 219 | } 220 | 221 | input { 222 | width: 100%; 223 | max-width: 300px; 224 | height: 40px; 225 | padding: 10px; 226 | font-size: 16px; 227 | border: 1px solid #ccc; 228 | border-radius: 12px; 229 | outline: none; 230 | box-sizing: border-box; 231 | transition: all 0.3s ease; 232 | } 233 | 234 | input:focus { 235 | border-color: #007bff; 236 | box-shadow: 0 0 8px rgba(0, 123, 255, 0.4); 237 | } 238 | 239 | @media screen and (max-width: 768px) { 240 | input { 241 | max-width: 100%; 242 | } 243 | .list { 244 | grid-template-columns: 1fr; 245 | gap: 10px; 246 | } 247 | .search-bar-components { 248 | flex-direction: column; 249 | justify-content: center; 250 | align-items: center; 251 | } 252 | } 253 | -------------------------------------------------------------------------------- /styles/construction.css: -------------------------------------------------------------------------------- 1 | *{ 2 | font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif; 3 | } 4 | .fixed-heading { 5 | font-size: 6rem; /* Big heading size */ 6 | color: #242322; /* Orange color */ 7 | position: fixed; /* Fixed position */ 8 | top:30vh; 9 | text-align: center; 10 | animation: fadeIn 3s ease-in-out infinite alternate; 11 | z-index: 5; /* Animation */ 12 | } 13 | .fixed-div{ 14 | display: flex; 15 | align-items: center; 16 | justify-content: center; 17 | } 18 | /* Animation keyframes */ 19 | @keyframes fadeIn { 20 | 0% { 21 | opacity: 0; 22 | transform: translateY(-20px); 23 | } 24 | 50% { 25 | opacity: 1; 26 | transform: translateY(0); 27 | } 28 | 100% { 29 | opacity: 0; 30 | transform: translateY(20px); 31 | } 32 | } 33 | 34 | @media (max-width: 600px) { 35 | .fixed-heading { 36 | font-size: 8vw; 37 | } 38 | } 39 | 40 | @media (max-width: 400px) { 41 | .fixed-heading { 42 | font-size: 6vw; 43 | } 44 | } -------------------------------------------------------------------------------- /styles/construction.css.map: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/recodehive/awesome-github-profiles/e87e6aa88cd2b2072a99c2599b6263113ba3d34c/styles/construction.css.map -------------------------------------------------------------------------------- /styles/events.css: -------------------------------------------------------------------------------- 1 | *{ 2 | font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif; 3 | } 4 | .timeline { 5 | position: relative; 6 | max-width: 1200px; 7 | margin: 0 auto; 8 | padding: 40px 0; 9 | } 10 | 11 | .timeline::after { 12 | content: ""; 13 | position: absolute; 14 | width: 6px; 15 | background-color: #333; 16 | top: 80px; 17 | bottom: 0; 18 | left: 50%; 19 | margin-left: -3px; 20 | } 21 | 22 | .timeline-item { 23 | padding: 10px 40px; 24 | position: relative; 25 | width: calc(50% - 40px); 26 | box-sizing: border-box; 27 | } 28 | 29 | .timeline-item::after { 30 | content: ""; 31 | position: absolute; 32 | width: 25px; 33 | height: 25px; 34 | background-color: #3b9cdd; 35 | border: 4px solid #3b9cdd; 36 | border-radius: 50%; 37 | z-index: 2; 38 | top: 20px; 39 | } 40 | 41 | .timeline-item:nth-child(odd) { 42 | left: 0; 43 | width: calc(50%); 44 | } 45 | 46 | .timeline-item:nth-child(even) { 47 | left: 50%; 48 | width: calc(50%); 49 | } 50 | 51 | .timeline-item:nth-child(odd)::after { 52 | right: -17px; 53 | } 54 | 55 | .timeline-item:nth-child(even)::after { 56 | left: -17px; 57 | } 58 | 59 | .timeline-content { 60 | padding: 20px 30px; 61 | background-color: #fff; 62 | position: relative; 63 | border-radius: 6px; 64 | box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); 65 | } 66 | 67 | .timeline-item:nth-child(odd) .timeline-content::after { 68 | content: ""; 69 | position: absolute; 70 | top: 15px; 71 | right: -15px; 72 | width: 0; 73 | height: 0; 74 | border-top: 15px solid transparent; 75 | border-bottom: 15px solid transparent; 76 | border-left: 15px solid #fff; 77 | } 78 | 79 | .timeline-item:nth-child(even) .timeline-content::after { 80 | content: ""; 81 | position: absolute; 82 | top: 15px; 83 | left: -15px; 84 | width: 0; 85 | height: 0; 86 | border-top: 15px solid transparent; 87 | border-bottom: 15px solid transparent; 88 | border-right: 15px solid #fff; 89 | } 90 | 91 | .event-title { 92 | color: #333; 93 | font-size: 24px; 94 | margin-bottom: 10px; 95 | } 96 | 97 | .event-date { 98 | font-style: italic; 99 | color: #888; 100 | margin-bottom: 10px; 101 | } 102 | 103 | .event-description { 104 | margin-bottom: 15px; 105 | } 106 | 107 | .event-link { 108 | display: inline-block; 109 | background-color: #333; 110 | color: #fff; 111 | padding: 8px 15px; 112 | border-radius: 4px; 113 | text-decoration: none; 114 | transition: background-color 0.3s; 115 | } 116 | 117 | .event-link:hover { 118 | background-color: #555; 119 | } 120 | 121 | /* Dark mode styles */ 122 | body.dark-mode .timeline::after { 123 | background-color: #f0f0f0; 124 | } 125 | 126 | body.dark-mode .timeline-item::after { 127 | background-color: #ccc; 128 | border: 4px solid #999; 129 | } 130 | 131 | body.dark-mode .timeline-content { 132 | background-color: #444; 133 | color: #f0f0f0; 134 | } 135 | 136 | body.dark-mode .timeline-item:nth-child(odd) .timeline-content::after { 137 | border-left-color: #444; 138 | } 139 | 140 | body.dark-mode .timeline-item:nth-child(even) .timeline-content::after { 141 | border-right-color: #444; 142 | } 143 | 144 | body.dark-mode .event-title { 145 | color: #f0f0f0; 146 | } 147 | 148 | body.dark-mode .event-date { 149 | color: #ccc; 150 | } 151 | 152 | body.dark-mode .event-link { 153 | background-color: #f0f0f0; 154 | color: #333; 155 | } 156 | 157 | body.dark-mode .event-link:hover { 158 | background-color: #ccc; 159 | } 160 | 161 | body.dark-mode .navbar-text { 162 | color: #fff; 163 | } 164 | 165 | /* Responsive design */ 166 | @media screen and (max-width: 768px) { 167 | .container{ 168 | padding: 5px; 169 | } 170 | 171 | .timeline { 172 | max-width: 100vw; 173 | padding: 20px 0; 174 | } 175 | 176 | .timeline-item { 177 | padding: 10px 0px; 178 | } 179 | 180 | .timeline-content{ 181 | width: 100%; 182 | padding: 10px; 183 | } 184 | 185 | .banner{ 186 | width: 100%; 187 | } 188 | 189 | .banner iframe{ 190 | height: 215px; 191 | } 192 | 193 | .timeline::after { 194 | left: 31px; 195 | } 196 | 197 | .line { 198 | left: 28px !important; 199 | } 200 | 201 | .line1 { 202 | right: 93.5% !important; 203 | } 204 | 205 | .timeline-item { 206 | width: 100%; 207 | padding-left: 70px; 208 | padding-right: 25px; 209 | } 210 | 211 | .timeline-item::after { 212 | left: 15px; 213 | } 214 | 215 | .timeline-item:nth-child(odd) { 216 | width: 100%; 217 | } 218 | 219 | .timeline-item:nth-child(even) { 220 | left: 0; 221 | width: 100%; 222 | } 223 | 224 | .timeline-item:nth-child(odd)::after, 225 | .timeline-item:nth-child(even)::after { 226 | left: 15px; 227 | } 228 | 229 | .timeline-item:nth-child(odd) .timeline-content::after, 230 | .timeline-item:nth-child(even) .timeline-content::after { 231 | left: -15px; 232 | border-right: 15px solid #fff; 233 | border-left: none; 234 | } 235 | 236 | body.dark-mode .timeline-item:nth-child(odd) .timeline-content::after, 237 | body.dark-mode .timeline-item:nth-child(even) .timeline-content::after { 238 | border-right-color: #444; 239 | } 240 | } 241 | 242 | 243 | @media screen and (min-width:768px) and (max-width: 1024px) { 244 | .timeline { 245 | max-width: 100vw; 246 | padding: 20px 0; 247 | } 248 | 249 | .timeline-item { 250 | padding: 10px 0px; 251 | } 252 | 253 | .timeline-content{ 254 | width: 80%; 255 | padding: 20px; 256 | } 257 | 258 | .banner{ 259 | width: 100%; 260 | } 261 | 262 | .banner iframe{ 263 | height: 215px; 264 | } 265 | } 266 | 267 | .line { 268 | position: absolute; 269 | background-color: #3b9cdd; 270 | width: 6px; 271 | top: 40px; 272 | z-index: 1; 273 | } 274 | 275 | .line--left { 276 | left: 99.5%; 277 | } 278 | 279 | .line--right { 280 | right: 99.5%; 281 | } 282 | 283 | .scroll-animate { 284 | transition: all 1.5s ease-out; 285 | background-color: #3b9cdd !important; 286 | } 287 | 288 | #scrollToTop { 289 | position: fixed; 290 | bottom: 20px; 291 | right: 20px; 292 | width: 45px; 293 | height: 45px; 294 | border-radius: 50%; 295 | background-color: #000000; 296 | color: #ffffff; 297 | border: none; 298 | display: flex; 299 | align-items: center; 300 | justify-content: center; 301 | cursor: pointer; 302 | box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3); 303 | transition: background-color 0.3s, color 0.3s, opacity 0.3s, transform 0.3s; 304 | opacity: 0; 305 | visibility: hidden; 306 | z-index: 9999; 307 | } 308 | 309 | #scrollToTop:hover { 310 | background-color: #3e3e3e; 311 | } 312 | 313 | #scrollToTop.show { 314 | opacity: 1; 315 | visibility: visible; 316 | } 317 | 318 | #scrollToTop .arrow-icon { 319 | fill: white; 320 | width: 24px; 321 | height: 24px; 322 | transition: transform 0.3s; 323 | } 324 | 325 | #scrollToTop:hover { 326 | transform: translateY(-5px); 327 | /* Move button up on hover */ 328 | } 329 | 330 | #scrollToTop:hover .arrow-icon { 331 | transform: translateY(-2px); 332 | /* Move arrow up on hover */ 333 | } 334 | 335 | body.dark-mode #scrollToTop { 336 | background-color: #ffffff; 337 | color: #000000; 338 | } 339 | 340 | body.dark-mode #scrollToTop:hover { 341 | background-color: #b6b6b6ff; 342 | } 343 | 344 | body.dark-mode #scrollToTop .arrow-icon { 345 | fill: black; 346 | } 347 | 348 | #progressBarContainer { 349 | 350 | position: fixed; 351 | top: 0; 352 | left: 0; 353 | width: 100%; 354 | height: 7px; 355 | background-color: #333; 356 | z-index: 9999; 357 | } 358 | 359 | #progressBar { 360 | height: 100%; 361 | width: 0%; 362 | background: white; 363 | transition: width 0.2s ease; 364 | } -------------------------------------------------------------------------------- /styles/explore.css: -------------------------------------------------------------------------------- 1 | * { 2 | margin: 0; 3 | padding: 0; 4 | box-sizing: border-box; 5 | } 6 | 7 | body { 8 | font-family: Arial, sans-serif; 9 | background-color: #f0f0f0; 10 | color: #333; 11 | transition: background-color 0.3s ease, color 0.3s ease; 12 | } 13 | 14 | .container { 15 | max-width: 1200px; 16 | margin: 0 auto; 17 | padding: 2rem; 18 | } 19 | 20 | .header { 21 | text-align: center; 22 | margin-bottom: 2rem; 23 | } 24 | 25 | .title-text { 26 | display: flex; 27 | justify-content: center; 28 | font-weight: bold; 29 | color: #333; 30 | font-size: 2rem; 31 | text-decoration: underline; 32 | text-decoration-color: #FFA500; 33 | text-underline-offset: 0.5rem; 34 | } 35 | 36 | .highlight { 37 | color: #FFA500; 38 | } 39 | 40 | .content { 41 | display: flex; 42 | flex-wrap: wrap; 43 | gap: 20px; 44 | justify-content: space-between; 45 | } 46 | 47 | /* Card styles */ 48 | .cards { 49 | display: flex; 50 | justify-content: space-between; 51 | flex-wrap: wrap; 52 | gap: 20px; 53 | width: 100%; 54 | } 55 | 56 | .card { 57 | background-color: #505050; 58 | border-radius: 8px; 59 | padding: 20px; 60 | box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15); 61 | width: 30%; 62 | display: flex; 63 | flex-direction: column; 64 | justify-content: center; 65 | align-items: center; 66 | transition: transform 0.3s ease, box-shadow 0.3s ease; 67 | position: relative; 68 | } 69 | 70 | .card:hover { 71 | transform: translateY(-10px); 72 | box-shadow: 0 6px 16px rgba(0, 0, 0, 0.2); 73 | } 74 | 75 | .card-header { 76 | display: flex; 77 | flex-direction: column; 78 | align-items: center; 79 | } 80 | 81 | .item-number { 82 | font-size: 24px; 83 | color: #ffffff; 84 | /* Ensure the number is visible on the card background */ 85 | background-color: #ff6900; 86 | /* Background color for the number */ 87 | border-radius: 9999px; 88 | /* Make it circular */ 89 | padding: 0.5rem 1rem; 90 | font-weight: bold; 91 | position: absolute; 92 | top: 10px; 93 | /* Adjust position as needed */ 94 | left: -25px; 95 | /* Adjust position as needed */ 96 | width: 40px; 97 | /* Set a fixed width for consistent sizing */ 98 | height: 40px; 99 | /* Set a fixed height for consistent sizing */ 100 | display: flex; 101 | align-items: center; 102 | justify-content: center; 103 | z-index: 1; 104 | /* Ensure it stays above other content */ 105 | } 106 | 107 | .item-heading { 108 | font-weight: bold; 109 | font-size: 18px; 110 | font-weight: 500; 111 | text-align: center; 112 | color: #ffb300; 113 | position: relative; 114 | width: 100%; 115 | } 116 | 117 | .item-heading::after { 118 | content: ""; 119 | width: 100%; 120 | height: 3px; 121 | background-color: #ffb300; 122 | display: block; 123 | margin: 8px auto 0; 124 | } 125 | 126 | .item-description { 127 | font-size: 16px; 128 | line-height: 1.6; 129 | color: #ffffff; 130 | text-align: justify; 131 | margin-top: 10px; 132 | } 133 | 134 | /* Light mode specific styles */ 135 | body .item { 136 | background-color: #ffedd5; 137 | border-radius: 0.5rem; 138 | padding: 1rem; 139 | box-shadow: 0 2px 12px rgba(0, 0, 0, 0.1); 140 | } 141 | 142 | body .item-number { 143 | font-size: 24px; 144 | color: #4CAF50; 145 | margin-bottom: 10px; 146 | /* Ensuring it's visible and positioned */ 147 | position: absolute; 148 | left: -1.5rem; 149 | top: -22px; 150 | background-color: #ff6900; 151 | color: #ffffff; 152 | border-radius: 9999px; 153 | padding: 0.5rem 1rem; 154 | font-weight: bold; 155 | display: flex; 156 | align-items: center; 157 | justify-content: center; 158 | width: 54px; 159 | height: 54px; 160 | z-index: 1; 161 | /* Ensures it's above other content */ 162 | } 163 | 164 | body .item-heading { 165 | font-size: large; 166 | font-weight: bold; 167 | } 168 | 169 | /* Dark mode specific styles */ 170 | body.dark-mode { 171 | background-color: #333; 172 | color: #f0f0f0; 173 | } 174 | 175 | body.dark-mode .card { 176 | background-color: #444; 177 | } 178 | 179 | body.dark-mode .item-heading { 180 | color: #ffb300; 181 | font-weight: bold; 182 | } 183 | 184 | body.dark-mode .item-number { 185 | background-color: #555; 186 | color: #ffffff; 187 | } 188 | 189 | /* Responsive styles */ 190 | @media (max-width: 768px) { 191 | .card { 192 | width: 100%; 193 | padding: 15px; 194 | } 195 | 196 | .title-text { 197 | font-size: 1.5rem; 198 | } 199 | } -------------------------------------------------------------------------------- /styles/faq.css: -------------------------------------------------------------------------------- 1 | @import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap'); 2 | *{ 3 | font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif; 4 | } 5 | .container-help { 6 | display: flex; 7 | font-family: "Poppins", sans-serif; 8 | flex-direction: column; 9 | align-items: center; 10 | max-width: 100vw !important; 11 | } 12 | 13 | .content-block { 14 | display: flex; 15 | gap: 200px; 16 | justify-content: center; 17 | align-items: center; 18 | width: 80%; 19 | margin-top: 60px; 20 | margin-bottom: 30px; 21 | background-color: #fff; 22 | height: 450px; 23 | } 24 | 25 | body.dark-mode .content-block{ 26 | background-color: #333; 27 | 28 | } 29 | 30 | .main-heading { 31 | font-size: 48px; 32 | font-weight: 500; 33 | color: #121212; 34 | margin-bottom: 20px; 35 | width: 450px; 36 | word-wrap: break-word; 37 | } 38 | 39 | body.dark-mode .main-heading{ 40 | color: #fff; 41 | } 42 | 43 | .description { 44 | font-size: 16px; 45 | font-family: "Poppins", sans-serif; 46 | font-weight: 400; 47 | color: #666; 48 | } 49 | 50 | body.dark-mode .description{ 51 | color: #c0c0c0; 52 | } 53 | 54 | .steps-indicator { 55 | position: relative; 56 | height: 300px; 57 | } 58 | 59 | .step-line { 60 | position: absolute; 61 | left: 50%; 62 | top: 0; 63 | bottom: 0; 64 | width: 4px; 65 | background-color: #0066cc; 66 | } 67 | 68 | body.dark-mode .step-line{ 69 | background-color: #c0c0c0; 70 | } 71 | 72 | .step-dot { 73 | position: absolute; 74 | left: 50%; 75 | width: 20px; 76 | height: 20px; 77 | background-color: #0066cc; 78 | border-radius: 50%; 79 | transform: translateX(-40%); 80 | } 81 | 82 | body.dark-mode .step-dot{ 83 | background-color: #c0c0c0; 84 | } 85 | 86 | .step-dot::after { 87 | content: attr(data-step); 88 | position: absolute; 89 | left: 30px; 90 | top: 50%; 91 | transform: translateY(-50%); 92 | color: #0066cc; 93 | font-weight: bold; 94 | } 95 | 96 | .step-dot:nth-child(2) { top: 0; } 97 | .step-dot:nth-child(3) { top: 50%; } 98 | .step-dot:nth-child(4) { bottom: 0; } 99 | 100 | .step-box { 101 | position: absolute; 102 | background-color: #fff; 103 | box-shadow: 7px 7px 20px 0 rgba(18, 18, 18, 0.2); 104 | padding: 16px; 105 | border-radius: 16px; 106 | font-size: 12px; 107 | font-weight: 700; 108 | color: #0066cc; 109 | white-space: nowrap; 110 | } 111 | 112 | body.dark-mode .step-box{ 113 | background-color: #555; 114 | color: #fff; 115 | } 116 | 117 | .steps-clone { 118 | position: relative; 119 | display: flex; 120 | margin-top: 0px; 121 | flex-direction: column; 122 | justify-content: center; 123 | } 124 | 125 | .steps-clone:tiny { 126 | position: static; 127 | display: block; 128 | }.steps-clone { 129 | position: relative; 130 | display: flex; 131 | margin-top: 0px; 132 | flex-direction: column; 133 | justify-content: center; 134 | } 135 | .content-wrap{ 136 | width: 50%; 137 | display: flex; 138 | justify-content: center; 139 | align-items: center; 140 | 141 | 142 | 143 | } 144 | .text-block{ 145 | padding: 50px; 146 | } 147 | .step-content-block{ 148 | width: 70%; 149 | padding: 50px !important; 150 | } 151 | .steps-clone:tiny { 152 | position: static; 153 | display: block; 154 | }.dot { 155 | z-index: 3; 156 | position: absolute; 157 | width: 12px; 158 | height: 12px; 159 | margin-top: -6px; 160 | margin-bottom: -6px; 161 | border-top-left-radius: 50%; 162 | border-top-right-radius: 50%; 163 | border-bottom-left-radius: 50%; 164 | border-bottom-right-radius: 50%; 165 | } 166 | 167 | .dot:small { 168 | position: absolute; 169 | bottom: 50%; 170 | z-index: 99; 171 | margin-bottom: 0px; 172 | align-self: center; 173 | order: 2; 174 | } 175 | 176 | .step-block { 177 | position: relative; 178 | display: flex; 179 | width: 100vw !important; 180 | min-height: 80vh; 181 | margin-top: -1px; 182 | justify-content: space-around; 183 | flex-wrap: nowrap; 184 | align-items: center; 185 | align-content: center; 186 | } 187 | 188 | @media only screen and (max-width:700px){ 189 | .content-block { 190 | width: 100vw !important; 191 | overflow-x: hidden; 192 | } 193 | .text-section h3 { 194 | font-size: 1.5rem; 195 | max-width: 40%; 196 | transform: translateX(80%); 197 | } 198 | .text-section p { 199 | font-size: 1rem; 200 | max-width: 40%; 201 | transform: translateX(80%); 202 | } 203 | .steps-indicator .step-box { 204 | transform: translateX(-300%) !important; 205 | } 206 | .steps-indicator .step-dot { 207 | transform: translateX(-1200%) !important; 208 | } 209 | .steps-indicator .step-line { 210 | transform: translateX(-5800%) !important; 211 | } 212 | 213 | .step-block { 214 | max-width: 100vw !important; 215 | overflow-x: hidden !important; 216 | } 217 | .img-block img { 218 | max-width: 100vw !important; 219 | /* background-color: red; */ 220 | } 221 | .content-wrap { 222 | width: 100% !important; 223 | } 224 | .step-block{ 225 | flex-direction: column; 226 | } 227 | .dot{ 228 | bottom: 10px; 229 | } 230 | .step-block .content-wrap{ 231 | z-index: 100; 232 | } 233 | .step-block .img-block{ 234 | z-index: 100; 235 | } 236 | } 237 | .step-block:small { 238 | min-height: 110vh; 239 | flex-direction: column; 240 | justify-content: center; 241 | align-items: center; 242 | } 243 | .scoll-wrap { 244 | position: absolute; 245 | bottom: 50%; 246 | background-color: #eeeff4; 247 | width: 10px; 248 | display: flex; 249 | height: 100%; 250 | flex-direction: column; 251 | align-items: center; 252 | } 253 | 254 | .scoll-wrap:small { 255 | bottom: 50%; 256 | z-index: 1; 257 | height: 100%; 258 | } 259 | .img-block { 260 | width: 50%; 261 | display: flex; 262 | justify-content: center; 263 | align-items: center; 264 | } 265 | 266 | .img-block img{ 267 | width: 350px; 268 | } 269 | 270 | .img-block .first{ 271 | width: 450px; 272 | } 273 | 274 | .content .heading{ 275 | font-size: 20px; 276 | } 277 | 278 | .scroll-animate { 279 | position: absolute; 280 | top: 0px; 281 | width: 6px; 282 | transition: all 1.5s ease-out; 283 | z-index: 0; 284 | background-color: #3b9cdd !important; 285 | } 286 | 287 | body.dark-mode .text-block{ 288 | background-color: #333; 289 | } 290 | 291 | body.dark-mode .text-block .content{ 292 | color: #f0f0f0 !important; 293 | } 294 | 295 | body.dark-mode .text-block .content a{ 296 | color: #3b9cdd; 297 | } 298 | 299 | body.dark-mode .scroll-wrap{ 300 | border: none !important; 301 | background-color: #fff !important; 302 | } 303 | 304 | body.dark-mode .scroll-animate{ 305 | border: none !important; 306 | background-color: #c0c0c0 !important; 307 | } 308 | 309 | body.dark-mode .dot{ 310 | background-color: #c0c0c0 !important; 311 | } 312 | -------------------------------------------------------------------------------- /styles/githubbadge.css: -------------------------------------------------------------------------------- 1 | *{ 2 | font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif; 3 | } 4 | body { 5 | 6 | background-color: #f4f4f4; 7 | color: #333; 8 | margin: 0; 9 | padding: 0; 10 | line-height: 1.6; 11 | } 12 | 13 | .wrapper { 14 | max-width: 1200px; 15 | margin: auto; 16 | padding: 20px; 17 | background: #fff; 18 | border-radius: 8px; 19 | box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); 20 | } 21 | 22 | .title { 23 | text-align: center; 24 | font-size: 3em; 25 | font-weight: bold; 26 | color: #f67621; 27 | margin-bottom: 20px; 28 | text-decoration: underline; 29 | text-underline-offset: 8px; 30 | } 31 | 32 | /* Chrono component styles */ 33 | .chrono { 34 | margin: 0 auto; 35 | width: 100%; 36 | } 37 | 38 | .event-container { 39 | display: flex; 40 | flex-direction: column; 41 | align-items: center; 42 | } 43 | 44 | .event { 45 | background-color: #f67621; 46 | color: white; 47 | border-radius: 8px; 48 | margin: 20px 0; 49 | padding: 20px; 50 | max-width: 600px; 51 | text-align: center; 52 | } 53 | 54 | .event img { 55 | width: 100%; 56 | max-width: 600px; 57 | height: auto; 58 | border-radius: 8px; 59 | } 60 | 61 | .event figcaption { 62 | font-size: 2em; 63 | font-weight: bold; 64 | margin-top: 10px; 65 | } 66 | 67 | .event p { 68 | font-size: 1em; 69 | margin: 10px 0; 70 | } 71 | 72 | .event .link { 73 | color: #fff; 74 | font-size: 1.2em; 75 | font-weight: bold; 76 | text-decoration: none; 77 | border-bottom: 2px solid #fff; 78 | } 79 | 80 | .event .link:hover { 81 | text-decoration: underline; 82 | } 83 | 84 | /* Dark mode styles */ 85 | body.theme-dark { 86 | background-color: #121212; 87 | color: #e0e0e0; 88 | } 89 | 90 | body.theme-dark .wrapper { 91 | background: #1e1e1e; 92 | } 93 | 94 | body.theme-dark .title { 95 | color: #f67621; 96 | } 97 | 98 | body.theme-dark .event { 99 | background-color: #474747; 100 | } 101 | 102 | body.theme-dark .event .link { 103 | color: #f67621; 104 | border-bottom: 2px solid #f67621; 105 | } 106 | 107 | body.theme-dark .container{ 108 | background-color: #171717 !important; 109 | } 110 | body.theme-dark .center { 111 | background-color: #171717 !important; 112 | } 113 | body.dark-mode .themed-text { 114 | color: white; 115 | } 116 | 117 | body:not(.dark-mode) .themed-text { 118 | color: black; 119 | } 120 | body.dark-mode .themed-text { 121 | color: white; 122 | } 123 | /* Light Mode Styles */ 124 | .darkmodeimg { 125 | display: none; 126 | } 127 | 128 | /* Dark Mode Styles */ 129 | .dark-mode .darkmodeimg { 130 | display: block !important; 131 | } 132 | .lightmodeimg{ 133 | display: block; 134 | } 135 | .dark-mode .lightmodeimg { 136 | display: none !important; 137 | } 138 | .dark-mode .container h1,.dark-mode .container h2{ 139 | color: white !important; 140 | } 141 | .table-container { 142 | width: 100% !important; /* Set width to 90% of the viewport width */ 143 | overflow-x: auto; /* Enable horizontal scrolling */ 144 | margin: 0 auto; /* Center the container */ 145 | } 146 | 147 | .header, .row { 148 | display: flex; 149 | 150 | flex-wrap: wrap; /* Prevent wrapping */ 151 | } 152 | 153 | .cell { 154 | flex: auto; /* Allow cells to expand and fill the row */ 155 | padding: 8px; 156 | border: 1px solid #ddd; /* Add border */ 157 | text-align: left; /* Align text to the left */ 158 | /* min-width: 100px; */ 159 | } 160 | 161 | .header { 162 | background-color: #f2f2f2; /* Light gray background for header */ 163 | font-weight: bold; 164 | } 165 | 166 | .inner-table { 167 | display: flex; 168 | flex-direction: column; 169 | width: 100%; 170 | } 171 | 172 | .inner-table .header, .inner-table .rows { 173 | display: flex; 174 | flex-wrap: wrap; /* Prevent wrapping */ 175 | } 176 | 177 | .inner-table .header .cell { 178 | flex: auto !important; 179 | background-color: #f2f2f2; } 180 | 181 | .inner-table .rows { 182 | overflow-x: auto; 183 | } 184 | 185 | .inner-table .row { 186 | display: flex; 187 | flex-wrap: nowrap; 188 | } 189 | 190 | .inner-table .row .cell { 191 | flex: 1; 192 | border: 1px solid #ddd; 193 | } 194 | .dark-mode .header,.dark-mode .cell{ 195 | background-color:#171717 !important; 196 | } 197 | 198 | .certificate{ 199 | width: 100%; 200 | justify-content: center; 201 | display: flex; 202 | flex-wrap: wrap; 203 | } 204 | .certificate-left{ 205 | width: 40%; 206 | display: flex; 207 | justify-content: center; 208 | flex-direction: column; 209 | align-items: center; 210 | } 211 | 212 | .ways{ 213 | width: 100%; 214 | display: flex; 215 | flex-direction: column; 216 | align-items: center; 217 | 218 | } 219 | .ways-content{ 220 | padding: 60px; 221 | padding-top: 30px; 222 | } 223 | .ways-content h1{ 224 | font-size: 50px !important; 225 | } 226 | .ways-content p{ 227 | font-size: 20px !important; 228 | } 229 | 230 | .ways1 img, .ways2 img { 231 | width: 100%; 232 | height: 100%; 233 | object-fit: contain; 234 | } 235 | 236 | .ways1{ 237 | width: 80%; 238 | display: flex; 239 | /* flex-wrap: wrap; */ 240 | margin-top: 20px; 241 | margin-bottom: 20px !important; 242 | overflow: hidden; 243 | border-radius: 15px; 244 | } 245 | .ways2{ 246 | width: 80%; 247 | display: flex; 248 | flex-direction: row-reverse; 249 | margin-top: 30px; 250 | /* flex-wrap: wrap; */ 251 | margin-bottom: 30px !important; 252 | overflow: hidden; 253 | border-radius: 15px; 254 | } 255 | @media only screen and (max-width:1300px){ 256 | .certificate-left{ 257 | width: 80%; 258 | }.certificate-right{ 259 | width: 100%; 260 | height: auto; 261 | } 262 | .ways1,.ways2{ 263 | justify-content: center; 264 | flex-direction: column; 265 | } 266 | .ways1,.ways2{ 267 | padding: 0px !important; 268 | text-align: center; 269 | } 270 | } 271 | @media only screen and (max-width:500px) { 272 | .ways img{ 273 | scale: 0.60 !important;} 274 | } 275 | .ways a:hover{ 276 | text-decoration: underline; 277 | } 278 | .ways a{ 279 | font-size: 30px; 280 | text-decoration: none; 281 | color: black ; 282 | font-weight: 600; 283 | } 284 | .certificate-left h1{ 285 | font-size: 30px; 286 | text-align: start; 287 | } 288 | .certificate-left p{ 289 | font-size: 20px; text-align: start; 290 | 291 | } 292 | .certificate-right{ 293 | width: 40%; 294 | height: 400px; 295 | } 296 | 297 | @media (max-width: 768px) { 298 | .social-media-links { 299 | justify-content: center; 300 | } 301 | } -------------------------------------------------------------------------------- /styles/hamburger.css: -------------------------------------------------------------------------------- 1 | *{ 2 | font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif; 3 | } 4 | .navbar-links { 5 | margin-left: 20px; 6 | text-decoration: none; 7 | color: #fff; 8 | } 9 | 10 | .hamburger { 11 | display: none ; 12 | flex-direction: column; 13 | cursor: pointer; 14 | transition: transform 0.6s ease; 15 | } 16 | 17 | .hamburger div { 18 | 19 | width: 25px; 20 | height: 2px; 21 | background-color: #000000; 22 | margin: 4px; 23 | transition: transform 0.3s ease, opacity 0.3s ease; 24 | } 25 | 26 | .hamburger.active div:nth-child(1) { 27 | transform: translateY(14px) rotate(45deg); 28 | } 29 | 30 | .hamburger.active div:nth-child(2) { 31 | opacity: 0; 32 | } 33 | 34 | .hamburger.active div:nth-child(3) { 35 | transform: translateY(-6px) rotate(-45deg); 36 | } 37 | 38 | .mobile-menu { 39 | display: none; 40 | flex-direction: column; 41 | align-items: center; 42 | background-color: #ffffff; 43 | width: 100%; 44 | position: fixed; 45 | top: 52px; 46 | left: 0; 47 | opacity: 0; 48 | z-index: 999; 49 | transform: translateY(-20px); 50 | transition: transform 0.5s ease, opacity 0.3s ease; 51 | padding: 12px; 52 | } 53 | 54 | 55 | .mobile-menu a { 56 | padding: 7px; 57 | width: 100%; 58 | text-align: center; 59 | /* border-bottom: 1px solid #444; */ 60 | color: #000000; 61 | text-decoration: none; 62 | } 63 | 64 | .mobile-menu.show { 65 | display: flex; 66 | opacity: 1; 67 | transform: translateY(0); 68 | } 69 | 70 | .mobile-menu a:hover { 71 | text-decoration: underline; 72 | } 73 | 74 | 75 | body.dark-mode .hamburger div { 76 | background-color: white; 77 | } 78 | 79 | body.dark-mode .mobile-menu a { 80 | color: white; 81 | } 82 | 83 | body.dark-mode .mobile-menu { 84 | background-color: #333; 85 | color: #f0f0f0; 86 | } 87 | 88 | 89 | @media (max-width: 768px) { 90 | .hamburger div { 91 | display: block; 92 | } 93 | .navbar-right { 94 | display: none; 95 | } 96 | 97 | .hamburger { 98 | display: flex; 99 | } 100 | 101 | .side-icons { 102 | flex-direction: column; 103 | margin-top: 45px; 104 | } 105 | 106 | } -------------------------------------------------------------------------------- /styles/help.css: -------------------------------------------------------------------------------- 1 | @import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap'); 2 | *{ 3 | font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif; 4 | } 5 | .container-help { 6 | display: flex; 7 | font-family: "Poppins", sans-serif; 8 | flex-direction: column; 9 | align-items: center; 10 | max-width: 100vw !important; 11 | } 12 | 13 | .content-block { 14 | display: flex; 15 | gap: 200px; 16 | justify-content: center; 17 | align-items: center; 18 | width: 80%; 19 | margin-top: 60px; 20 | margin-bottom: 30px; 21 | background-color: #fff; 22 | height: 450px; 23 | } 24 | 25 | body.dark-mode .content-block{ 26 | background-color: #333; 27 | 28 | } 29 | 30 | .main-heading { 31 | font-size: 48px; 32 | font-weight: 500; 33 | color: #121212; 34 | margin-bottom: 20px; 35 | width: 450px; 36 | word-wrap: break-word; 37 | } 38 | 39 | body.dark-mode .main-heading{ 40 | color: #fff; 41 | } 42 | 43 | .description { 44 | font-size: 16px; 45 | font-family: "Poppins", sans-serif; 46 | font-weight: 400; 47 | color: #666; 48 | } 49 | 50 | body.dark-mode .description{ 51 | color: #c0c0c0; 52 | } 53 | 54 | .steps-indicator { 55 | position: relative; 56 | height: 300px; 57 | } 58 | 59 | .step-line { 60 | position: absolute; 61 | left: 50%; 62 | top: 0; 63 | bottom: 0; 64 | width: 4px; 65 | background-color: #0066cc; 66 | } 67 | 68 | body.dark-mode .step-line{ 69 | background-color: #c0c0c0; 70 | } 71 | 72 | .step-dot { 73 | position: absolute; 74 | left: 50%; 75 | width: 20px; 76 | height: 20px; 77 | background-color: #0066cc; 78 | border-radius: 50%; 79 | transform: translateX(-40%); 80 | } 81 | 82 | body.dark-mode .step-dot{ 83 | background-color: #c0c0c0; 84 | } 85 | 86 | .step-dot::after { 87 | content: attr(data-step); 88 | position: absolute; 89 | left: 30px; 90 | top: 50%; 91 | transform: translateY(-50%); 92 | color: #0066cc; 93 | font-weight: bold; 94 | } 95 | 96 | .step-dot:nth-child(2) { top: 0; } 97 | .step-dot:nth-child(3) { top: 50%; } 98 | .step-dot:nth-child(4) { bottom: 0; } 99 | 100 | .step-box { 101 | position: absolute; 102 | background-color: #fff; 103 | box-shadow: 7px 7px 20px 0 rgba(18, 18, 18, 0.2); 104 | padding: 16px; 105 | border-radius: 16px; 106 | font-size: 12px; 107 | font-weight: 700; 108 | color: #0066cc; 109 | white-space: nowrap; 110 | } 111 | 112 | body.dark-mode .step-box{ 113 | background-color: #555; 114 | color: #fff; 115 | } 116 | 117 | .steps-clone { 118 | position: relative; 119 | display: flex; 120 | margin-top: 0px; 121 | flex-direction: column; 122 | justify-content: center; 123 | } 124 | 125 | .steps-clone:tiny { 126 | position: static; 127 | display: block; 128 | }.steps-clone { 129 | position: relative; 130 | display: flex; 131 | margin-top: 0px; 132 | flex-direction: column; 133 | justify-content: center; 134 | } 135 | .content-wrap{ 136 | width: 50%; 137 | display: flex; 138 | justify-content: center; 139 | align-items: center; 140 | 141 | 142 | 143 | } 144 | .text-block{ 145 | padding: 50px; 146 | } 147 | .step-content-block{ 148 | width: 70%; 149 | padding: 50px !important; 150 | } 151 | .steps-clone:tiny { 152 | position: static; 153 | display: block; 154 | }.dot { 155 | z-index: 3; 156 | position: absolute; 157 | width: 12px; 158 | height: 12px; 159 | margin-top: -6px; 160 | margin-bottom: -6px; 161 | border-top-left-radius: 50%; 162 | border-top-right-radius: 50%; 163 | border-bottom-left-radius: 50%; 164 | border-bottom-right-radius: 50%; 165 | } 166 | 167 | .dot:small { 168 | position: absolute; 169 | bottom: 50%; 170 | z-index: 99; 171 | margin-bottom: 0px; 172 | align-self: center; 173 | order: 2; 174 | } 175 | 176 | .step-block { 177 | position: relative; 178 | display: flex; 179 | width: 100vw !important; 180 | min-height: 80vh; 181 | margin-top: -1px; 182 | justify-content: space-around; 183 | flex-wrap: nowrap; 184 | align-items: center; 185 | align-content: center; 186 | } 187 | 188 | @media only screen and (max-width:700px){ 189 | .content-block { 190 | width: 100vw !important; 191 | overflow-x: hidden; 192 | } 193 | .text-section h3 { 194 | font-size: 1.5rem; 195 | max-width: 40%; 196 | transform: translateX(80%); 197 | } 198 | .text-section p { 199 | font-size: 1rem; 200 | max-width: 40%; 201 | transform: translateX(80%); 202 | } 203 | .steps-indicator .step-box { 204 | transform: translateX(-300%) !important; 205 | } 206 | .steps-indicator .step-dot { 207 | transform: translateX(-1200%) !important; 208 | } 209 | .steps-indicator .step-line { 210 | transform: translateX(-5800%) !important; 211 | } 212 | 213 | .step-block { 214 | max-width: 100vw !important; 215 | overflow-x: hidden !important; 216 | } 217 | .img-block img { 218 | max-width: 100vw !important; 219 | /* background-color: red; */ 220 | } 221 | .content-wrap { 222 | width: 100% !important; 223 | } 224 | .step-block{ 225 | flex-direction: column; 226 | } 227 | .dot{ 228 | bottom: 10px; 229 | } 230 | .step-block .content-wrap{ 231 | z-index: 100; 232 | } 233 | .step-block .img-block{ 234 | z-index: 100; 235 | } 236 | } 237 | .step-block:small { 238 | min-height: 110vh; 239 | flex-direction: column; 240 | justify-content: center; 241 | align-items: center; 242 | } 243 | .scoll-wrap { 244 | position: absolute; 245 | bottom: 50%; 246 | background-color: #eeeff4; 247 | width: 10px; 248 | display: flex; 249 | height: 100%; 250 | flex-direction: column; 251 | align-items: center; 252 | } 253 | 254 | .scoll-wrap:small { 255 | bottom: 50%; 256 | z-index: 1; 257 | height: 100%; 258 | } 259 | .img-block { 260 | width: 50%; 261 | display: flex; 262 | justify-content: center; 263 | align-items: center; 264 | } 265 | 266 | .img-block img{ 267 | width: 350px; 268 | } 269 | 270 | .img-block .first{ 271 | width: 450px; 272 | } 273 | 274 | .content .heading{ 275 | font-size: 20px; 276 | } 277 | 278 | .scroll-animate { 279 | position: absolute; 280 | top: 0px; 281 | width: 6px; 282 | transition: all 1.5s ease-out; 283 | z-index: 0; 284 | background-color: #3b9cdd !important; 285 | } 286 | 287 | body.dark-mode .text-block{ 288 | background-color: #333; 289 | } 290 | 291 | body.dark-mode .text-block .content{ 292 | color: #f0f0f0 !important; 293 | } 294 | 295 | body.dark-mode .text-block .content a{ 296 | color: #3b9cdd; 297 | } 298 | 299 | body.dark-mode .scroll-wrap{ 300 | border: none !important; 301 | background-color: #fff !important; 302 | } 303 | 304 | body.dark-mode .scroll-animate{ 305 | border: none !important; 306 | background-color: #c0c0c0 !important; 307 | } 308 | 309 | body.dark-mode .dot{ 310 | background-color: #c0c0c0 !important; 311 | } 312 | -------------------------------------------------------------------------------- /styles/modal.css: -------------------------------------------------------------------------------- 1 | *{ 2 | font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif; 3 | } 4 | #profileModal { 5 | position: fixed; 6 | left: 0; 7 | top: 0; 8 | width: 100%; 9 | height: 100%; 10 | display: none; 11 | background-color: rgba(0, 0, 0, 0.7); /* Dark transparent overlay */ 12 | justify-content: center; 13 | align-items: center; 14 | z-index: 1000; 15 | } 16 | 17 | .modal-content { 18 | background-color: #fff; 19 | padding: 30px; 20 | border-radius: 10px; 21 | text-align: center; 22 | width: 80%; 23 | max-width: 500px; 24 | box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.2); 25 | position: relative; 26 | transform: translate(-50%, -50%); 27 | top: 50%; 28 | left: 50%; 29 | } 30 | 31 | .modal-content h2 { 32 | margin-top: 0px; 33 | font-size: 24px; 34 | margin-bottom: 20px; 35 | color: #000; 36 | } 37 | 38 | .modal-content p { 39 | font-size: 16px; 40 | margin-bottom: 30px; 41 | color: #333; 42 | } 43 | 44 | .add-profile-button { 45 | display: inline-block; 46 | padding: 12px 25px; 47 | background-color: #000; 48 | color: #fff; 49 | font-size: 16px; 50 | border-radius: 5px; 51 | text-decoration: none; 52 | transition: background-color 0.3s ease; 53 | } 54 | 55 | .add-profile-button:hover { 56 | background-color: #333; 57 | } 58 | 59 | .close-button { 60 | position: absolute; 61 | right: 20px; 62 | top: 15px; 63 | font-size: 24px; 64 | color: #333; 65 | cursor: pointer; 66 | } 67 | 68 | #profileModal a { 69 | font-weight: bold; 70 | text-transform: uppercase; 71 | letter-spacing: 0.5px; 72 | } 73 | 74 | /* Navbar Icon Styling */ 75 | .navbar-icon { 76 | width: 40px; 77 | height: 40px; 78 | } 79 | 80 | .navbar-text { 81 | font-size: 24px; 82 | font-weight: bold; 83 | color: #000; 84 | margin-left: 10px; 85 | } 86 | 87 | body.dark-mode .modal-content p { 88 | color: rgb(181, 181, 181); 89 | } 90 | 91 | body.dark-mode .modal-content h2 { 92 | color: white; 93 | } 94 | 95 | body.dark-mode .add-profile-button:hover { 96 | background-color: #5f5f5f; 97 | } 98 | 99 | body.dark-mode .close-button { 100 | color: #ffffff; 101 | } -------------------------------------------------------------------------------- /styles/pagination.css: -------------------------------------------------------------------------------- 1 | *{ 2 | font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif; 3 | } 4 | .pagination { 5 | display: flex; 6 | justify-content: center; 7 | align-items: center; 8 | margin-top: 20px; 9 | } 10 | 11 | .pagination button { 12 | font-size: medium; 13 | margin: 0 10px; 14 | padding: 6px 10px; 15 | background-color: #3a99ff; 16 | color: white; 17 | border: none; 18 | border-radius: 5px; 19 | cursor: pointer; 20 | height: 35px; 21 | width: 45px; 22 | } 23 | 24 | .pagination button:hover { 25 | background-color: #006ac0; /* Background color on hover */ 26 | transform: scale(1.05); /* Slightly enlarge button on hover */ 27 | } 28 | 29 | .pagination button:disabled { 30 | background-color: #c0c0c0; 31 | color: rgb(77, 77, 77); 32 | cursor: not-allowed; 33 | } 34 | 35 | .pagination #page-info { 36 | font-weight: bold; 37 | } 38 | -------------------------------------------------------------------------------- /styles/speech.css: -------------------------------------------------------------------------------- 1 | *{ 2 | font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif; 3 | } 4 | .mic-button{ 5 | display: none; 6 | position: relative; 7 | right : 12px; 8 | font-size: 1em; 9 | background: none; 10 | border: none; 11 | outline: none; 12 | box-shadow: none; 13 | padding: 10px; 14 | 15 | } 16 | 17 | body.dark-mode .mic-button{ 18 | /* padding: 15px; */ 19 | border-radius: 100%; 20 | /* background-color: white !important; */ 21 | } 22 | body.dark-mode .fa-microphone{ 23 | color: #fff; 24 | } 25 | 26 | .show{ 27 | display: inline-block; 28 | } 29 | .mic-button :hover{ 30 | /* background-color: rgb(219, 214, 214); */ 31 | border-radius: 100%; 32 | /* padding: 15px; */ 33 | /* height: 10px; */ 34 | /* width: 10px; */ 35 | cursor: pointer; 36 | transition: background-color 0.3s ease; 37 | display: flex; 38 | align-items: center; 39 | justify-content: center; 40 | 41 | } 42 | 43 | #animated-voice{ 44 | display: none; 45 | } 46 | .listening{ 47 | background-color: rgb(8, 8, 8); 48 | padding: 20px; 49 | border-radius: 100%; 50 | height: 10px; 51 | width: 10px; 52 | 53 | } 54 | .listening >i{ 55 | display: none; 56 | } 57 | .listening #animated-voice{ 58 | display: block; 59 | position: relative; 60 | right: 9.5px; 61 | bottom: 7px; 62 | font-size: 1.25em; 63 | 64 | } 65 | -------------------------------------------------------------------------------- /styles/update login.js: -------------------------------------------------------------------------------- 1 | document.addEventListener('DOMContentLoaded', () => { 2 | 3 | // Toggle between sign-in and sign-up mode 4 | const sign_in_btn = document.querySelector("#sign-in-btn"); 5 | const sign_up_btn = document.querySelector("#sign-up-btn"); 6 | const container = document.querySelector(".container"); 7 | 8 | sign_up_btn.addEventListener("click", () => { 9 | container.classList.add("sign-up-mode"); 10 | }); 11 | 12 | sign_in_btn.addEventListener("click", () => { 13 | container.classList.remove("sign-up-mode"); 14 | }); 15 | 16 | // Sign-in form submission 17 | document.querySelector(".sign-in-form").addEventListener('submit', function(event) { 18 | event.preventDefault(); 19 | 20 | // Get the input values 21 | const username = document.querySelector(".sign-in-form input[type='text']").value; 22 | const password = document.querySelector(".sign-in-form input[type='password']").value; 23 | 24 | // Check for empty fields 25 | if (!username || !password) { 26 | alert('Please enter both username and password.'); 27 | return; 28 | } 29 | 30 | // Dummy login logic for demo purposes 31 | if (username === 'admin' && password === 'password') { 32 | alert('Login successful!'); 33 | // Redirect to dashboard page 34 | window.location.href = 'index.html'; 35 | } else { 36 | alert('Invalid username or password'); 37 | } 38 | }); 39 | 40 | // Sign-up form submission 41 | document.querySelector(".sign-up-form").addEventListener('submit', function(event) { 42 | event.preventDefault(); 43 | 44 | // Get the input values 45 | const username = document.querySelector(".sign-up-form input[type='text']").value; 46 | const email = document.querySelector(".sign-up-form input[type='email']").value; 47 | const password = document.querySelector(".sign-up-form input[type='password']").value; 48 | 49 | // Check for empty fields 50 | if (!username || !email || !password) { 51 | alert('Please fill in all fields'); 52 | return; 53 | } 54 | 55 | function isValidEmail(email) { 56 | const emailRegex = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/; 57 | return emailRegex.test(email); 58 | } 59 | 60 | function validateUsername(username) { 61 | const usernamePattern = /^(?=.*[a-zA-Z])[a-zA-Z0-9]{3,20}$/; 62 | return usernamePattern.test(username); 63 | } 64 | 65 | if (!validateUsername(username)) { 66 | alert('Please enter a valid username (3-20 alphanumeric characters).'); 67 | return; 68 | } 69 | 70 | if (!isValidEmail(email)) { 71 | alert('Please enter a valid email address.'); 72 | return; 73 | } 74 | 75 | // Dummy signup logic for demo purposes 76 | localStorage.setItem('username', username); 77 | localStorage.setItem('email', email); 78 | localStorage.setItem('password', password); 79 | localStorage.setItem('isLoggedIn', 'true'); 80 | 81 | alert('Signup successful!'); 82 | // Redirect to dashboard page 83 | window.location.href = 'index.html'; 84 | }); 85 | 86 | // Toggle password visibility for sign-up form 87 | const forms = document.querySelectorAll('form'); 88 | 89 | forms.forEach(form => { 90 | const togglePassword = form.querySelector('#toggle-password'); 91 | const passwordInput = form.querySelector('#password-input'); 92 | 93 | togglePassword.addEventListener('click', () => { 94 | if (passwordInput.type === 'password') { 95 | passwordInput.type = 'text'; 96 | togglePassword.classList.add('fa-lock-open'); 97 | togglePassword.classList.remove('fa-lock'); 98 | } else { 99 | passwordInput.type = 'password'; 100 | togglePassword.classList.add('fa-lock'); 101 | togglePassword.classList.remove('fa-lock-open'); 102 | } 103 | }); 104 | }); 105 | 106 | // Check password strength for sign-up form 107 | function checkPasswordStrength() { 108 | const password = document.querySelector(".sign-up-form input[type='password']").value; 109 | const strengthWeak = document.getElementById('strength-weak'); 110 | const strengthMedium = document.getElementById('strength-medium'); 111 | const strengthStrong = document.getElementById('strength-strong'); 112 | 113 | let strength = 0; 114 | 115 | if (password.length >= 8) strength++; 116 | if (password.match(/[A-Z]/)) strength++; 117 | if (password.match(/[a-z]/)) strength++; 118 | if (password.match(/[0-9]/)) strength++; 119 | if (password.match(/[^a-zA-Z0-9]/)) strength++; 120 | 121 | strengthWeak.className = ''; 122 | strengthMedium.className = ''; 123 | strengthStrong.className = ''; 124 | 125 | if (strength >= 1) strengthWeak.className = 'weak'; 126 | if (strength >= 3) strengthMedium.className = 'medium'; 127 | if (strength >= 5) strengthStrong.className = 'strong'; 128 | } 129 | 130 | document.querySelector(".sign-up-form input[type='password']").addEventListener('input', checkPasswordStrength); 131 | 132 | }); 133 | -------------------------------------------------------------------------------- /styles/videos.css: -------------------------------------------------------------------------------- 1 | .video--main { 2 | padding: 0px 0 20px 0; 3 | margin-top: 70px; 4 | } 5 | 6 | .video--container { 7 | display: flex; 8 | justify-content: center; 9 | align-items: start; 10 | gap: 20px; 11 | } 12 | 13 | .sidebar { 14 | max-width: 250px; 15 | padding: 10px; 16 | display: flex; 17 | flex-direction: column; 18 | gap: 12px; 19 | position: sticky; 20 | top: 125.6px; 21 | font-weight: 500; 22 | font-size: large; 23 | text-align: right; 24 | } 25 | 26 | .sidebar a { 27 | text-decoration: none; 28 | color: slategrey; 29 | } 30 | 31 | a:hover { 32 | color: black; 33 | animation: 1ms ease-in-out; 34 | } 35 | 36 | .hash--active { 37 | color: black !important; 38 | } 39 | 40 | .module--container { 41 | display: flex; 42 | flex-direction: column; 43 | position: relative; 44 | top: -70px; 45 | } 46 | 47 | .modules { 48 | padding-top: 70px; 49 | } 50 | 51 | .modules div { 52 | background: white; 53 | width: 600px; 54 | padding: 20px; 55 | } 56 | 57 | .modules div h1, 58 | h2 { 59 | color: black; 60 | margin: 0; 61 | } 62 | 63 | .modules div iframe { 64 | width: 100%; 65 | border-radius: 18px; 66 | } 67 | 68 | .end-line { 69 | border: 3px; 70 | } 71 | 72 | body.dark-mode .video--main { 73 | color: white; 74 | } 75 | 76 | body.dark-mode .hash--active { 77 | color: white !important; 78 | } 79 | 80 | body.dark-mode a:hover { 81 | color: white; 82 | } 83 | 84 | body.dark-mode .modules h1 { 85 | color: white; 86 | } 87 | 88 | body.dark-mode .modules h2 { 89 | color: white; 90 | } 91 | 92 | body.dark-mode .modules div { 93 | background: #3f3f3f; 94 | } 95 | --------------------------------------------------------------------------------