From ddace6e76f337303b2c8475797dba3ce2471740a Mon Sep 17 00:00:00 2001 From: Vaibhav Pratap Singh Date: Tue, 1 Oct 2024 17:39:33 +0530 Subject: [PATCH] added contributing.md --- CONTRIBUTING.md | 60 ++++++ index.html | 547 ++++++++++++++++++++---------------------------- scripts.js | 163 +++++---------- styles.css | 426 ++++++++----------------------------- 4 files changed, 428 insertions(+), 768 deletions(-) create mode 100644 CONTRIBUTING.md diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md new file mode 100644 index 0000000..8f8776f --- /dev/null +++ b/CONTRIBUTING.md @@ -0,0 +1,60 @@ +# Contributing to The FOSS Club Projects + +Thank you for your interest in contributing to our open-source projects! We appreciate your help in improving the Free and Open Source Software (FOSS) community. Please follow the guidelines below to ensure a smooth contribution process. + +## How to Get Started + +### 1. Find an Issue +Check out the project repositories and find issues labeled with `hacktoberfest` or suitable tasks that align with your skills. We encourage contributors to start with beginner-friendly issues. + +### 2. Fork the Repository +Click the "Fork" button on the top-right of the repository page to make a copy of the project under your GitHub account. + +### 3. Clone Your Fork +Clone the repository to your local machine for development: + +```bash +git clone https://github.com/your-username/repository-name.git +``` + +### 4. Create a Branch +Work on your changes in a new branch to keep your main branch clean: + +```bash +git checkout -b your-branch-name +``` + +### 5. Make Your Changes +Implement your changes based on the issue you are addressing. Ensure your code follows the project’s coding standards. + +### 6. Test Your Changes +Make sure your changes work by running the project tests (if available). Provide additional tests if required. + +### 7. Commit Your Changes +Once you’re happy with your work, commit your changes: + +```bash +git add . +git commit -m "Description of your changes" +``` + +### 8. Push Your Changes +Push your changes to your forked repository: + +```bash +git push origin your-branch-name +``` + +### 9. Open a Pull Request +Submit a pull request (PR) to the original repository for review. Make sure to describe the changes you’ve made and link it to the relevant issue. + +### 10. Wait for Review +The maintainers will review your contribution. If there are any changes requested, please address them promptly. Once approved, your contribution will be merged! + +## Code of Conduct +We follow the [Code of Conduct](link-to-code-of-conduct) to ensure a positive environment for our community. Please be respectful and follow the guidelines. + +## Hacktoberfest Contributions +If you are contributing for Hacktoberfest, make sure the repository is opted-in, and issues are tagged with `hacktoberfest`. Contributions must follow the [Hacktoberfest guidelines](https://hacktoberfest.digitalocean.com/). + +Thank you for contributing! \ No newline at end of file diff --git a/index.html b/index.html index 9cd4793..13643e7 100644 --- a/index.html +++ b/index.html @@ -1,335 +1,252 @@ - + - - - - The FOSS Club - - - - - -
- -
+ + + + The FOSS Club - Open Source Enthusiasts + + + + + +
+ +
-
-
-

Welcome to the FOSS Club!

-

- Learn, build, and collaborate with fellow open-source - enthusiasts. -

- Join Now -
+
+
+

Welcome to the FOSS Club!

+

Learn, build, and collaborate with fellow open-source enthusiasts.

+ Join Now +
-
-

About Us

-

- The FOSS Club is a student community-based group in the - Delhi Technical Campus for enthusiasts focused on - contributing to Free and Open Source Software and mentoring - students to achieve excellence in various fields of Computer - Science. -

-

Core Pillars

-
    -
  • - Open Source: The FOSS Club focuses on open-source - technologies and tools. -
    • -
  • - Cyber Security: The FOSS Club also focuses on ethical - hacking and cyber security. -
    • -
  • - Decentralization: The FOSS Club will focus on - self-hosted and decentralization technologies and tools. -
    • -
-
+
+

About Us

+

The FOSS Club is a student community-based group in the Delhi Technical Campus for enthusiasts focused on contributing to Free and Open Source Software and mentoring students to achieve excellence in various fields of Computer Science.

+
+
+ +

Open Source

+

The FOSS Club focuses on open-source technologies and tools.

+
+
+ +

Cyber Security

+

The FOSS Club also focuses on ethical hacking and cyber security.

+
+
+ +

Decentralization

+

The FOSS Club will focus on self-hosted and decentralization technologies and tools.

+
+
+
-
-

Our Projects

-
-
-

Passvyn

-

- A Python-based secured password manager which is - highly secured using SHA256. -

- View on GitHub -
-
-

LinkFree

-

A free and open source alternative to LinkTree.

- View on GitHub -
-
-

face-recognition

-

- Face Recognition code which detects faces on live - cameras implemented using OpenCV and DLib in Python - and C++. -

- View on GitHub -
+
+

Our Projects

+
+
+

Passvyn

+

A Python-based secured password manager which is highly secured using SHA256.

+ View on GitHub
-
+
+

LinkFree

+

A free and open source alternative to LinkTree.

+ View on GitHub +
+
+

face-recognition

+

Face Recognition code which detects faces on live cameras implemented using OpenCV and DLib in Python and C++.

+ View on GitHub +
+
+
-
-

Events

-
-
-

Introduction to FOSS

-

Date: December 24, 2023

-

- Conducted an event on the basic fundamentals of FOSS - and educated students about the key terms used in - the world of open source. -

-
-
-

Introduction to Linux and CLI

-

Date: February 14, 2024

-

- Get hands-on experience installing and configuring - Linux distributions and basics of Command Line - Interface. -

-
-
-

How_To?

-

Date: April 12, 2024

-

- A conference featuring talks, workshops, and - networking opportunities. -

-
-
-

FOSS Hack Delhi-NCR

-

Date: July 27, 2024

-

- A national level FOSS hackathon conducted by the - FOSS Club at the college for the whole Delhi NCR. - FOSS Hack is a hackathon conducted by FOSS United - each year. -

-
+
+

Events

+
+
+

Introduction to FOSS

+

Date: December 24, 2023

+

Conducted an event on the basic fundamentals of FOSS and educated students about the key terms used in the world of open source.

+
+
+

Introduction to Linux and CLI

+

Date: February 14, 2024

+

Get hands-on experience installing and configuring Linux distributions and basics of Command Line Interface.

-
+
+

How_To?

+

Date: April 12, 2024

+

A conference featuring talks, workshops, and networking opportunities.

+
+
+

FOSS Hack Delhi-NCR

+

Date: July 27, 2024

+

A national level FOSS hackathon conducted by the FOSS Club at the college for the whole Delhi NCR. FOSS Hack is a hackathon conducted by FOSS United each year.

+
+
+
-
-

Our Team

-
- +
+

Our Team

+
+
+ Vaibhav Pratap Singh +

Vaibhav Pratap Singh

+

President

-
+
+ Suryansh Sharma +

Suryansh Sharma

+

Vice President

+
+
+ Nikhil Kumar +

Nikhil Kumar

+

PR

+
+
+ Gautam +

Gautam

+

Treasurer

+
+
+ Sachin Singh Adhikari +

Sachin Singh Adhikari

+

Secretary

+
+
+
-
-

Latest Blog Posts

-
-
-

Introduction to Open Source

-

- Learn about the basics of open source software and - its impact on the tech industry. -

- Read More -
-
-

FOSS Alternatives to Popular Software

-

- Discover free and open source alternatives to - commonly used proprietary software. -

- Read More -
-
-

Contributing to Open Source Projects

-

- A beginner's guide to making your first contribution - to an open source project. -

- Read More -
+
+

Latest Blog Posts

+
+
+

Introduction to Open Source

+

Learn about the basics of open source software and its impact on the tech industry.

+ Read More +
+
+

FOSS Alternatives to Popular Software

+

Discover free and open source alternatives to commonly used proprietary software.

+ Read More
-
+
+

Contributing to Open Source Projects

+

A beginner's guide to making your first contribution to an open source project.

+ Read More +
+
+
-
-

Open Source Tools We Love

-
-
- -

Git

-

Distributed version control system

-
-
- -

Linux

-

Open source operating system

-
-
- -

VS Code

-

Free source-code editor

-
-
- -

PostgreSQL

-

Open source relational database

-
+
+

Open Source Tools We Love

+
+
+ +

Git

+

Distributed version control system

-
+
+ +

Linux

+

Open source operating system

+
+
+ +

VS Code

+

Free source-code editor

+
+
+ +

PostgreSQL

+

Open source relational database

+
+
+
-
-

Join the FOSS Club

-
- - - - -
-
+
+

Join the FOSS Club

+
+ + + + +
+
-
-

Resources

- -
+
+

Resources

+ +
-
-

Frequently Asked Questions

-
-
- What is FOSS? -

- FOSS stands for Free and Open Source Software. It - refers to software that is freely available for use, - modification, and distribution. -

-
-
- How can I join the FOSS Club? -

- You can join our club by filling out the application - form in the "Join" section of our website. We - welcome students of all skill levels who are - interested in open source software. -

-
-
- - Do I need programming experience to join? - -

- No, you don't need prior programming experience to - join. We welcome members with diverse backgrounds - and skill levels. Our club provides learning - opportunities for beginners as well as advanced - developers. -

-
-
- How often does the club meet? -

- We typically have weekly meetings during the - academic year. The schedule is posted on our website - and social media channels at the beginning of each - semester. -

-
-
-
-
+
+

Frequently Asked Questions

+
+
+ What is FOSS? +

FOSS stands for Free and Open Source Software. It refers to software that is freely available for use, modification, and distribution.

+
+
+ How can I join the FOSS Club? +

You can join our club by filling out the application form in the "Join" section of our website. We welcome students of all skill levels who are interested in open source software.

+
+
+ Do I need programming experience to join? +

No, you don't need prior programming experience to join. We welcome members with diverse backgrounds and skill levels. Our club provides learning opportunities for beginners as well as advanced developers.

+
+
+ How often does the club meet? +

We typically have weekly meetings during the academic year. The schedule is posted on our website and social media channels at the beginning of each semester.

+
+
+
+
- - - + + diff --git a/scripts.js b/scripts.js index 008c058..962eed1 100644 --- a/scripts.js +++ b/scripts.js @@ -1,124 +1,59 @@ -document.addEventListener("DOMContentLoaded", () => { - const darkModeToggle = document.getElementById("darkModeToggle"); - const body = document.body; - const navToggle = document.querySelector(".nav-toggle"); - const navLinks = document.querySelector(".nav-links"); - const mainTitle = document.getElementById("mainTitle"); - const joinForm = document.getElementById("join-form"); - - // Dark mode toggle - darkModeToggle.addEventListener("click", () => { - body.classList.toggle("light-mode"); - const isLightMode = body.classList.contains("light-mode"); - localStorage.setItem("lightMode", isLightMode); - updateModeIcon(isLightMode); - }); - - const savedLightMode = localStorage.getItem("lightMode"); - if (savedLightMode === "true") { - body.classList.add("light-mode"); - updateModeIcon(true); - } - - function updateModeIcon(isLightMode) { - const icon = darkModeToggle.querySelector("i"); - icon.className = isLightMode ? "fas fa-sun" : "fas fa-moon"; - } - - // Mobile navigation toggle - navToggle.addEventListener("click", () => { - navLinks.classList.toggle("active"); - }); - - // Smooth scrolling - document.querySelectorAll('a[href^="#"]').forEach((anchor) => { - anchor.addEventListener("click", function (e) { - e.preventDefault(); - document.querySelector(this.getAttribute("href")).scrollIntoView({ - behavior: "smooth", - }); +document.addEventListener('DOMContentLoaded', function () { + const darkModeToggle = document.getElementById('darkModeToggle'); + const body = document.body; + + // Dark mode toggle + darkModeToggle.addEventListener('click', function () { + body.classList.toggle('light-mode'); + if (body.classList.contains('light-mode')) { + darkModeToggle.innerHTML = ''; + } else { + darkModeToggle.innerHTML = ''; + } }); - }); - - // Glitch effect on main title - mainTitle.addEventListener("click", glitchEffect); - mainTitle.addEventListener("mouseover", glitchEffect); - - function glitchEffect() { - const glitchText = "Welcome to the FOSS Club!"; - const glitchChars = "!<>-_\\/[]{}—=+*^?#________"; - let iterations = 0; - - const interval = setInterval(() => { - mainTitle.textContent = glitchText - .split("") - .map((char, index) => { - if (index < iterations) { - return glitchText[index]; - } - return glitchChars[Math.floor(Math.random() * glitchChars.length)]; - }) - .join(""); - if (iterations >= glitchText.length) { - clearInterval(interval); - mainTitle.textContent = glitchText; - } + // Smooth navbar toggle for mobile + const navToggle = document.querySelector('.nav-toggle'); + const navLinks = document.querySelector('.nav-links'); + + navToggle.addEventListener('click', function () { + navLinks.classList.toggle('active'); + navLinks.style.transition = 'transform 0.4s ease'; + }); - iterations += 1 / 3; - }, 30); - } + // Scroll effects for elements + const fadeInElements = document.querySelectorAll('.fade-in'); + const observer = new IntersectionObserver(entries => { + entries.forEach(entry => { + if (entry.isIntersecting) { + entry.target.classList.add('visible'); + } + }); + }); - // Join form submission - joinForm.addEventListener("submit", (e) => { - e.preventDefault(); - alert("Thanks for your interest! We'll get back to you soon."); - joinForm.reset(); - }); + fadeInElements.forEach(element => { + observer.observe(element); + }); - // Team members data - const teamMembers = [ - { name: "John Doe", role: "President", image: "/api/placeholder/150/150" }, - { - name: "Jane Smith", - role: "Vice President", - image: "/api/placeholder/150/150", - }, - { - name: "Mike Johnson", - role: "Secretary", - image: "/api/placeholder/150/150", - }, - { - name: "Emily Brown", - role: "Treasurer", - image: "/api/placeholder/150/150", - }, - ]; + // Button hover animation + document.querySelectorAll('.cta-button').forEach(button => { + button.addEventListener('mouseover', function () { + button.style.transform = 'scale(1.05)'; + }); - // Populate team members - const teamGrid = document.querySelector(".team-grid"); - teamMembers.forEach((member) => { - const memberElement = document.createElement("div"); - memberElement.className = "team-member"; - memberElement.innerHTML = ` - ${member.name} -

${member.name}

-

${member.role}

- `; - teamGrid.appendChild(memberElement); - }); + button.addEventListener('mouseout', function () { + button.style.transform = 'scale(1)'; + }); + }); }); -const darkModeToggle = document.getElementById("darkModeToggle"); -const body = document.body; +// Glitch effect for the title +const glitchTitle = document.querySelector('#mainTitle'); -darkModeToggle.addEventListener("click", () => { - body.classList.toggle("dark-mode"); - localStorage.setItem("darkMode", body.classList.contains("dark-mode")); -}); - -// Check for saved dark mode preference -if (localStorage.getItem("darkMode") === "true") { - body.classList.add("dark-mode"); +function glitch() { + glitchTitle.classList.add('glitch'); + setTimeout(() => glitchTitle.classList.remove('glitch'), 500); } + +setInterval(glitch, 3000); // Trigger the glitch effect every 3 seconds + diff --git a/styles.css b/styles.css index 694e409..5436b8d 100644 --- a/styles.css +++ b/styles.css @@ -1,44 +1,61 @@ -/* FOSS Club Website - Dark Theme with All Elements */ - +/* Theme Variables */ :root { - --primary-color: #00ff00; - --secondary-color: #1a1a1a; - --background-color: #0a0a0a; - --text-color: #f0f0f0; - --accent-color: #ff00ff; - --card-bg: rgba(255, 255, 255, 0.05); - --header-bg: rgba(0, 0, 0, 0.8); -} - -body.light-mode { - --primary-color: #008000; - --secondary-color: #e5e5e5; + --primary-color: #3498db; + --secondary-color: #f1f1f1; --background-color: #ffffff; --text-color: #333333; - --accent-color: #ff00ff; + --accent-color: #007bff; --card-bg: rgba(0, 0, 0, 0.05); - --header-bg: rgba(255, 255, 255, 0.8); + --header-bg: rgba(0, 0, 0, 0.8); } +/* Global Styles */ body { - font-family: "Inter", monospace; + font-family: "Inter", sans-serif; line-height: 1.6; background-color: var(--background-color); color: var(--text-color); margin: 0; padding: 0; transition: - background-color 0.3s, - color 0.3s; + background-color 0.4s ease, + color 0.4s ease; } +a { + text-decoration: none; + color: inherit; + transition: color 0.3s ease-in-out; +} + +ul { + list-style: none; + padding: 0; + margin: 0; +} + +h1, +h2, +h3, +p { + margin: 0 0 1rem 0; +} + +/* Header Styles */ header { background-color: var(--header-bg); - backdrop-filter: blur(10px); + backdrop-filter: blur(12px); position: fixed; width: 100%; z-index: 1000; - box-shadow: 0 2px 10px rgba(0, 255, 0, 0.2); + box-shadow: 0 2px 12px rgba(0, 0, 0, 0.3); + transition: + background-color 0.3s ease, + box-shadow 0.3s ease; +} + +header:hover { + box-shadow: 0 4px 16px rgba(0, 0, 0, 0.4); } nav { @@ -49,51 +66,44 @@ nav { } .logo a { - font-size: 1.2rem; + font-size: 1.4rem; font-weight: bold; color: var(--primary-color); - text-decoration: none; } -nav ul { +.nav-links { display: flex; - list-style: none; - margin: 0; - padding: 0; + align-items: center; } -nav ul li { - margin-left: 1rem; +.nav-links li { + margin-left: 1.5rem; } -nav ul li a { - color: var(--text-color); - text-decoration: none; +.nav-links a { font-weight: 500; - transition: color 0.3s; + font-size: 1rem; + color: var(--text-color); position: relative; - font-size: 0.9rem; + transition: color 0.3s ease; } -nav ul li a::after { +.nav-links a::after { content: ""; position: absolute; width: 0; - height: 2px; + height: 3px; bottom: -5px; left: 0; background-color: var(--primary-color); - transition: width 0.3s; + transition: width 0.4s ease; } -nav ul li a:hover::after { +.nav-links a:hover::after { width: 100%; } -main { - padding-top: 70px; -} - +/* Hero Section */ .hero { background: linear-gradient( 135deg, @@ -107,36 +117,11 @@ main { overflow: hidden; } -.hero::before { - content: ""; - position: absolute; - top: -50%; - left: -50%; - width: 200%; - height: 200%; - background: repeating-linear-gradient( - 0deg, - transparent, - transparent 20px, - rgba(0, 255, 0, 0.05) 20px, - rgba(0, 255, 0, 0.05) 40px - ); - animation: scan 10s linear infinite; -} - -@keyframes scan { - 0% { - transform: translateY(0); - } - 100% { - transform: translateY(50%); - } -} - .hero h1 { font-size: 3.5rem; - margin-bottom: 1rem; - text-shadow: 0 0 10px rgba(0, 255, 0, 0.5); + margin-bottom: 1.5rem; + text-shadow: 0 0 10px rgba(0, 0, 0, 0.5); + animation: fadeInUp 1s ease; } .hero p { @@ -147,24 +132,23 @@ main { .cta-button { background-color: var(--primary-color); color: var(--background-color); - border: none; padding: 0.8rem 1.6rem; font-size: 1rem; - font-weight: bold; - cursor: pointer; - text-decoration: none; + border: none; border-radius: 5px; + font-weight: bold; + box-shadow: 0 0 20px rgba(0, 0, 0, 0.5); transition: - background-color 0.3s, - transform 0.3s; - box-shadow: 0 0 20px rgba(0, 255, 0, 0.5); + transform 0.3s ease, + background-color 0.3s ease; } .cta-button:hover { background-color: var(--accent-color); - transform: scale(1.05); + transform: scale(1.08); } +/* Section Styles */ section { padding: 4rem 5%; } @@ -176,306 +160,70 @@ section h2 { color: var(--primary-color); } -.project-grid, -.event-list, -.team-grid, -.blog-grid, -.tools-grid { - display: grid; - grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); - gap: 2rem; -} - -.project-card, -.event-item, -.blog-post, -.tool-card { +/* Card Styles */ +.card { background-color: var(--card-bg); border-radius: 10px; padding: 1.5rem; - box-shadow: 0 4px 6px rgba(0, 255, 0, 0.1); - transition: - transform 0.3s, - box-shadow 0.3s; - border: 1px solid rgba(0, 255, 0, 0.2); + border: 1px solid rgba(0, 0, 0, 0.2); + box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); + transition: box-shadow 0.3s ease; } -.project-card:hover, -.event-item:hover, -.blog-post:hover, -.tool-card:hover { - transform: translateY(-5px); - box-shadow: 0 6px 12px rgba(0, 255, 0, 0.2); +.card:hover { + box-shadow: 0 6px 12px rgba(0, 0, 0, 0.2); } -.project-card h3, -.event-item h3, -.blog-post h3, -.tool-card h3 { - font-size: 1.5rem; +.card h3 { + font-size: 1.8rem; margin-bottom: 1rem; color: var(--primary-color); } -.github-link, -.read-more { - display: inline-block; - margin-top: 1rem; - color: var(--primary-color); - text-decoration: none; - font-weight: 500; - transition: color 0.3s; -} - -.github-link:hover, -.read-more:hover { - color: var(--accent-color); -} - -.team-grid { - display: grid; - grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); - gap: 2rem; - margin-top: 2rem; -} - -.team-member { - text-align: center; -} - -.team-member img { - width: 150px; - height: 150px; - border-radius: 50%; - object-fit: cover; - border: 3px solid var(--primary-color); - transition: transform 0.3s; -} - -.team-member img:hover { - transform: scale(1.1); -} - -.team-member h3 { - margin-top: 1rem; +.card p { font-size: 1.2rem; - color: var(--primary-color); -} - -.team-member p { - font-size: 0.9rem; - color: var(--text-color); -} - -#join-form { - max-width: 500px; - margin: 0 auto; -} - -#join-form input, -#join-form textarea { - width: 100%; - padding: 0.8rem; - margin-bottom: 1rem; - background-color: rgba(255, 255, 255, 0.1); - border: 1px solid rgba(0, 255, 0, 0.2); - border-radius: 5px; - color: var(--text-color); - font-family: "Inter", monospace; -} - -#join-form input:focus, -#join-form textarea:focus { - outline: none; - border-color: var(--primary-color); - box-shadow: 0 0 10px rgba(0, 255, 0, 0.3); -} - -#join-form button { - background-color: var(--primary-color); - color: var(--background-color); - border: none; - padding: 0.8rem 1.6rem; - font-size: 1rem; - font-weight: bold; - cursor: pointer; - border-radius: 5px; - transition: - background-color 0.3s, - transform 0.3s; - font-family: "Inter", monospace; -} - -#join-form button:hover { - background-color: var(--accent-color); - transform: scale(1.05); -} - -.resource-list { - list-style: none; - padding: 0; - display: grid; - grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); - gap: 1rem; -} - -.resource-list li a { - display: block; - background-color: var(--card-bg); - padding: 1rem; - border-radius: 5px; - text-decoration: none; - color: var(--text-color); - transition: - background-color 0.3s, - transform 0.3s; - border: 1px solid rgba(0, 255, 0, 0.2); -} - -.resource-list li a:hover { - background-color: rgba(0, 255, 0, 0.1); - transform: translateY(-3px); -} - -.faq-list { - max-width: 800px; - margin: 0 auto; -} - -.faq-list details { - background-color: var(--card-bg); - margin-bottom: 1rem; - padding: 1rem; - border-radius: 5px; - border: 1px solid rgba(0, 255, 0, 0.2); -} - -.faq-list summary { - font-weight: bold; - cursor: pointer; - color: var(--primary-color); -} - -.faq-list p { - margin-top: 1rem; + margin-bottom: 2rem; } +/* Footer Styles */ footer { background-color: var(--header-bg); - color: var(--text-color); padding: 2rem 5%; text-align: center; -} - -.footer-content { - display: flex; - justify-content: space-between; - align-items: center; - flex-wrap: wrap; -} - -.social-links a { - color: var(--primary-color); - margin: 0 0.5rem; - font-size: 1.5rem; - transition: color 0.3s; -} - -.social-links a:hover { - color: var(--accent-color); -} - -footer ul { - list-style: none; - padding: 0; - display: flex; - justify-content: center; - margin-top: 1rem; -} - -footer ul li { - margin: 0 1rem; -} - -footer ul li a { color: var(--text-color); - text-decoration: none; - transition: color 0.3s; } -footer ul li a:hover { +footer a { color: var(--primary-color); + transition: color 0.3s ease; } -#darkModeToggle { - background: none; - border: none; - color: var(--text-color); - font-size: 1.2rem; - cursor: pointer; - transition: color 0.3s; -} - -#darkModeToggle:hover { - color: var(--primary-color); -} - -.nav-toggle { - display: none; - font-size: 1.5rem; - cursor: pointer; - color: var(--text-color); +footer a:hover { + color: var(--accent-color); } +/* Media Queries */ @media (max-width: 768px) { .nav-links { - display: none; flex-direction: column; - position: absolute; - top: 70px; - left: 0; - width: 100%; - background-color: var(--header-bg); - padding: 1rem; - } - - .nav-links.active { - display: flex; } - .nav-links li { - margin: 0.5rem 0; + margin-left: 0; + margin-bottom: 1rem; } - - .nav-toggle { - display: block; + .hero { + padding: 4rem 2rem; } - .hero h1 { font-size: 2.5rem; } - - .hero p { - font-size: 1rem; + .cta-button { + padding: 0.6rem 1.2rem; } - section { padding: 2rem 5%; } - - .project-grid, - .event-list, - .team-grid, - .blog-grid, - .tools-grid { - grid-template-columns: 1fr; - } - - .footer-content { - flex-direction: column; - } - - .social-links { - margin-bottom: 0.4rem; + .card { + padding: 1rem; } }