├── .github └── ISSUE_TEMPLATE │ ├── bug_report.md │ ├── custom.md │ └── feature_request.md ├── CONTRIBUTION.md ├── CONTRIBUTORS.md ├── FAQ's ├── LICENSE ├── README.md ├── app.js ├── assets └── images │ ├── Computer-screen-code-glitch-animation-gif-background-free.gif │ ├── GIT.png │ ├── Group_2.png │ ├── Group_3.png │ ├── Logo.png │ ├── Screenshot_13.png │ ├── Vue.png │ ├── backend.png │ ├── github.png │ ├── gitimg1.png │ ├── gitimg2.jpg │ ├── gitimg3.webp │ ├── pic1.png │ ├── pic2.png │ ├── pic3.png │ ├── soulja-boy-pepe.gif │ └── wallpaper2you_205177.gif ├── contributor-navbar ├── contributors.html ├── contributors.json ├── css ├── faq.css ├── style.css ├── style.css.map ├── style.scss └── styles.css ├── faq.html ├── faq.js ├── hacker.png ├── inbuilt-aura-portfolio-website ├── App.jsx ├── README.md ├── assets │ ├── avatar1.jpg │ ├── avatar2.jpg │ ├── avatar3.jpg │ ├── avatar4.jpg │ ├── bg-texture.png │ ├── cv.pdf │ ├── me-about.jpg │ ├── me.png │ ├── portfolio1.jpg │ ├── portfolio2.jpg │ ├── portfolio3.jpg │ ├── portfolio4.jpg │ ├── portfolio5.jpg │ └── portfolio6.jpg ├── components │ ├── About │ │ ├── about.css │ │ └── about.jsx │ ├── Contact │ │ ├── contact.css │ │ └── contact.jsx │ ├── Experience │ │ ├── experience.css │ │ └── experience.jsx │ ├── Footer │ │ ├── footer.css │ │ └── footer.jsx │ ├── Header │ │ ├── CTA.jsx │ │ ├── Socialheader.jsx │ │ ├── header.css │ │ └── header.jsx │ ├── Nav │ │ ├── nav.css │ │ └── nav.jsx │ ├── Portfolio │ │ ├── portfolio.css │ │ └── portfolio.jsx │ ├── Services │ │ ├── services.css │ │ └── services.jsx │ └── testimonial │ │ ├── testimonial.css │ │ └── testimonial.jsx ├── index.css ├── index.html ├── index.js ├── package-lock.json └── package.json ├── index.html └── script.js /.github/ISSUE_TEMPLATE/bug_report.md: -------------------------------------------------------------------------------- 1 | --- 2 | name: Bug report 3 | about: Create a report to help us improve 4 | title: '' 5 | labels: '' 6 | assignees: '' 7 | 8 | --- 9 | 10 | **Describe the bug** 11 | A clear and concise description of what the bug is. 12 | 13 | **To Reproduce** 14 | Steps to reproduce the behavior: 15 | 1. Go to '...' 16 | 2. Click on '....' 17 | 3. Scroll down to '....' 18 | 4. See error 19 | 20 | **Expected behavior** 21 | A clear and concise description of what you expected to happen. 22 | 23 | **Screenshots** 24 | If applicable, add screenshots to help explain your problem. 25 | 26 | **Desktop (please complete the following information):** 27 | - OS: [e.g. iOS] 28 | - Browser [e.g. chrome, safari] 29 | - Version [e.g. 22] 30 | 31 | **Smartphone (please complete the following information):** 32 | - Device: [e.g. iPhone6] 33 | - OS: [e.g. iOS8.1] 34 | - Browser [e.g. stock browser, safari] 35 | - Version [e.g. 22] 36 | 37 | **Additional context** 38 | Add any other context about the problem here. 39 | -------------------------------------------------------------------------------- /.github/ISSUE_TEMPLATE/custom.md: -------------------------------------------------------------------------------- 1 | --- 2 | name: Custom issue template 3 | about: Describe this issue template's purpose here. 4 | title: '' 5 | labels: '' 6 | assignees: '' 7 | 8 | --- 9 | 10 | 11 | -------------------------------------------------------------------------------- /.github/ISSUE_TEMPLATE/feature_request.md: -------------------------------------------------------------------------------- 1 | --- 2 | name: Feature request 3 | about: Suggest an idea for this project 4 | title: '' 5 | labels: '' 6 | assignees: '' 7 | 8 | --- 9 | 10 | **Is your feature request related to a problem? Please describe.** 11 | A clear and concise description of what the problem is. Ex. I'm always frustrated when [...] 12 | 13 | **Describe the solution you'd like** 14 | A clear and concise description of what you want to happen. 15 | 16 | **Describe alternatives you've considered** 17 | A clear and concise description of any alternative solutions or features you've considered. 18 | 19 | **Additional context** 20 | Add any other context or screenshots about the feature request here. 21 | -------------------------------------------------------------------------------- /CONTRIBUTION.md: -------------------------------------------------------------------------------- 1 | # Contribution Guide 2 | Please ensure your pull request adheres to the following guidelines: 3 | 4 | - Star this repo to get latest updates. 5 | - Start the Name with a capital. 6 | - Give your file a proper extension according to language. Ex: .py, .java, .js, .html etc. 7 | - Name your file related to your topic. 8 | - Put your files in correct folder like .py in Python, .js in Javascript etc. 9 | - Make sure you have entered your github - username in your file as a comment. 10 | - Make sure you have entered your name in CONTRIBUTORS.md file as mentioned (It's your responsibility). 11 | - You can also follow ME XD. 12 | 13 | Thank you for your suggestions! 14 | -------------------------------------------------------------------------------- /CONTRIBUTORS.md: -------------------------------------------------------------------------------- 1 | 💻 2 | 3 | # Add Name 4 | 5 |

Enter your Name, Github Link & Your E-Mail Address in the given format. Don't try to change anything else!!!

6 | | Name | Github Link | E-Mail Address | 7 | 8 | # List of Contributors 9 | 10 |

Make sure you have updated your Name, Github link & E-Mail Id (enter your e-mail just after mailto:)!!!

11 |
12 | 13 | | Name | Github Link | Email ID | 14 | | ------|----------|---------- | 15 | | DevvSakib | DevvSakib | E-Mail | 16 | | RXBlade | RXBlade | E-Mail | 17 | | NashidNoor | NashidNoor | E-Mail | 18 | -------------------------------------------------------------------------------- /FAQ's: -------------------------------------------------------------------------------- 1 | this contain three files index.html, style.css and main.js 2 | I have seperated files with stars scroll and you will get to know 3 | 4 | //********************************************************************************index.html*************************************************************************** 5 | 6 | 7 | 8 | 9 | 10 | 11 | FAQs 12 | 13 | 14 | 15 |
16 |

Frequently Asked Questions

17 | 18 |
19 |
20 |
21 |

What is HackerBoi website?

22 | + 23 | - 24 |
25 | 26 |
27 |

28 | It's an open-source project. 29 | By participating here,you are participating in HECKTOBERFEST 2022 30 |

31 | 32 | 33 |
34 |
35 | 36 |
37 |
38 |

How do I see HackerBoi availability?

39 | + 40 | - 41 |
42 | 43 |
44 |

45 | ---- 46 |

47 |
48 |
49 | 50 |
51 |
52 |

Why is HackerBoi so popular?

53 | + 54 | - 55 |
56 | 57 |
58 |

59 | HackerBoi is built by developers for developers, and we're proud to be home to the worlds's largest open source community. 60 |

61 |
62 |
63 |
64 |
65 | 66 | 67 | 68 | 69 | 70 | 71 | *************************************************************************** style.css*********************************************************************************** 72 | 73 | .faqs-container { 74 | font-family: "Roboto", sans-serif; 75 | max-width: 700px; 76 | margin: 0 auto; 77 | } 78 | 79 | .faqs-container .questions-container { 80 | box-shadow: 0 4px 8px -3px rgba(0, 0, 0, 0.3); 81 | } 82 | 83 | .faqs-container h2 { 84 | padding: 4px 32px; 85 | font-size: 28px; 86 | } 87 | 88 | .faqs-container .faq-header { 89 | display: flex; 90 | background: #03071e; 91 | color: #f1faee; 92 | align-items: center; 93 | position: relative; 94 | cursor: pointer; 95 | } 96 | 97 | .faqs-container .faq-header .open, 98 | .faqs-container .faq-header .close { 99 | position: absolute; 100 | right: 0; 101 | padding: 0 32px; 102 | font-size: 22px; 103 | font-weight: bold; 104 | transform: translateY(-8px); 105 | opacity: 0; 106 | transition: all 500ms; 107 | } 108 | 109 | .faqs-container .faq-header .open.active, 110 | .faqs-container .faq-header .close.active { 111 | opacity: 1; 112 | transform: translateY(0); 113 | } 114 | 115 | .faqs-container .faq-header h3 { 116 | font-size: 20px; 117 | padding: 0 32px; 118 | } 119 | 120 | .faqs-container .content { 121 | padding: 0 32px; 122 | background: #fdfffc; 123 | line-height: 2; 124 | max-height: 0; 125 | overflow: hidden; 126 | transition: all 500ms; 127 | } 128 | 129 | .faqs-container .content.active { 130 | max-height: 600px; 131 | } 132 | 133 | 134 | 135 | **********************************************************************main.js********************************************************************************* 136 | 137 | const faqHeaders = document.querySelectorAll(".faqs-container .faq-header"); 138 | 139 | faqHeaders.forEach((header, i) => { 140 | header.addEventListener("click", () => { 141 | header.nextElementSibling.classList.toggle("active"); 142 | 143 | const open = header.querySelector(".open"); 144 | const close = header.querySelector(".close"); 145 | 146 | if (header.nextElementSibling.classList.contains("active")) { 147 | open.classList.remove("active"); 148 | close.classList.add("active"); 149 | } else { 150 | open.classList.add("active"); 151 | close.classList.remove("active"); 152 | } 153 | }); 154 | }); 155 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2022 Devv Sakib 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 | # Hacktoberfest Project 2 | ![Screenshot](assets/images/Screenshot_13.png) 3 | 4 | Use this project to collaborate with [Hacktoberfest](https://hacktoberfest.digitalocean.com) . Make Pull Request and get a chance to win hacktoberfest T-Shirt. Avoid scam, make sure project has hacktoberfest label. So star nowww 5 | ## 1. Clone the repo 6 | ``` 7 | $ git clone https://github.com/devvsakib/hackerboi 8 | ``` 9 | ## 2. Navigate to the folder 10 | ``` 11 | $ cd hackerboi 12 | ``` 13 | ## 3. Start coding 14 | 15 | ## Best repository 16 | You can join with us here, one of the best repository to PR. PR your projects, showcase everyone 17 | [HACKTOBERFEST-REACT-PROJECTS](https://github.com/devvsakib/hacktoberfest-react-project) 18 | 19 | > While working, please disable Lock overlay. Otherwise you have to unlock everytime you update code 20 | 21 | ### LICENSE 22 | [MIT](https://github.com/devvsakib/hackerboi/blob/master/LICENSE) 23 | 24 | ## What is Hacktoberfest? 25 | 26 | It is open to everyone in our global community. Whether you’re a developer, student learning to code, event host, or company of any size, you can help drive growth of open source and make positive contributions to an ever-growing community. All backgrounds and skill levels are encouraged to complete the challenge. 27 | 28 | - Hacktoberfest is a celebration open to everyone in our global community. 29 | - Pull requests can be made in any GitHub-hosted repositories/projects with [hacktoberfest](https://github.com/search?q=hacktoberfest) topic added. 30 | - You can sign up anytime between October 1 and October 31. 31 | *** 32 | # 👕 Why Should I Contribute? 33 | Hacktoberfest has a plain and simple moto 34 | > Support open source with meaningful PRs and earn a limited edition T-shirt! 35 | So, yes! You can win a T-Shirt and few awesome stickers to attach on your laptop. On plus side, you will get into beautiful world of open source.
36 | Working with open source project is a rewarding experience that allows you to practice your talent, collaborate with and learn from others, and give back to the developer community. 37 | ### NOTE: 38 | * making four out of (4/4) meaningful contributions to open source projects will qualify you for prizes 39 | * Scripts to be added in there respective folder with proper doumentaion. 40 | * Read GUIDELINES.md before making a PR. 41 | *** 42 | 43 | ## IMPORTANT INSTRUCTIONS 44 | You must register and make four valid pull requests (PRs) between October 1-31 (in any time zone). PRs made before or after that won't be counted!! 45 | 46 | Visit the hactoberfest site for more details :- https://hacktoberfest.digitalocean.com 47 | ## JOIN OUR COMMMUNITY 48 | DISCORD - [JOIN](https://discord.gg/6XRTeHRxWV) 49 | -------------------------------------------------------------------------------- /app.js: -------------------------------------------------------------------------------- 1 | const unlockLock = document.querySelector('.lockUnlock'), 2 | pass = document.querySelector('#pass'), 3 | lockAgain = document.querySelector('.lock'), 4 | submit = document.querySelector('#submit'), 5 | freedom = document.querySelector(".freedom") 6 | document.querySelector("body").style.overflow = "hidden" 7 | freedom.classList.add('hide'); 8 | 9 | 10 | 11 | 12 | 13 | submit.onclick = () => { 14 | event.preventDefault() 15 | getPass = pass.value; 16 | const times = new Date(); 17 | const hour = times.getHours(); 18 | const minute = times.getMinutes(); 19 | let passToMatch = `${hour}${minute}` 20 | if (Number(getPass) == passToMatch) { 21 | unlockLock.classList.add('hide'); 22 | freedom.classList.remove('hide'); 23 | unlockLock.style.opacity = "0"; 24 | unlockLock.style.transition = "1200ms cubic-bezier(0.25, 0.46, 0.45, 0.94)"; 25 | 26 | 27 | document.body.style.overflow = "auto"; 28 | pass.value = "" 29 | } 30 | else if (getPass == '') { 31 | alert("Password Required"); 32 | } 33 | else { 34 | alert("Think Twice!!"); 35 | } 36 | } 37 | lockAgain.onclick = () => { 38 | window.scrollTo(0, 0); 39 | unlockLock.classList.remove('hide'); 40 | document.querySelector("body").style.overflow = "hidden" 41 | unlockLock.style.opacity = "100"; 42 | freedom.classList.add('hide') 43 | } 44 | window.onscroll = () => { 45 | // if scrollY greater than 0 sticky-nav class will be added 46 | var menuContainer = document.querySelector(".menuContainer"); 47 | menuContainer.classList.toggle("sticky-nav",window.scrollY>0); 48 | 49 | if (window.scrollY <= 20) { 50 | document.querySelector(".downArrow").style.opacity = '1'; 51 | document.querySelector(".downArrow").style.transition = '300ms ease-in-out'; 52 | 53 | } else { 54 | document.querySelector(".downArrow").style.opacity = '0'; 55 | document.querySelector(".downArrow").style.transition = '300ms ease-in-out'; 56 | } 57 | } 58 | -------------------------------------------------------------------------------- /assets/images/Computer-screen-code-glitch-animation-gif-background-free.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/devvsakib/hackerboi/6622399444ee2cbdca751d73e70f6b094f8bd955/assets/images/Computer-screen-code-glitch-animation-gif-background-free.gif -------------------------------------------------------------------------------- /assets/images/GIT.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/devvsakib/hackerboi/6622399444ee2cbdca751d73e70f6b094f8bd955/assets/images/GIT.png -------------------------------------------------------------------------------- /assets/images/Group_2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/devvsakib/hackerboi/6622399444ee2cbdca751d73e70f6b094f8bd955/assets/images/Group_2.png -------------------------------------------------------------------------------- /assets/images/Group_3.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/devvsakib/hackerboi/6622399444ee2cbdca751d73e70f6b094f8bd955/assets/images/Group_3.png -------------------------------------------------------------------------------- /assets/images/Logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/devvsakib/hackerboi/6622399444ee2cbdca751d73e70f6b094f8bd955/assets/images/Logo.png -------------------------------------------------------------------------------- /assets/images/Screenshot_13.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/devvsakib/hackerboi/6622399444ee2cbdca751d73e70f6b094f8bd955/assets/images/Screenshot_13.png -------------------------------------------------------------------------------- /assets/images/Vue.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/devvsakib/hackerboi/6622399444ee2cbdca751d73e70f6b094f8bd955/assets/images/Vue.png -------------------------------------------------------------------------------- /assets/images/backend.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/devvsakib/hackerboi/6622399444ee2cbdca751d73e70f6b094f8bd955/assets/images/backend.png -------------------------------------------------------------------------------- /assets/images/github.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/devvsakib/hackerboi/6622399444ee2cbdca751d73e70f6b094f8bd955/assets/images/github.png -------------------------------------------------------------------------------- /assets/images/gitimg1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/devvsakib/hackerboi/6622399444ee2cbdca751d73e70f6b094f8bd955/assets/images/gitimg1.png -------------------------------------------------------------------------------- /assets/images/gitimg2.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/devvsakib/hackerboi/6622399444ee2cbdca751d73e70f6b094f8bd955/assets/images/gitimg2.jpg -------------------------------------------------------------------------------- /assets/images/gitimg3.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/devvsakib/hackerboi/6622399444ee2cbdca751d73e70f6b094f8bd955/assets/images/gitimg3.webp -------------------------------------------------------------------------------- /assets/images/pic1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/devvsakib/hackerboi/6622399444ee2cbdca751d73e70f6b094f8bd955/assets/images/pic1.png -------------------------------------------------------------------------------- /assets/images/pic2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/devvsakib/hackerboi/6622399444ee2cbdca751d73e70f6b094f8bd955/assets/images/pic2.png -------------------------------------------------------------------------------- /assets/images/pic3.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/devvsakib/hackerboi/6622399444ee2cbdca751d73e70f6b094f8bd955/assets/images/pic3.png -------------------------------------------------------------------------------- /assets/images/soulja-boy-pepe.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/devvsakib/hackerboi/6622399444ee2cbdca751d73e70f6b094f8bd955/assets/images/soulja-boy-pepe.gif -------------------------------------------------------------------------------- /assets/images/wallpaper2you_205177.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/devvsakib/hackerboi/6622399444ee2cbdca751d73e70f6b094f8bd955/assets/images/wallpaper2you_205177.gif -------------------------------------------------------------------------------- /contributor-navbar: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Navbar 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 36 | 37 | 38 | 39 | -------------------------------------------------------------------------------- /contributors.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | Hackerboi - Contributors 9 | 10 | 11 | 12 | 13 | 14 | 16 | 19 | 22 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 |
33 |
34 |
35 |
36 |
37 | 43 |
44 | 49 |
50 |
51 |
52 |
53 |
54 |
55 | 56 |
57 |

Our Contributors

58 |

THANKS TO ALL CONTRIBUTORS, JOIN US

59 | 60 |
61 | 139 | 140 |
141 | 142 | 143 | 144 | 145 | 146 | -------------------------------------------------------------------------------- /contributors.json: -------------------------------------------------------------------------------- 1 | { 2 | "profiles": [ 3 | { 4 | "name": "DevvSakib", 5 | "avatarUrl": "https://avatars.githubusercontent.com/u/88339569?v=4", 6 | "github": "devvsakib", 7 | "twitter": "devvsakib" 8 | }, 9 | 10 | { 11 | "name": "Jyoti Pandey", 12 | "avatarUrl": "https://avatars.githubusercontent.com/u/86061956?v=4", 13 | "github": "pjyoti121" 14 | }, 15 | 16 | { 17 | "name": "sonijogesh", 18 | "avatarUrl": "https://avatars.githubusercontent.com/u/114826902?v=4", 19 | "github": "sonijogesh" 20 | }, 21 | 22 | { 23 | "name": "Abit Salihu", 24 | "avatarUrl": "https://avatars.githubusercontent.com/u/94648837?v=4", 25 | "github": "abitsalihu", 26 | "twitter": "abitsalihu" 27 | }, 28 | 29 | { 30 | "name": "Frey0-0", 31 | "avatarUrl": "https://avatars.githubusercontent.com/u/94757729?v=4", 32 | "github": "Frey0-0" 33 | }, 34 | 35 | { 36 | "name": "Andrei Pascuta", 37 | "avatarUrl": "https://avatars.githubusercontent.com/u/7703903?v=4", 38 | "github": "RXBlade" 39 | }, 40 | 41 | { 42 | "name": "Hammad Saeed Khan", 43 | "avatarUrl": "https://avatars.githubusercontent.com/u/65037715?v=4", 44 | "github": "HammadKhaan", 45 | "twitter": "Hammad_Khan11" 46 | }, 47 | 48 | { 49 | "name": "ayushrakesh", 50 | "avatarUrl": "https://avatars.githubusercontent.com/u/115995339?v=4", 51 | "github": "ayushrakesh" 52 | }, 53 | 54 | { 55 | "name": "tchar7", 56 | "avatarUrl": "https://avatars.githubusercontent.com/u/115107146?v=4", 57 | "github": "tchar7" 58 | }, 59 | 60 | { 61 | "name": "AMAN MADDHESHIYA", 62 | "avatarUrl": "https://avatars.githubusercontent.com/u/74290697?v=4", 63 | "github": "inbuilt-aura" 64 | }, 65 | 66 | { 67 | "name": "Smith joe", 68 | "avatarUrl": "https://avatars.githubusercontent.com/u/73308872?v=4", 69 | "github": "smithop" 70 | }, 71 | 72 | { 73 | "name": "J S Vignesh Kanna", 74 | "avatarUrl": "https://avatars.githubusercontent.com/u/42484705?v=4", 75 | "github": "jsvigneshkanna" 76 | }, 77 | 78 | { 79 | "name": "Azeddine Taki", 80 | "avatarUrl": "https://avatars.githubusercontent.com/u/93717614?v=4", 81 | "github": "azeddine011" 82 | }, 83 | 84 | { 85 | "name": "Vikash", 86 | "avatarUrl": "https://avatars.githubusercontent.com/u/114328709?v=4", 87 | "github": "vikash485" 88 | }, 89 | 90 | { 91 | "name": "Muhammad Rehan", 92 | "avatarUrl": "https://avatars.githubusercontent.com/u/85170641?v=4", 93 | "github": "Rehan-4778" 94 | }, 95 | 96 | { 97 | "name": "Vijayalaxmi Kadham", 98 | "avatarUrl": "https://avatars.githubusercontent.com/u/104844714?v=4", 99 | "github": "KadhamVj23", 100 | "twitter": "Vijayalaxmikad" 101 | }, 102 | 103 | { 104 | "name": "Hyper Nova", 105 | "avatarUrl": "https://avatars.githubusercontent.com/u/116303411?v=4", 106 | "github": "HyperNova114" 107 | }, 108 | { 109 | "name": "Mridul Bagla", 110 | "avatarUrl": "https://avatars.githubusercontent.com/u/53037689?v=4", 111 | "github": "mridul-mb", 112 | "twitter":"MridulBagla" 113 | } 114 | ] 115 | } -------------------------------------------------------------------------------- /css/faq.css: -------------------------------------------------------------------------------- 1 | .faqs-container { 2 | font-family: "Roboto", sans-serif; 3 | max-width: 700px; 4 | margin: 0 auto; 5 | } 6 | 7 | .faqs-container .questions-container { 8 | box-shadow: 0 4px 8px -3px rgba(0, 0, 0, 0.3); 9 | } 10 | 11 | .faqs-container h2 { 12 | padding: 4px 32px; 13 | font-size: 28px; 14 | } 15 | 16 | .faqs-container .faq-header { 17 | display: flex; 18 | background: #03071e; 19 | color: #f1faee; 20 | align-items: center; 21 | position: relative; 22 | cursor: pointer; 23 | } 24 | 25 | .faqs-container .faq-header .open, 26 | .faqs-container .faq-header .close { 27 | position: absolute; 28 | right: 0; 29 | padding: 0 32px; 30 | font-size: 22px; 31 | font-weight: bold; 32 | transform: translateY(-8px); 33 | opacity: 0; 34 | transition: all 500ms; 35 | } 36 | 37 | .faqs-container .faq-header .open.active, 38 | .faqs-container .faq-header .close.active { 39 | opacity: 1; 40 | transform: translateY(0); 41 | } 42 | 43 | .faqs-container .faq-header h3 { 44 | font-size: 20px; 45 | padding: 0 32px; 46 | } 47 | 48 | .faqs-container .content { 49 | padding: 0 32px; 50 | background: #fdfffc; 51 | line-height: 2; 52 | max-height: 0; 53 | overflow: hidden; 54 | transition: all 500ms; 55 | } 56 | 57 | .faqs-container .content.active { 58 | max-height: 600px; 59 | } -------------------------------------------------------------------------------- /css/style.css: -------------------------------------------------------------------------------- 1 | @import url("https://fonts.googleapis.com/css2?family=Raleway:wght@200;300;400;500;600;700;800;900&family=Rambla:wght@400;700&display=swap"); 2 | a { 3 | text-decoration: none; 4 | color: white !important; 5 | } 6 | 7 | p, 8 | h1, 9 | h2, 10 | h3, 11 | h4, 12 | h5, 13 | h6 { 14 | margin: 0; 15 | padding: 0; 16 | } 17 | 18 | ul, 19 | li { 20 | margin: 0; 21 | padding: 0; 22 | list-style: none; 23 | } 24 | 25 | img { 26 | max-width: 100%; 27 | } 28 | 29 | body { 30 | background-color: #272727; 31 | color: #fff; 32 | font-family: rambla; 33 | font-size: 16px; 34 | overflow: auto; 35 | } 36 | 37 | .alert .alert-black { 38 | z-index: 999; 39 | } 40 | 41 | .hide { 42 | visibility: hidden; 43 | } 44 | 45 | .lock { 46 | z-index: 9999; 47 | position: fixed; 48 | bottom: 20px; 49 | left: 50px; 50 | cursor: pointer !important; 51 | padding: 6px 12px; 52 | background-color:rgb(36, 36, 36); 53 | border: 1px solid rgba(212, 212, 212, 0.881); 54 | border-radius: 7px; 55 | box-shadow: inset 0 0 4px .3px rgba(165, 165, 165, 0.5) 56 | , 0 0 4px .3px rgba(165, 165, 165, 0.5); 57 | } 58 | 59 | .lock:hover{ 60 | background-color: #fff; 61 | color: #000; 62 | box-shadow: inset 0 0 4px .3px rgba(0, 0, 0, 0.5) 63 | , 0 0 4px .3px rgba(0, 0, 0, 0.5); 64 | 65 | } 66 | 67 | .lockUnlock { 68 | z-index: 99999; 69 | width: 100vw; 70 | height: 100vh; 71 | position: fixed; 72 | display: flex; 73 | align-items: center; 74 | background: linear-gradient(0deg, rgba(30, 255, 0, 0.3), rgba(17, 16, 17, 0.3)), url(assets/images/wallpaper2you_205177.gif); 75 | background-size: cover; 76 | opacity: 1; 77 | } 78 | .lockUnlock .unlockContent { 79 | justify-content: center; 80 | color: #fff; 81 | width: 400px; 82 | } 83 | .lockUnlock .unlockContent input, 84 | .lockUnlock .unlockContent button { 85 | width: 100%; 86 | } 87 | .lockUnlock .unlockContent input { 88 | padding: 10px 20px; 89 | border: 2px solid black; 90 | border-radius: 10px; 91 | outline: none; 92 | color: #272727; 93 | } 94 | 95 | .lockUnlock img:hover{ 96 | -webkit-animation:spin 2s linear infinite; 97 | -moz-animation:spin 2s linear infinite; 98 | animation:spin 4s linear infinite; 99 | } 100 | 101 | @-moz-keyframes spin { 102 | 0% { transform: translateX(0);} 103 | 25% {transform: translateX(75px);} 104 | 50% {transform: translateX(0);} 105 | 75% {transform: translateX(-75px);} 106 | 100% {transform: translateX(0);} 107 | 108 | } 109 | @-webkit-keyframes spin { 110 | 0% { transform: translateX(0);} 111 | 25% {transform: translateX(75px);} 112 | 50% {transform: translateX(0);} 113 | 75% {transform: translateX(-75px);} 114 | 100% {transform: translateX(0);} 115 | } 116 | 117 | @keyframes spin { 118 | 0% { transform: translateX(0);} 119 | 25% {transform: translateX(75px);} 120 | 50% {transform: translateX(0);} 121 | 75% {transform: translateX(-75px);} 122 | 100% {transform: translateX(0);} 123 | 124 | } 125 | 126 | 127 | .lockUnlock .unlockContent button { 128 | color: white; 129 | border: none; 130 | outline: none; 131 | background: #000; 132 | padding: 10px 0; 133 | border-radius: 10px; 134 | border: 1px solid #fff; 135 | transition: background-color 400ms cubic-bezier(0.25, 0.46, 0.45, 0.94); 136 | } 137 | .lockUnlock .unlockContent button:hover { 138 | color: #000; 139 | background-color: #fff; 140 | border-color: #000; 141 | } 142 | 143 | .header-section { 144 | background-color: #000; 145 | box-shadow: 0 1px 10px 4px #424242; 146 | } 147 | 148 | .header { 149 | padding: 15px 0; 150 | display: flex; 151 | justify-content: space-between; 152 | align-items: center; 153 | } 154 | .header a { 155 | border-radius: 5px; 156 | transition: background 1s ease-in-out; 157 | } 158 | .header a .logo_style { 159 | box-sizing: border-box; 160 | border-radius: 5px; 161 | border: 1px solid #fff; 162 | font-size: 1.5rem; 163 | } 164 | .header a .logo_style .logoDevv { 165 | background-color: #fff; 166 | padding: 4px 10px; 167 | color: #000; 168 | border-radius: 5px; 169 | margin-left: -2px; 170 | } 171 | .header a .logo_style .logoSakib { 172 | padding: 4px 10px 4px 15px; 173 | font-size: 1.5rem; 174 | border-radius: 3px; 175 | margin-left: -13px; 176 | } 177 | .header a:hover .logoDevv { 178 | box-sizing: border-box; 179 | -webkit-box-sizing: border-box; 180 | background: #000; 181 | color: #fff; 182 | transition: 400ms ease-in-out; 183 | } 184 | .header a:hover .logo_style { 185 | border-color: #000; 186 | background: #fff; 187 | transition: 400ms ease-in-out; 188 | } 189 | .header a:hover .logoSakib { 190 | transition: 400ms ease-in-out; 191 | color: #000; 192 | } 193 | .header .menuContainer { 194 | width: 225px; 195 | } 196 | .header .menuContainer ul { 197 | display: flex; 198 | justify-content: space-between; 199 | } 200 | .header .menuContainer ul li a { 201 | text-transform: uppercase; 202 | } 203 | 204 | /* sticky navbar */ 205 | .sticky-nav{ 206 | position: fixed; 207 | top: 25px; 208 | width: 35% !important; 209 | left: 50%; 210 | transform: translate(-50%,-50%); 211 | background-color: rgb(0, 0, 0); 212 | padding: 15px; 213 | z-index: 1; 214 | border-bottom-left-radius: 30px; 215 | border-bottom-right-radius: 30px; 216 | border: 1px solid rgba(212, 212, 212, 0.881); 217 | box-shadow: inset 0 0 4px 0.3px rgb(165 165 165 / 50%), 0 0 4px 0.3px rgb(165 165 165 / 50%); 218 | transition: width 1s; 219 | } 220 | /* sticky navbar end */ 221 | .hero-section { 222 | height: calc(100vh - 67.83px); 223 | position: relative; 224 | overflow-x: hidden; 225 | } 226 | .hero-section .hero-title { 227 | font-weight: bold; 228 | font-size: 120px; 229 | } 230 | .hero-section .hero-subtitle { 231 | font-size: 4rem; 232 | } 233 | .hero-section .hero-image img { 234 | width: 100%; 235 | } 236 | .hero-section .fixed-img { 237 | position: absolute; 238 | width: 100px; 239 | height: auto; 240 | } 241 | .hero-section .git { 242 | width: 70px; 243 | top: 50px; 244 | left: 15px; 245 | -webkit-animation: fixed-img 2s linear infinite alternate; 246 | animation: fixed-img 2s linear infinite alternate; 247 | } 248 | .hero-section .vue { 249 | top: 50px; 250 | width: 40px; 251 | transform: translateY(20px) rotate(50deg); 252 | left: 350px; 253 | -webkit-animation: fixed-img-up-down 2s forwards infinite alternate; 254 | animation: fixed-img-up-down 2s forwards infinite alternate; 255 | } 256 | .hero-section .github { 257 | top: 230px; 258 | width: 40px; 259 | transform: translateY(0px); 260 | left: 250px; 261 | -webkit-animation: fixed-img-up-down 2s linear infinite alternate; 262 | animation: fixed-img-up-down 2s linear infinite alternate; 263 | -webkit-animation-delay: 400ms; 264 | animation-delay: 400ms; 265 | } 266 | .hero-section .bigImg, 267 | .hero-section .backendImg { 268 | top: 400px; 269 | opacity: 0.5; 270 | width: 150px; 271 | transform: translateY(0px); 272 | left: 50%; 273 | -webkit-animation: fixed-img 2s backwards infinite alternate; 274 | animation: fixed-img 2s backwards infinite alternate; 275 | -webkit-animation-delay: 400ms; 276 | animation-delay: 400ms; 277 | } 278 | .hero-section .backendImg { 279 | top: 420px; 280 | left: 35%; 281 | } 282 | .hero-section .downArrow { 283 | position: absolute; 284 | bottom: 1rem; 285 | left: 50%; 286 | right: 50%; 287 | -webkit-animation: upDown 600ms linear infinite alternate; 288 | animation: upDown 600ms linear infinite alternate; 289 | } 290 | .hero-section .downArrow i { 291 | font-size: 1.3rem; 292 | } 293 | @-webkit-keyframes upDown { 294 | from { 295 | transform: translateY(0px); 296 | } 297 | to { 298 | transform: translateY(10px); 299 | } 300 | } 301 | @keyframes upDown { 302 | from { 303 | transform: translateY(0px); 304 | } 305 | to { 306 | transform: translateY(10px); 307 | } 308 | } 309 | 310 | @-webkit-keyframes fixed-img { 311 | 0% { 312 | transform: translateY(0); 313 | } 314 | 100% { 315 | transform: translateY(30px); 316 | } 317 | } 318 | 319 | @keyframes fixed-img { 320 | 0% { 321 | transform: translateY(0); 322 | } 323 | 100% { 324 | transform: translateY(30px); 325 | } 326 | } 327 | @-webkit-keyframes fixed-img-up-down { 328 | 0% { 329 | transform: translateY(0) rotate(20deg); 330 | } 331 | 100% { 332 | transform: translateX(30px) rotate(0deg); 333 | } 334 | } 335 | @keyframes fixed-img-up-down { 336 | 0% { 337 | transform: translateY(0) rotate(20deg); 338 | } 339 | 100% { 340 | transform: translateX(30px) rotate(0deg); 341 | } 342 | } 343 | .alert-dismissible { 344 | margin-bottom: -5px; 345 | } 346 | 347 | .alert-dismissible { 348 | margin-bottom: -5px; 349 | } 350 | 351 | @media (max-width: 840px) { 352 | .hero-section { 353 | margin-top: -40px; 354 | } 355 | .hero-section .hero-title { 356 | font-size: 5rem; 357 | } 358 | .hero-section .hero-subtitle { 359 | font-size: 3rem; 360 | } 361 | .hero-section .hero-tagline { 362 | font-size: 0.8rem; 363 | } 364 | .hero-section .bigImg, 365 | .hero-section .backendImg { 366 | margin-top: 40px; 367 | } 368 | .hero-section .backendImg { 369 | margin-left: -60px; 370 | } 371 | .sticky-nav{width:50% !important;} 372 | } 373 | @media (max-width: 600px) { 374 | .hero-section { 375 | margin-top: -40px; 376 | } 377 | .hero-section .hero-title { 378 | font-size: 4rem; 379 | } 380 | .hero-section .hero-subtitle { 381 | font-size: 1.4rem; 382 | } 383 | .hero-section .hero-tagline { 384 | font-size: 0.8rem; 385 | } 386 | } 387 | @media (max-width: 465px) { 388 | .hero-section .forMd { 389 | display: flex; 390 | flex-direction: column; 391 | justify-content: center; 392 | align-items: center; 393 | margin-left: -100px; 394 | } 395 | .hero-section .hero-title { 396 | font-size: 4rem; 397 | } 398 | .hero-section .hero-subtitle { 399 | font-size: 1.5rem; 400 | } 401 | .hero-section .hero-tagline { 402 | font-size: 0.8rem; 403 | } 404 | .hero-section .hero-image { 405 | margin-top: 40px; 406 | width: 80vw; 407 | } 408 | .hero-section .git { 409 | top: 80px; 410 | } 411 | .hero-section .github { 412 | top: 200px; 413 | } 414 | .hero-section .vue { 415 | left: 200px; 416 | } 417 | .hero-section .bigImg, 418 | .hero-section .backendImg { 419 | display: none; 420 | } 421 | .sticky-nav{width:80% !important;} 422 | } 423 | @media (max-width: 360px) { 424 | .header { 425 | padding: 15px 0; 426 | display: flex; 427 | justify-content: space-between; 428 | align-items: center; 429 | flex-direction: column; 430 | } 431 | .header .logo_style { 432 | margin-bottom: 10px; 433 | } 434 | .hero-section { 435 | margin-top: -60px; 436 | } 437 | .hero-section .forMd { 438 | display: flex; 439 | flex-direction: column; 440 | justify-content: center; 441 | align-items: center; 442 | margin-left: -100px; 443 | } 444 | .hero-section .hero-title { 445 | font-size: 4rem; 446 | } 447 | .hero-section .hero-subtitle { 448 | font-size: 1.5rem; 449 | } 450 | .hero-section .hero-tagline { 451 | font-size: 0.8rem; 452 | } 453 | .hero-section .hero-image { 454 | margin-top: 40px; 455 | width: 80vw; 456 | } 457 | .hero-section .git { 458 | top: 80px; 459 | } 460 | .hero-section .github { 461 | top: 200px; 462 | } 463 | .hero-section .vue { 464 | left: 200px; 465 | } 466 | .hero-section .bigImg, 467 | .hero-section .backendImg { 468 | display: none; 469 | } 470 | } 471 | @media (max-width: 275px) { 472 | .header { 473 | padding: 15px 0; 474 | display: flex; 475 | justify-content: space-between; 476 | align-items: center; 477 | flex-direction: column; 478 | } 479 | .header .logo_style { 480 | margin-bottom: 10px; 481 | } 482 | .hero-section { 483 | margin-top: -40px; 484 | text-align: center; 485 | width: 100vw; 486 | } 487 | .hero-section .forMd { 488 | margin: 0 auto; 489 | } 490 | .hero-section .col-6 { 491 | width: 100vw; 492 | padding: 0; 493 | } 494 | .hero-section .hero-title { 495 | margin-left: -50px !important; 496 | font-size: 20vw; 497 | } 498 | .hero-section .hero-subtitle { 499 | font-size: 12vw; 500 | margin-left: -50px !important; 501 | } 502 | .hero-section .hero-tagline { 503 | margin-left: -50px !important; 504 | font-size: 7vw; 505 | } 506 | } 507 | .footer-section footer { 508 | padding: 10px; 509 | text-align: center; 510 | background-color: #414040; 511 | }/*# sourceMappingURL=style.css.map */ -------------------------------------------------------------------------------- /css/style.css.map: -------------------------------------------------------------------------------- 1 | {"version":3,"sources":["style.scss","style.css"],"names":[],"mappings":"AAAQ,4IAAA;AAGR;EACI,qBAAA;EACA,uBAAA;ACDJ;;ADIA;;;;;;;EAOI,SAAA;EACA,UAAA;ACDJ;;ADIA;;EAEI,SAAA;EACA,UAAA;EACA,gBAAA;ACDJ;;ADIA;EACI,eAAA;ACDJ;;ADIA;EACI,yBAAA;EACA,WAAA;EACA,mBAAA;EACA,eAAA;EACA,cAAA;ACDJ;;ADIA;EACI,YAAA;ACDJ;;ADKA;EACI,kBAAA;ACFJ;;ADKA;EACI,aAAA;EACA,eAAA;EACA,YAAA;EACA,UAAA;EACA,0BAAA;ACFJ;;ADOA;EACI,cAAA;EACA,YAAA;EACA,aAAA;EACA,eAAA;EACA,aAAA;EACA,mBAAA;EACA,4HAAA;EACA,sBAAA;EACA,UAAA;ACJJ;ADMI;EACI,uBAAA;EACA,WAAA;EACA,YAAA;ACJR;ADMQ;;EAEI,WAAA;ACJZ;ADOQ;EACI,kBAAA;EACA,uBAAA;EACA,mBAAA;EACA,aAAA;EACA,cAAA;ACLZ;ADQQ;EACI,YAAA;EACA,YAAA;EACA,aAAA;EACA,gBAAA;EACA,eAAA;EACA,mBAAA;EACA,sBAAA;EACA,uEAAA;ACNZ;ADQY;EACI,WAAA;EACA,sBAAA;EACA,kBAAA;ACNhB;;ADcA;EACI,sBAAA;EACA,kCAAA;ACXJ;;ADcA;EACI,eAAA;EACA,aAAA;EACA,8BAAA;EACA,mBAAA;ACXJ;ADaI;EAEI,kBAAA;EACA,qCAAA;ACZR;ADcQ;EACI,sBAAA;EACA,kBAAA;EACA,sBAAA;EACA,iBAAA;ACZZ;ADcY;EACI,sBAAA;EACA,iBAAA;EACA,WAAA;EACA,kBAAA;EACA,iBAAA;ACZhB;ADeY;EACI,0BAAA;EACA,iBAAA;EACA,kBAAA;EACA,kBAAA;ACbhB;ADkBY;EACI,sBAAA;EACA,8BAAA;EACA,gBAAA;EACA,WAAA;EACA,6BAAA;AChBhB;ADmBY;EACI,kBAAA;EACA,gBAAA;EACA,6BAAA;ACjBhB;ADoBY;EACI,6BAAA;EAEA,WAAA;ACnBhB;ADwBI;EACI,YAAA;ACtBR;ADwBQ;EACI,aAAA;EACA,8BAAA;ACtBZ;ADyBgB;EACI,yBAAA;ACvBpB;;AD+BA;EACI,6BAAA;EACA,kBAAA;EACA,kBAAA;AC5BJ;AD8BI;EACI,iBAAA;EACA,gBAAA;AC5BR;AD+BI;EACI,eAAA;AC7BR;ADiCQ;EACI,WAAA;AC/BZ;ADmCI;EACI,kBAAA;EACA,YAAA;EACA,YAAA;ACjCR;ADoCI;EACI,WAAA;EACA,SAAA;EACA,UAAA;EACA,yDAAA;UAAA,iDAAA;AClCR;ADqCI;EACI,SAAA;EACA,WAAA;EACA,yCAAA;EACA,WAAA;EACA,mEAAA;UAAA,2DAAA;ACnCR;ADsCI;EACI,UAAA;EACA,WAAA;EACA,0BAAA;EACA,WAAA;EACA,iEAAA;UAAA,yDAAA;EACA,8BAAA;UAAA,sBAAA;ACpCR;ADuCI;;EAEI,UAAA;EACA,YAAA;EACA,YAAA;EACA,0BAAA;EACA,SAAA;EACA,4DAAA;UAAA,oDAAA;EACA,8BAAA;UAAA,sBAAA;ACrCR;ADwCI;EACI,UAAA;EACA,SAAA;ACtCR;ADyCI;EACI,kBAAA;EACA,YAAA;EACA,SAAA;EACA,UAAA;EACA,yDAAA;UAAA,iDAAA;ACvCR;ADyCQ;EACI,iBAAA;ACvCZ;AD2CI;EACI;IACI,0BAAA;ECzCV;ED4CM;IACI,2BAAA;EC1CV;AACF;ADmCI;EACI;IACI,0BAAA;ECzCV;ED4CM;IACI,2BAAA;EC1CV;AACF;;AD+CA;EACI;IACI,wBAAA;EC5CN;ED+CE;IACI,2BAAA;EC7CN;AACF;;ADsCA;EACI;IACI,wBAAA;EC5CN;ED+CE;IACI,2BAAA;EC7CN;AACF;ADgDA;EACI;IACI,sCAAA;EC9CN;EDkDE;IACI,wCAAA;EChDN;AACF;ADwCA;EACI;IACI,sCAAA;EC9CN;EDkDE;IACI,wCAAA;EChDN;AACF;ADmDA;EACI,mBAAA;ACjDJ;;ADmDA;EACI,mBAAA;AChDJ;;ADmDA;EACI;IACI,iBAAA;EChDN;EDkDM;IACI,eAAA;EChDV;EDmDM;IACI,eAAA;ECjDV;EDoDM;IACI,iBAAA;EClDV;EDqDM;;IAEI,gBAAA;ECnDV;EDsDM;IACI,kBAAA;ECpDV;AACF;ADwDA;EACI;IACI,iBAAA;ECtDN;EDwDM;IACI,eAAA;ECtDV;EDyDM;IACI,iBAAA;ECvDV;ED0DM;IACI,iBAAA;ECxDV;AACF;AD2DA;EAEQ;IACI,aAAA;IACA,sBAAA;IACA,uBAAA;IACA,mBAAA;IACA,mBAAA;EC1DV;ED6DM;IACI,eAAA;EC3DV;ED8DM;IACI,iBAAA;EC5DV;ED+DM;IACI,iBAAA;EC7DV;EDgEM;IACI,gBAAA;IACA,WAAA;EC9DV;EDiEM;IACI,SAAA;EC/DV;EDkEM;IACI,UAAA;EChEV;EDmEM;IACI,WAAA;ECjEV;EDoEM;;IAEI,aAAA;EClEV;AACF;ADsEA;EACI;IACI,eAAA;IACA,aAAA;IACA,8BAAA;IACA,mBAAA;IACA,sBAAA;ECpEN;EDsEM;IACI,mBAAA;ECpEV;EDwEE;IACI,iBAAA;ECtEN;EDwEM;IACI,aAAA;IACA,sBAAA;IACA,uBAAA;IACA,mBAAA;IACA,mBAAA;ECtEV;EDyEM;IACI,eAAA;ECvEV;ED0EM;IACI,iBAAA;ECxEV;ED2EM;IACI,iBAAA;ECzEV;ED4EM;IACI,gBAAA;IACA,WAAA;EC1EV;ED6EM;IACI,SAAA;EC3EV;ED8EM;IACI,UAAA;EC5EV;ED+EM;IACI,WAAA;EC7EV;EDgFM;;IAEI,aAAA;EC9EV;AACF;ADmFA;EACI;IACI,eAAA;IACA,aAAA;IACA,8BAAA;IACA,mBAAA;IACA,sBAAA;ECjFN;EDmFM;IACI,mBAAA;ECjFV;EDoFE;IACI,iBAAA;IACA,kBAAA;IACA,YAAA;EClFN;EDmFM;IACI,cAAA;ECjFV;EDmFM;IACI,YAAA;IACA,UAAA;ECjFV;EDmFM;IACI,6BAAA;IACA,eAAA;ECjFV;EDmFM;IACI,eAAA;IACA,6BAAA;ECjFV;EDmFM;IACI,6BAAA;IACA,cAAA;ECjFV;AACF;ADwFI;EACI,aAAA;EACA,kBAAA;EACA,yBAAA;ACtFR","file":"/style.css"} -------------------------------------------------------------------------------- /css/style.scss: -------------------------------------------------------------------------------- 1 | @import url('https://fonts.googleapis.com/css2?family=Raleway:wght@200;300;400;500;600;700;800;900&family=Rambla:wght@400;700&display=swap'); 2 | 3 | // Reset 4 | a { 5 | text-decoration: none; 6 | color: white !important; 7 | } 8 | 9 | p, 10 | h1, 11 | h2, 12 | h3, 13 | h4, 14 | h5, 15 | h6 { 16 | margin: 0; 17 | padding: 0; 18 | } 19 | 20 | ul, 21 | li { 22 | margin: 0; 23 | padding: 0; 24 | list-style: none; 25 | } 26 | 27 | img { 28 | max-width: 100%; 29 | } 30 | 31 | body { 32 | background-color: #272727; 33 | color: #fff; 34 | font-family: rambla; 35 | font-size: 16px; 36 | overflow: auto; 37 | } 38 | 39 | .alert .alert-black { 40 | z-index: 999; 41 | } 42 | 43 | // Unlock Lock css 44 | .hide { 45 | visibility: hidden; 46 | } 47 | 48 | .lock { 49 | z-index: 9999; 50 | position: fixed; 51 | bottom: 20px; 52 | left: 50px; 53 | cursor: pointer !important; 54 | } 55 | 56 | // box-shadow: rgb(194, 202, 214) 0px 0.2em, rgb(194, 202, 214) 0px -0.2em, rgb(194, 202, 214) 0.2em 0px, rgb(194, 202, 214) -0.2em 0px; 57 | 58 | .lockUnlock { 59 | z-index: 99999; 60 | width: 100vw; 61 | height: 100vh; 62 | position: fixed; 63 | display: flex; 64 | align-items: center; 65 | background: linear-gradient(0deg, rgba(30, 255, 0, 0.3), rgba(17, 16, 17, 0.3)), url(assets/images/wallpaper2you_205177.gif); 66 | background-size: cover; 67 | opacity: 1; 68 | 69 | .unlockContent { 70 | justify-content: center; 71 | color: #fff; 72 | width: 400px; 73 | 74 | input, 75 | button { 76 | width: 100%; 77 | } 78 | 79 | input { 80 | padding: 10px 20px; 81 | border: 2px solid black; 82 | border-radius: 10px; 83 | outline: none; 84 | color: #272727; 85 | } 86 | 87 | button { 88 | color: white; 89 | border: none; 90 | outline: none; 91 | background: #000; 92 | padding: 10px 0; 93 | border-radius: 10px; 94 | border: 1px solid #fff; 95 | transition: background-color 400ms cubic-bezier(0.25, 0.46, 0.45, 0.94); 96 | 97 | &:hover { 98 | color: #000; 99 | background-color: #fff; 100 | border-color: #000; 101 | } 102 | } 103 | } 104 | } 105 | 106 | 107 | 108 | .header-section { 109 | background-color: #000; 110 | box-shadow: 0 1px 10px 4px #424242; 111 | } 112 | 113 | .header { 114 | padding: 15px 0; 115 | display: flex; 116 | justify-content: space-between; 117 | align-items: center; 118 | 119 | a { 120 | // background-color: #000; 121 | border-radius: 5px; 122 | transition: background 1s ease-in-out; 123 | 124 | .logo_style { 125 | box-sizing: border-box; 126 | border-radius: 5px; 127 | border: 1px solid #fff; 128 | font-size: 1.5rem; 129 | 130 | .logoDevv { 131 | background-color: #fff; 132 | padding: 4px 10px; 133 | color: #000; 134 | border-radius: 5px; 135 | margin-left: -2px; 136 | } 137 | 138 | .logoSakib { 139 | padding: 4px 10px 4px 15px; 140 | font-size: 1.5rem; 141 | border-radius: 3px; 142 | margin-left: -13px; 143 | } 144 | } 145 | 146 | &:hover { 147 | .logoDevv { 148 | box-sizing: border-box; 149 | -webkit-box-sizing: border-box; 150 | background: #000; 151 | color: #fff; 152 | transition: 400ms ease-in-out; 153 | } 154 | 155 | .logo_style { 156 | border-color: #000; 157 | background: #fff; 158 | transition: 400ms ease-in-out; 159 | } 160 | 161 | .logoSakib { 162 | transition: 400ms ease-in-out; 163 | 164 | color: #000; 165 | } 166 | } 167 | } 168 | 169 | .menuContainer { 170 | width: 225px; 171 | 172 | ul { 173 | display: flex; 174 | justify-content: space-between; 175 | 176 | li { 177 | a { 178 | text-transform: uppercase; 179 | } 180 | } 181 | } 182 | } 183 | } 184 | 185 | 186 | .hero-section { 187 | height: calc(100vh - 67.83px); 188 | position: relative; 189 | overflow-x: hidden; 190 | 191 | .hero-title { 192 | font-weight: bold; 193 | font-size: 120px; 194 | } 195 | 196 | .hero-subtitle { 197 | font-size: 4rem; 198 | } 199 | 200 | .hero-image { 201 | img { 202 | width: 100%; 203 | } 204 | } 205 | 206 | .fixed-img { 207 | position: absolute; 208 | width: 100px; 209 | height: auto; 210 | } 211 | 212 | .git { 213 | width: 70px; 214 | top: 50px; 215 | left: 15px; 216 | animation: fixed-img 2s linear infinite alternate; 217 | } 218 | 219 | .vue { 220 | top: 50px; 221 | width: 40px; 222 | transform: translateY(20px) rotate(50deg); 223 | left: 350px; 224 | animation: fixed-img-up-down 2s forwards infinite alternate; 225 | } 226 | 227 | .github { 228 | top: 230px; 229 | width: 40px; 230 | transform: translateY(0px); 231 | left: 250px; 232 | animation: fixed-img-up-down 2s linear infinite alternate; 233 | animation-delay: 400ms; 234 | } 235 | 236 | .bigImg, 237 | .backendImg { 238 | top: 400px; 239 | opacity: .5; 240 | width: 150px; 241 | transform: translateY(0px); 242 | left: 50%; 243 | animation: fixed-img 2s backwards infinite alternate; 244 | animation-delay: 400ms; 245 | } 246 | 247 | .backendImg { 248 | top: 420px; 249 | left: 35%; 250 | } 251 | 252 | .downArrow { 253 | position: absolute; 254 | bottom: 1rem; 255 | left: 50%; 256 | right: 50%; 257 | animation: upDown 600ms linear infinite alternate; 258 | 259 | i { 260 | font-size: 1.3rem; 261 | } 262 | } 263 | 264 | @keyframes upDown { 265 | from { 266 | transform: translateY(0px); 267 | } 268 | 269 | to { 270 | transform: translateY(10px); 271 | } 272 | } 273 | } 274 | 275 | 276 | @keyframes fixed-img { 277 | 0% { 278 | transform: translateY(0); 279 | } 280 | 281 | 100% { 282 | transform: translateY(30px); 283 | } 284 | } 285 | 286 | @keyframes fixed-img-up-down { 287 | 0% { 288 | transform: translateY(0) rotate(20deg); 289 | 290 | } 291 | 292 | 100% { 293 | transform: translateX(30px) rotate(0deg); 294 | } 295 | } 296 | 297 | .alert-dismissible { 298 | margin-bottom: -5px; 299 | } 300 | .alert-dismissible { 301 | margin-bottom: -5px; 302 | } 303 | 304 | @media (max-width: 840px) { 305 | .hero-section { 306 | margin-top: -40px; 307 | 308 | .hero-title { 309 | font-size: 5rem; 310 | } 311 | 312 | .hero-subtitle { 313 | font-size: 3rem; 314 | } 315 | 316 | .hero-tagline { 317 | font-size: .8rem; 318 | } 319 | 320 | .bigImg, 321 | .backendImg { 322 | margin-top: 40px; 323 | } 324 | 325 | .backendImg { 326 | margin-left: -60px; 327 | } 328 | 329 | } 330 | } 331 | @media (max-width: 600px) { 332 | .hero-section { 333 | margin-top: -40px; 334 | 335 | .hero-title { 336 | font-size: 4rem; 337 | } 338 | 339 | .hero-subtitle { 340 | font-size: 1.4rem; 341 | } 342 | 343 | .hero-tagline { 344 | font-size: .8rem; 345 | } 346 | } 347 | } 348 | @media (max-width: 465px) { 349 | .hero-section { 350 | .forMd { 351 | display: flex; 352 | flex-direction: column; 353 | justify-content: center; 354 | align-items: center; 355 | margin-left: -100px; 356 | } 357 | 358 | .hero-title { 359 | font-size: 4rem; 360 | } 361 | 362 | .hero-subtitle { 363 | font-size: 1.5rem; 364 | } 365 | 366 | .hero-tagline { 367 | font-size: .8rem; 368 | } 369 | 370 | .hero-image { 371 | margin-top: 40px; 372 | width: 80vw; 373 | } 374 | 375 | .git { 376 | top: 80px; 377 | } 378 | 379 | .github { 380 | top: 200px; 381 | } 382 | 383 | .vue { 384 | left: 200px; 385 | } 386 | 387 | .bigImg, 388 | .backendImg { 389 | display: none; 390 | } 391 | 392 | } 393 | } 394 | @media (max-width: 360px) { 395 | .header { 396 | padding: 15px 0; 397 | display: flex; 398 | justify-content: space-between; 399 | align-items: center; 400 | flex-direction: column; 401 | 402 | .logo_style { 403 | margin-bottom: 10px; 404 | } 405 | } 406 | 407 | .hero-section { 408 | margin-top: -60px; 409 | 410 | .forMd { 411 | display: flex; 412 | flex-direction: column; 413 | justify-content: center; 414 | align-items: center; 415 | margin-left: -100px; 416 | } 417 | 418 | .hero-title { 419 | font-size: 4rem; 420 | } 421 | 422 | .hero-subtitle { 423 | font-size: 1.5rem; 424 | } 425 | 426 | .hero-tagline { 427 | font-size: .8rem; 428 | } 429 | 430 | .hero-image { 431 | margin-top: 40px; 432 | width: 80vw; 433 | } 434 | 435 | .git { 436 | top: 80px; 437 | } 438 | 439 | .github { 440 | top: 200px; 441 | } 442 | 443 | .vue { 444 | left: 200px; 445 | } 446 | 447 | .bigImg, 448 | .backendImg { 449 | display: none; 450 | } 451 | 452 | } 453 | } 454 | 455 | @media (max-width: 275px) { 456 | .header { 457 | padding: 15px 0; 458 | display: flex; 459 | justify-content: space-between; 460 | align-items: center; 461 | flex-direction: column; 462 | 463 | .logo_style { 464 | margin-bottom: 10px; 465 | } 466 | } 467 | .hero-section { 468 | margin-top: -40px; 469 | text-align: center; 470 | width: 100vw; 471 | .forMd{ 472 | margin: 0 auto; 473 | } 474 | .col-6{ 475 | width: 100vw; 476 | padding: 0; 477 | } 478 | .hero-title { 479 | margin-left: -50px !important; 480 | font-size: 20vw; 481 | } 482 | .hero-subtitle{ 483 | font-size: 12vw; 484 | margin-left: -50px !important; 485 | } 486 | .hero-tagline{ 487 | margin-left: -50px !important; 488 | font-size: 7vw; 489 | } 490 | } 491 | 492 | 493 | } 494 | // Footer section design 495 | .footer-section{ 496 | footer{ 497 | padding: 10px; 498 | text-align: center; 499 | background-color: #414040; 500 | } 501 | } -------------------------------------------------------------------------------- /css/styles.css: -------------------------------------------------------------------------------- 1 | *{ 2 | box-sizing: border-box; 3 | margin: 0; 4 | padding: 0; 5 | } 6 | body{ 7 | display: flex; 8 | height: 100vh; 9 | flex-direction: column; 10 | background-color: #272727; 11 | } 12 | .contributions{ 13 | margin: 50px auto; 14 | padding: 0 1rem; 15 | max-width: 1100px; 16 | text-align: center; 17 | 18 | color: black; 19 | } 20 | .title{ 21 | font-size: 2.5rem; 22 | text-transform: uppercase; 23 | color: #FFFF; 24 | margin-bottom: .5rem; 25 | } 26 | .note{ 27 | font-size: 1.1rem; 28 | color: rgb(150, 150, 150); 29 | font-style: italic; 30 | 31 | 32 | } 33 | .contributors{ 34 | margin: 2rem auto; 35 | display: flex; 36 | flex-wrap: wrap; 37 | padding-top: 7rem; 38 | } 39 | .contributor{ 40 | margin: 0 1rem; 41 | min-width: 300px; 42 | flex: 1; 43 | position: relative; 44 | margin-bottom: 10rem; 45 | } 46 | .head-contributor{ 47 | width: 150px; 48 | height: 150px; 49 | position: absolute; 50 | top: -85px; 51 | left: 25%; 52 | } 53 | img{ 54 | width: 100%; 55 | height: 100%; 56 | object-fit: cover; 57 | border-radius: 50%; 58 | border: 2px solid #272727; 59 | // box-shadow: 0 10px 25px rgb(0,0,0,.25); 60 | // box-shadow: 2px 2px 10px 3px rgb(88, 127, 135); 61 | } 62 | .body-contribute{ 63 | background-color: #D9D9D9; 64 | padding-bottom: 0.4rem; 65 | // box-shadow: 2px 2px 10px 3px rgb(194, 193, 193); 66 | padding-top: 80px; 67 | border-radius: 12px; 68 | border: 1px solid rgb(0, 0, 0, 0.1); 69 | } 70 | .name{ 71 | font-size: 1.5rem; 72 | color: rgb(50,50,50); 73 | margin-bottom: 0; 74 | } 75 | 76 | .socials .github{ 77 | font-size: 1.4rem; 78 | padding: 4px 10px 10px 10px; 79 | color: black; 80 | } 81 | .socials .twitter{ 82 | font-size: 1.4rem; 83 | padding: 4px 10px 10px 10px; 84 | color: black; 85 | } 86 | .socials i:hover{ 87 | cursor: pointer; 88 | color:rgb(44, 32, 32) ; 89 | transition: .4s ease; 90 | } 91 | -------------------------------------------------------------------------------- /faq.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | FAQs 8 | 9 | 10 | 11 | 12 | 13 |
14 |

Frequently Asked Questions

15 | 16 |
17 |
18 |
19 |

What is HackerBoi website?

20 | + 21 | - 22 |
23 | 24 |
25 |

26 | It's an open-source project. 27 | By participating here,you are participating in HECKTOBERFEST 2022 28 |

29 | 30 | 31 |
32 |
33 | 34 |
35 |
36 |

How do I see HackerBoi availability?

37 | + 38 | - 39 |
40 | 41 |
42 |

43 | ---- 44 |

45 |
46 |
47 | 48 |
49 |
50 |

Why is HackerBoi so popular?

51 | + 52 | - 53 |
54 | 55 |
56 |

57 | HackerBoi is built by developers for developers, and we're proud to be home to the worlds's 58 | largest open source community. 59 |

60 |
61 |
62 |
63 |
64 | 65 | 66 | 67 | 68 | -------------------------------------------------------------------------------- /faq.js: -------------------------------------------------------------------------------- 1 | const faqHeaders = document.querySelectorAll(".faqs-container .faq-header"); 2 | 3 | faqHeaders.forEach((header, i) => { 4 | header.addEventListener("click", () => { 5 | header.nextElementSibling.classList.toggle("active"); 6 | 7 | const open = header.querySelector(".open"); 8 | const close = header.querySelector(".close"); 9 | 10 | if (header.nextElementSibling.classList.contains("active")) { 11 | open.classList.remove("active"); 12 | close.classList.add("active"); 13 | } else { 14 | open.classList.add("active"); 15 | close.classList.remove("active"); 16 | } 17 | }); 18 | }); 19 | -------------------------------------------------------------------------------- /hacker.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/devvsakib/hackerboi/6622399444ee2cbdca751d73e70f6b094f8bd955/hacker.png -------------------------------------------------------------------------------- /inbuilt-aura-portfolio-website/App.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import Header from './components/Header/header' 3 | import Nav from './components/Nav/nav' 4 | import About from './components/About/about' 5 | import Experience from './components/Experience/experience' 6 | import Services from './components/Services/services' 7 | import Portfolio from './components/Portfolio/portfolio' 8 | import Testimonial from './components/testimonial/testimonial' 9 | import Contact from './components/Contact/contact' 10 | import Footer from './components/Footer/footer' 11 | 12 | const App = () => { 13 | return ( 14 | <> 15 |
16 |