styles : mise à jour CSS et JS

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

assets/css/src/hero.css

@@ -2,25 +2,21 @@
   --empty-space: 11.9rem;
   background-color: var(--color-beige-light);
   --padding-vertical: calc(var(--space-m) / 1.5);
-  display: grid;
-  grid-template-columns: 1.6fr 3fr;
-  column-gap: calc(var(--space-m) / 1.5);
-  height: calc(100vh - var(--empty-space));
+  /* height: calc(100vh - var(--empty-space)); */
   overflow: hidden;
 }
 
 .hero__text {
   position: relative;
+  padding: var(--padding-vertical) var(--space-m);
   display: flex;
-  flex-direction: column;
   justify-content: space-between;
-  overflow: auto;
+  align-items: flex-end;
 }
 
 .hero__text h2 {
   font-size: max(4.167vw, 3rem);
   width: 100%;
-  margin-bottom: var(--padding-vertical);
 }
 
 .hero__text h2.big {
@@ -39,14 +35,11 @@
   margin-bottom: 1rem;
 }
 
-.hero__text p:first-of-type {
-  margin-top: var(--padding-vertical);
-}
-
 .hero__link {
   font-weight: bold;
   margin-top: 0.5rem;
 }
+
 .hero__link::before {
   display: inline-block;
   content: "→";

assets/css/src/responsive.css

@@ -5,3 +5,9 @@
     row-gap: var(--padding-vertical);
   }
 }
+
+@media screen and (max-width: 800px) {
+  .hero__text {
+    display: block;
+  }
+}

assets/css/src/vanilla.css

@@ -2,7 +2,7 @@
   scroll-behavior: smooth;
 }
 
-section:not(.collapsable),
+section:not(.collapsable, .hero),
 footer {
   box-sizing: border-box;
   padding: var(--padding-vertical) var(--space-m);
@@ -10,7 +10,7 @@ footer {
 section:not(:last-child, .collapsable, .collapsable-sections) {
   border-bottom: var(--border);
 }
-.temporality-wrapper:not(:last-of-type) section.forced-border{
+.temporality-wrapper:not(:last-of-type) section.forced-border {
   border-bottom: var(--border);
 }
 

assets/js/script.js

@@ -12,10 +12,6 @@ document.addEventListener("DOMContentLoaded", () => {
     jsLinks: document.querySelectorAll(".js-link"),
   };
 
-  setTimeout(() => {
-    nodes.images = document.querySelectorAll("img");
-  }, 0);
-
   // Listeners
   nodes.burgerBtn.addEventListener("click", () => expandNav(nodes));
   nodes.closeNavBtn.addEventListener("click", () => closeNav(nodes));
@@ -24,17 +20,13 @@ document.addEventListener("DOMContentLoaded", () => {
     jsLink.addEventListener("click", () => (location.href = to));
   });
 
-  setTimeout(() => {
-    nodes.images.forEach((image) => {
-      if (image.complete) {
-        show(image);
-      } else {
-        image.addEventListener("load", () => {
-          show(image);
-        });
-      }
-    });
-  }, 50);
+  document.querySelectorAll("img").forEach((image) => {
+    if (image.complete && image.naturalWidth > 0) {
+      show(image);
+    } else {
+      image.addEventListener("load", () => show(image));
+    }
+  });
 
   // Key shortcuts
   window.addEventListener("keyup", (event) => {