From f46ae78ff7753410e44394acbf2e9a5aecf8a28e Mon Sep 17 00:00:00 2001
From: Alessandro Kreslin <kalessandro14@gmail.com>
Date: Thu, 22 Aug 2024 22:26:13 -0400
Subject: [PATCH] ui issue (#105)

---
 overrides/assets/landing/home.js       | 10 +++++-----
 overrides/assets/stylesheets/extra.css |  5 -----
 2 files changed, 5 insertions(+), 10 deletions(-)

diff --git a/overrides/assets/landing/home.js b/overrides/assets/landing/home.js
index 7accde90d..796d6225d 100644
--- a/overrides/assets/landing/home.js
+++ b/overrides/assets/landing/home.js
@@ -6,12 +6,12 @@ document.addEventListener('scroll', function(event) {
     let newOpacity = (scrollTop / maxScroll);
     newOpacity = Math.max(0.25, Math.min(newOpacity, 1));
     gradient[0].style.opacity = newOpacity;
-    animateSection('.fade-in');
-    animateSection('.fade-in-2');
-    animateSection('.fade-in-3');
+    animateSection('.fade-in', 0.1); // Why use GTFS?
+    animateSection('.fade-in-2', 0.1); // Two Formats in One Standard
+    animateSection('.fade-in-3'); // Help develop the future of GTFS
 });
 
-function animateSection(querySelectorAll) {
+function animateSection(querySelectorAll, delayIncrement = 0.2) {
     const fadeInElements = document.querySelectorAll(querySelectorAll);
     const baseDelay = 0.5; // Base delay in seconds
     fadeInElements.forEach(function(element, index) {
@@ -19,7 +19,7 @@ function animateSection(querySelectorAll) {
         const windowHeight = window.innerHeight;
 
         // Calculate delay based on index
-        const delay = baseDelay * (index * 0.2);
+        const delay = baseDelay * (index * delayIncrement);
 
         // Apply the delay to the transition
         element.style.transitionDelay = `${delay}s`;
diff --git a/overrides/assets/stylesheets/extra.css b/overrides/assets/stylesheets/extra.css
index 50f2d643a..ed6231704 100644
--- a/overrides/assets/stylesheets/extra.css
+++ b/overrides/assets/stylesheets/extra.css
@@ -17,7 +17,6 @@
   --md-primary-fg-color: #ffff00;
   --md-primary-fg-color--dark: #cccc00;
   --md-secondary-fg-color: #1d64f2;
-  --md-accent-fg-color: red;
   --md-highlight-color: #c6def4;
   --md-secondary-fg-color-white: #ffffff;
   --md-secondary-fg-color-gray: #f8f8f8;
@@ -106,10 +105,6 @@
 
 /** global header end **/
 
-.md-top:hover {
-  background-color: var(--md-primary-fg-color);
-}
-
 /* h1 style */
 .md-typeset h1 {
   font-size: 180%;