From dbb53ca1ef13051ffe30cb0f52a33b8dbe06268f Mon Sep 17 00:00:00 2001 From: Vaibhav Pratap Singh Date: Sat, 16 Nov 2024 10:50:32 +0530 Subject: [PATCH 1/3] changed the colors new hero button ui elements in proper ratio better light theme --- index.html | 73 +++++- scripts.js | 136 +++++------- styles.css | 638 ++++++++++++++++++++++++++--------------------------- 3 files changed, 429 insertions(+), 418 deletions(-) diff --git a/index.html b/index.html index 4a3e857..11b5164 100644 --- a/index.html +++ b/index.html @@ -157,10 +157,77 @@

FOSS Hack Delhi-NCR

-
+ +

Our Team

-
- +
+
+ John Doe +

John Doe

+

President

+
+
+ Jane Smith +

Jane Smith

+

Vice President

+
+
+ Mike Johnson +

Mike Johnson

+

Secretary

+
+
+ Emily Brown +

Emily Brown

+

Treasurer

+
+
+
+ +
+

Our Mentors

+
+
+ Dr. Sarah Johnson +

Dr. Sarah Johnson

+

Technical Advisor

+
+
+ Prof. David Chen +

Prof. David Chen

+

Industry Mentor

+
+
+ Lisa Wong +

Lisa Wong

+

Open Source Advocate

+
+
+
+ +
+

Active Members

+
+
+ Alex Turner +

Alex Turner

+

Lead Developer

+
+
+ Maria Garcia +

Maria Garcia

+

Security Researcher

+
+
+ Tom Lee +

Tom Lee

+

UI/UX Designer

+
+
+ Sophia Chen +

Sophia Chen

+

Data Scientist

+
diff --git a/scripts.js b/scripts.js index 008c058..79fef97 100644 --- a/scripts.js +++ b/scripts.js @@ -8,117 +8,85 @@ document.addEventListener("DOMContentLoaded", () => { // Dark mode toggle darkModeToggle.addEventListener("click", () => { - body.classList.toggle("light-mode"); - const isLightMode = body.classList.contains("light-mode"); - localStorage.setItem("lightMode", isLightMode); - updateModeIcon(isLightMode); + 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); + body.classList.add("light-mode"); + updateModeIcon(true); } function updateModeIcon(isLightMode) { - const icon = darkModeToggle.querySelector("i"); - icon.className = isLightMode ? "fas fa-sun" : "fas fa-moon"; + const icon = darkModeToggle.querySelector("i"); + icon.className = isLightMode ? "fas fa-sun" : "fas fa-moon"; } // Mobile navigation toggle navToggle.addEventListener("click", () => { - navLinks.classList.toggle("active"); + 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", + anchor.addEventListener("click", function (e) { + e.preventDefault(); + document.querySelector(this.getAttribute("href")).scrollIntoView({ + behavior: "smooth", + }); }); - }); }); // 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]; + 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; } - return glitchChars[Math.floor(Math.random() * glitchChars.length)]; - }) - .join(""); - - if (iterations >= glitchText.length) { - clearInterval(interval); - mainTitle.textContent = glitchText; - } - iterations += 1 / 3; - }, 30); + iterations += 1 / 3; + }, 30); } // Join form submission - joinForm.addEventListener("submit", (e) => { - e.preventDefault(); - alert("Thanks for your interest! We'll get back to you soon."); - joinForm.reset(); - }); + if (joinForm) { + joinForm.addEventListener("submit", (e) => { + e.preventDefault(); + alert("Thanks for your interest! We'll get back to you soon."); + joinForm.reset(); + }); + } - // 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", - }, - ]; + // Intersection Observer for animations + const animateOnScroll = new IntersectionObserver((entries) => { + entries.forEach(entry => { + if (entry.isIntersecting) { + entry.target.classList.add('animate'); + } + }); + }, { threshold: 0.1 }); - // 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); + document.querySelectorAll('.project-card, .event-item, .blog-post, .tool-card, .member-card').forEach(el => { + animateOnScroll.observe(el); }); -}); - -const darkModeToggle = document.getElementById("darkModeToggle"); -const body = document.body; - -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"); -} +}); \ No newline at end of file diff --git a/styles.css b/styles.css index 6edcac8..6dbd19b 100644 --- a/styles.css +++ b/styles.css @@ -1,100 +1,111 @@ -/* FOSS Club Website - Dark Theme with All Elements */ - +/* Base theme colors - Dark mode */ :root { - --primary-color: #00ff00; + --primary-color: #00ff9d; --secondary-color: #1a1a1a; --background-color: #0a0a0a; - --text-color: #f0f0f0; + --text-color: #ffffff; --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; + --card-bg: rgba(0, 255, 157, 0.05); + --header-bg: rgba(10, 10, 10, 0.9); + --border-color: rgba(0, 255, 157, 0.2); + --hover-color: rgba(0, 255, 157, 0.1); + --card-shadow: 0 4px 20px rgba(0, 255, 157, 0.2); + } + + /* Light mode colors with better contrast */ + body.light-mode { + --primary-color: #008060; + --secondary-color: #f5f5f5; --background-color: #ffffff; - --text-color: #333333; - --accent-color: #ff00ff; - --card-bg: rgba(0, 0, 0, 0.05); - --header-bg: rgba(255, 255, 255, 0.8); -} - -body { - font-family: "Inter", monospace; + --text-color: #1a1a1a; + --accent-color: #6b00b3; + --card-bg: rgba(0, 128, 96, 0.05); + --header-bg: rgba(255, 255, 255, 0.9); + --border-color: rgba(0, 128, 96, 0.2); + --hover-color: rgba(0, 128, 96, 0.1); + --card-shadow: 0 4px 20px rgba(0, 128, 96, 0.1); + } + + body { + 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; -} - -header { + transition: background-color 0.3s, color 0.3s; + } + + /* Enhanced animations */ + @keyframes float { + 0% { transform: translateY(0px); } + 50% { transform: translateY(-10px); } + 100% { transform: translateY(0px); } + } + + @keyframes glow { + 0% { box-shadow: 0 0 5px var(--primary-color); } + 50% { box-shadow: 0 0 20px var(--primary-color); } + 100% { box-shadow: 0 0 5px var(--primary-color); } + } + + @keyframes scanline { + 0% { transform: translateY(-100%); } + 100% { transform: translateY(100%); } + } + + /* Enhanced header styles */ + header { background-color: var(--header-bg); backdrop-filter: blur(10px); position: fixed; width: 100%; z-index: 1000; - box-shadow: 0 2px 10px rgba(0, 255, 0, 0.2); -} - -nav { + border-bottom: 1px solid var(--border-color); + transition: all 0.3s ease; + } + + nav { display: flex; justify-content: space-between; align-items: center; padding: 0.5rem 5%; -} - -.logo a { + } + + .logo a { font-size: 1.2rem; font-weight: bold; color: var(--primary-color); text-decoration: none; -} - -nav ul { + } + + nav ul { display: flex; list-style: none; margin: 0; padding: 0; -} - -nav ul li { + } + + nav ul li { margin-left: 1rem; -} - -nav ul li a { + } + + nav ul li a { color: var(--text-color); text-decoration: none; font-weight: 500; - transition: color 0.3s; - position: relative; - font-size: 0.9rem; -} - -nav ul li a::after { - content: ""; - position: absolute; - width: 0; - height: 2px; - bottom: -5px; - left: 0; - background-color: var(--primary-color); - transition: width 0.3s; -} - -nav ul li a:hover::after { - width: 100%; -} - -main { - padding-top: 70px; -} - -.hero { + transition: all 0.3s ease; + font-size: 0.95rem; + padding: 0.5rem 1rem; + border-radius: 4px; + } + + nav ul li a:hover { + background-color: var(--hover-color); + transform: translateY(-2px); + } + + .hero { background: linear-gradient( 135deg, var(--secondary-color), @@ -144,339 +155,304 @@ main { font-size: 1.2rem; margin-bottom: 2rem; } - -.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-radius: 5px; - transition: - background-color 0.3s, - transform 0.3s; - box-shadow: 0 0 20px rgba(0, 255, 0, 0.5); -} - -.cta-button:hover { - background-color: var(--accent-color); - transform: scale(1.05); -} - -section { - padding: 4rem 5%; -} - -section h2 { - font-size: 2.5rem; - margin-bottom: 2rem; - text-align: center; - 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 { - 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); -} - -.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); -} - -.project-card h3, -.event-item h3, -.blog-post h3, -.tool-card h3 { + + /* Enhanced card styles */ + .project-card, .event-item, .blog-post, .tool-card { + background: var(--card-bg); + border: 1px solid var(--border-color); + border-radius: 12px; + padding: 2rem; + transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); + position: relative; + overflow: hidden; + animation: float 6s ease-in-out infinite; + } + + .project-card:hover, .event-item:hover, .blog-post:hover, .tool-card:hover { + transform: translateY(-5px) scale(1.02); + box-shadow: var(--card-shadow); + } + + .project-card h3, .event-item h3, .blog-post h3, .tool-card h3 { font-size: 1.5rem; margin-bottom: 1rem; color: var(--primary-color); -} - -.github-link, -.read-more { + } + + .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 { + } + + .github-link:hover, .read-more:hover { color: var(--accent-color); -} - -.team-grid { + } + + /* Sections */ + section { + padding: 4rem 5%; + } + + section h2 { + font-size: 2.5rem; + margin-bottom: 2rem; + text-align: center; + color: var(--primary-color); + } + + .project-grid, .event-list, .team-grid, .blog-grid, .tools-grid, .member-grid { display: grid; - grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); + grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 2rem; - margin-top: 2rem; -} - -.team-member { + } + + /* New sections for mentors and active members */ + .member-grid { + padding: 2rem 0; + } + + .member-card { + background: var(--card-bg); + border-radius: 12px; + padding: 2rem; text-align: center; -} - -.team-member img { - width: 150px; - height: 150px; - border-radius: 50%; - object-fit: cover; + border: 1px solid var(--border-color); + transition: all 0.3s ease; + } + + .member-card img { + width: 120px; + height: 120px; + border-radius: 60px; + margin-bottom: 1rem; border: 3px solid var(--primary-color); - transition: transform 0.3s; -} - -.team-member img:hover { + transition: all 0.3s ease; + } + + .member-card:hover img { transform: scale(1.1); -} - -.team-member h3 { - margin-top: 1rem; - font-size: 1.2rem; + box-shadow: 0 0 20px var(--primary-color); + } + + .member-card h3 { color: var(--primary-color); -} - -.team-member p { + margin-bottom: 0.5rem; + } + + .member-card .role { 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); + opacity: 0.8; + } + +/* Enhanced buttons */ +.cta-button, button[type="submit"] { + background: var(--primary-color); color: var(--background-color); + padding: 1rem 2rem; + border-radius: 8px; + font-weight: 600; + letter-spacing: 0.5px; 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; + transition: all 0.3s ease; + position: relative; + overflow: hidden; + font-size: 1rem; 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); + display: inline-block; + box-shadow: 0 0 15px rgba(0, 255, 157, 0.3); } -.faq-list summary { - font-weight: bold; - cursor: pointer; - color: var(--primary-color); +.cta-button:hover, button[type="submit"]:hover { + transform: translateY(-2px); + box-shadow: 0 0 30px rgba(0, 255, 157, 0.5); + background: #00cc7d; /* Slightly darker shade of the primary color */ } -.faq-list p { - margin-top: 1rem; +.cta-button::after, button[type="submit"]::after { + display: none; } - -footer { + /* Footer styles */ + footer { background-color: var(--header-bg); color: var(--text-color); padding: 2rem 5%; text-align: center; -} - -.footer-content { + } + + .footer-content { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; -} - -.social-links a { + } + + .social-links a { color: var(--primary-color); - margin: 0 0.5rem; + margin: 0 1rem; font-size: 1.5rem; - transition: color 0.3s; -} - -.social-links a:hover { + transition: all 0.3s ease; + position: relative; + display: inline-block; + } + + .social-links a:hover { + transform: translateY(-3px) scale(1.1); color: var(--accent-color); -} - -footer ul { + } + + .social-links a::after { + content: ''; + position: absolute; + width: 100%; + height: 2px; + bottom: -5px; + left: 0; + background-color: var(--primary-color); + transform: scaleX(0); + transition: transform 0.3s ease; + } + + .social-links a:hover::after { + transform: scaleX(1); + } + + footer ul { list-style: none; padding: 0; display: flex; justify-content: center; margin-top: 1rem; -} - -footer ul li { + } + + footer ul li { margin: 0 1rem; -} - -footer ul li a { + } + + footer ul li a { color: var(--text-color); text-decoration: none; transition: color 0.3s; -} - -footer ul li a:hover { + } + + footer ul li a:hover { color: var(--primary-color); -} - -#darkModeToggle { + } + + /* Dark mode toggle */ + #darkModeToggle { background: none; border: none; color: var(--text-color); font-size: 1.2rem; cursor: pointer; transition: color 0.3s; -} - -#darkModeToggle:hover { + } + + #darkModeToggle:hover { color: var(--primary-color); -} - -.nav-toggle { + } + + /* Mobile navigation */ + .nav-toggle { display: none; font-size: 1.5rem; cursor: pointer; color: var(--text-color); -} - -@media (max-width: 768px) { + } + + /* Responsive styles */ + @media (max-width: 768px) { + .hero h1 { + font-size: clamp(2rem, 4vw, 3rem); + } + + .member-grid, .project-grid, .event-list, .team-grid, .blog-grid, .tools-grid { + grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); + } + .nav-links { - display: none; - flex-direction: column; - position: absolute; - top: 70px; - left: 0; - width: 100%; - background-color: var(--header-bg); - padding: 1rem; + display: none; + flex-direction: column; + position: absolute; + top: 70px; + left: 0; + width: 100%; + background: var(--header-bg); + backdrop-filter: blur(10px); } - + .nav-links.active { - display: flex; + display: flex; } - + .nav-links li { - margin: 0.5rem 0; + margin: 0.5rem 0; } - + .nav-toggle { - display: block; - } - - .hero h1 { - font-size: 2.5rem; - } - - .hero p { - font-size: 1rem; - } - - section { - padding: 2rem 5%; + display: block; } - - .project-grid, - .event-list, - .team-grid, - .blog-grid, - .tools-grid { - grid-template-columns: 1fr; - } - + .footer-content { - flex-direction: column; + flex-direction: column; } - + .social-links { - margin-bottom: 0.4rem; + margin-bottom: 1rem; } -} + } + + /* FAQ section */ + .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 var(--border-color); + } + + .faq-list summary { + font-weight: bold; + cursor: pointer; + color: var(--primary-color); + } + + .faq-list p { + margin-top: 1rem; + } + + /* Resources section */ + .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: all 0.3s ease; + border: 1px solid var(--border-color); + } + + .resource-list li a:hover { + background-color: var(--hover-color); + transform: translateY(-3px); + } \ No newline at end of file From 388c6ebdc764a6caba789c66d6381acc07612ee6 Mon Sep 17 00:00:00 2001 From: Vaibhav Pratap Singh Date: Sat, 16 Nov 2024 11:18:38 +0530 Subject: [PATCH 2/3] added few memebrs details --- index.html | 142 +++++++++++++++++++++++++++++++++++++++++++++-------- styles.css | 5 ++ 2 files changed, 126 insertions(+), 21 deletions(-) diff --git a/index.html b/index.html index 11b5164..31a3b0c 100644 --- a/index.html +++ b/index.html @@ -159,26 +159,106 @@

FOSS Hack Delhi-NCR

-

Our Team

+

Core Team

- John Doe -

John Doe

+ Gautam Kumar +

Ms. Eirty Telang Kapoor

+

Convenor

+
+
+ Vaibhav Pratap Singh +

Vaibhav Pratap Singh

President

- Jane Smith -

Jane Smith

+ Suryansh Sharma +

Suryansh Sharma

Vice President

- Mike Johnson -

Mike Johnson

+ Sachin Singh Adhikari +

Sachin Singh Adhikari

+

Secretary

+
+
+ Ashwany Kumar Sharma +

Ashwany Kumar Sharma

Secretary

- Emily Brown -

Emily Brown

+ Riyansh Varshney +

Riyansh Varshney

+

Event Coordinator

+
+
+ Harshvardhan +

Harshvardhan

+

Event Coordinator

+
+
+ Diksha Chauhan +

Diksha Chauhan

+

Event Coordinator

+
+
+ Shresth Gupta +

Shresth Gupta

+

Event Coordinator

+
+
+ Nishchal Anurag +

Nishchal Anurag

+

PR & Outreach

+
+
+ Satyam Mishra +

Satyam Mishra

+

PR & Outreach

+
+
+ Diti Vashisht +

Diti Vashisht

+

PR & Outreach

+
+
+ Jayesh Bisht +

Jayesh Bisht

+

PR & Outreach

+
+
+ Arul S Bharadwaj +

Arul S Bharadwaj

+

Graphic Designer

+
+
+ Lovish Kukreja +

Ayush Kukreja

+

Graphic Designer

+
+
+ Tiya Jain +

Tiya Jain

+

Social Media

+
+
+ Vanya Raman +

Vanya Raman

+

Social Media

+
+
+ Srijan Ranjan +

Srijan Ranjan

+

Social Media

+
+
+ Vinay Chauhan +

Vinay Chauhan

+

Video Editor

+
+
+ Gautam Kumar +

Gautam Kumar

Treasurer

@@ -189,18 +269,28 @@

Our Mentors

Dr. Sarah Johnson -

Dr. Sarah Johnson

-

Technical Advisor

+

Inzemam ul haq

+

Senior

Prof. David Chen -

Prof. David Chen

+

Kilari teja

Industry Mentor

+
+ Prof. David Chen +

Ravpreet Maini

+

Cloud Expert

+
+
+ Lisa Wong +

Shristi Pandey

+

Researcher

+
Lisa Wong -

Lisa Wong

-

Open Source Advocate

+

Palak

+

Graphics Designer

@@ -210,23 +300,33 @@

Active Members

Alex Turner -

Alex Turner

-

Lead Developer

+

Hilal Ahmad

+

AI Guy

+
+
+ Alex Turner +

Tanmay

+

Low Level

Maria Garcia -

Maria Garcia

-

Security Researcher

+

Mayank Chaubey

+

DSA Guy

Tom Lee -

Tom Lee

+

TSR

UI/UX Designer

Sophia Chen -

Sophia Chen

-

Data Scientist

+

AK

+

Friendly Spiderman

+
+
+ Sophia Chen +

Avneesh

+

Designer

diff --git a/styles.css b/styles.css index 6dbd19b..868d944 100644 --- a/styles.css +++ b/styles.css @@ -156,6 +156,11 @@ margin-bottom: 2rem; } + +body.light-mode .hero h1 { + text-shadow: 0 0 10px rgba(0, 128, 96, 0.3); +} + /* Enhanced card styles */ .project-card, .event-item, .blog-post, .tool-card { background: var(--card-bg); From dd2b2b6fd3d83a143b6c79398f739f8487eeb661 Mon Sep 17 00:00:00 2001 From: Vaibhav Pratap Singh Date: Sun, 17 Nov 2024 11:19:51 +0530 Subject: [PATCH 3/3] . --- styles.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/styles.css b/styles.css index 868d944..e6451ca 100644 --- a/styles.css +++ b/styles.css @@ -36,7 +36,7 @@ transition: background-color 0.3s, color 0.3s; } - /* Enhanced animations */ + @keyframes float { 0% { transform: translateY(0px); } 50% { transform: translateY(-10px); }