Random responsive improvements

V1/resources/css/components/about.css

@@ -65,7 +65,7 @@
     width: 130px;
 }
 
-@media only screen and (max-width: 1200px) {
+@media only screen and (max-width: 1800px) {
     .about-container {
         flex-direction: column;
         height: 200vh;

V1/resources/css/components/compare.css

@@ -111,3 +111,9 @@ input[type="range"]::-moz-range-thumb {
   background: none;
   cursor: pointer;
 }
+
+@media only screen and (max-width: 1200px) {
+  .projet-compare-container {
+    display: none;
+  }
+}

V1/resources/css/components/follow.css

@@ -34,6 +34,7 @@
 }
 
 .follow-sub-container {
+    position: relative;
     overflow: scroll;
     border-top: 1px solid #D4D6D8;
     border-bottom: 1px solid #D4D6D8;
@@ -87,15 +88,15 @@
 }
 
 .follow-sub-background {
-    position: relative;
+    position: absolute;
     background-color: #EFEFEF;
     z-index: 1;
     border-radius: 38px;
     width: 77px;
-    height: 659px;
+    height: calc(4vmin + 575px);
     display: block;
-    top: calc(-100% * 2 - 34px);
-    right: calc(83px - 100%);
+    top: 33px;
+    right: calc(4vmin - 10px);
 }
 
 @media only screen and (max-width: 1200px) {
@@ -120,4 +121,8 @@
         grid-column: 1 / 4;
         grid-row: 2;
     }
+
+    .follow-sub-background {
+        display: none;
+    }
 }

V1/resources/css/components/footer.css

@@ -112,4 +112,12 @@ body {
         display: flex;
         flex-direction: column;
     }
+
+    .footer-title h1 {
+        font-size: 7vmin;
+    }
+    
+    .footer-title h2 {
+        margin-top: 4px;
+    }
 }

V1/resources/css/components/hero.css

@@ -195,6 +195,22 @@
   }
 }
 
-@media only screen and (max-width: 800px) {
+@media only screen and (max-width: 1800px) {
+  .hero-title {
+    font-size: 13vmin;
+  }
 
+  .hero-title2 {
+    font-size: 26vmin;
+  }
+
+  .hero-decoration-text {
+    display: none;
+  }
+
+  .hero-decoration-arrow {
+    right: 45%;
+    width: 10vmin;
+    bottom: 180px;
+  }
 }

V1/resources/css/components/mobile-menu.css

@@ -7,6 +7,7 @@
     justify-content: space-between;
     position: fixed;
     z-index: 50;
+    top: 0;
 }
 
 .mobile-menu-icon:hover,
@@ -42,6 +43,10 @@
 }
 
 @media only screen and (max-width: 1200px) {
+    body {
+        padding-top: 140px;
+    }
+
     .mobile-menu-container {
         display: flex;
     }

V1/resources/css/components/projet-nav.css

@@ -8,7 +8,9 @@
 
 .projet-nav-container a {
     background-color: #222;
-    padding: 10px 25px;
+    margin: 5px;
+    padding: 10px 20px;
+    padding-left: 5px;
     border-radius: 25px;
     border: 1px solid #F8FAFC;
     color: #F8FAFC;
@@ -19,4 +21,19 @@
     display: flex;
     justify-content: center;
     align-items: center;
+}
+
+.projet-nav-container a:last-of-type {
+    text-align: right;
+    padding-right: 5px;
+    padding-left: 20px;
+}
+
+.projet-nav-container svg {
+    padding: 5px;
+}
+
+.projet-nav-disabled {
+    border: 1px solid #8d8e8f !important;
+    color: #8d8e8f !important;
 }

V1/resources/js/index.js

@@ -16,6 +16,12 @@ document.addEventListener('DOMContentLoaded', () => {
 
     if (navbar || punch || homeTitle) {
         let lastScrollY = window.scrollY;
+
+        window.addEventListener('mousemove', (event) => {
+            if (navbar && event.clientY < 100) {
+                navbar.style.top = '0';
+            }
+        });
         
         window.addEventListener('scroll', () => {
             let currentScrollY = window.scrollY;