diff options
| -rw-r--r-- | src/component/MosaicBackground.astro | 4 | ||||
| -rw-r--r-- | src/component/VideoAuto.astro | 6 | ||||
| -rw-r--r-- | src/pages/legal.astro | 8 | ||||
| -rw-r--r-- | src/scss/style.scss | 21 |
4 files changed, 24 insertions, 15 deletions
diff --git a/src/component/MosaicBackground.astro b/src/component/MosaicBackground.astro index 8c38bcf..4d110d2 100644 --- a/src/component/MosaicBackground.astro +++ b/src/component/MosaicBackground.astro @@ -30,7 +30,7 @@ const { height = "400" } = Astro.props; line.appendChild(current.cloneNode(true)); currentWidth += ratio * height; } else { - console.error("is NaN", current) + console.error("is NaN", current); } } } @@ -45,5 +45,5 @@ const { height = "400" } = Astro.props; } e.replaceChildren(...newChildren); }); - }) + }); </script> diff --git a/src/component/VideoAuto.astro b/src/component/VideoAuto.astro index 38282f6..ddfe1c8 100644 --- a/src/component/VideoAuto.astro +++ b/src/component/VideoAuto.astro @@ -7,10 +7,10 @@ const { src } = Astro.props; </video> <script> - window.addEventListener('load', () => { - document.querySelectorAll('video').forEach(video => { + window.addEventListener("load", () => { + document.querySelectorAll("video").forEach((video) => { if (window.screen.width < 1000) return; video.autoplay = true; }); - }) + }); </script> diff --git a/src/pages/legal.astro b/src/pages/legal.astro index 2b41b4a..01ab8cc 100644 --- a/src/pages/legal.astro +++ b/src/pages/legal.astro @@ -42,13 +42,13 @@ import Base from "../layout/Base.astro"; <h3>3. Vie privée</h3> <p> Ce site ne collecte aucune information personnelle à part les informations purement - nécessaires aux protocoles permettant l'envoie de ce page (à votre adresse IP) en vertu de - l'Article 5(3) de la directive du 12 juillet 2002 sur la protection de la vie privée dans le - secteur des communications électroniques. + nécessaires aux protocoles permettant l'envoie de cette page (à votre adresse IP) en vertu + de l'Article 5(3) de la directive du 12 juillet 2002 sur la protection de la vie privée dans + le secteur des communications électroniques. </p> <p>Ce site est hébergé par Infomaniak Network SA, Les Acacias, Genève, Suisse.</p> <p> - Les données personnelles récoltées nécessaires sont traités par Infomaniak Network SA + Les données personnelles récoltées nécessaires sont traitées par Infomaniak Network SA conformément à leur <a href="https://www.infomaniak.com/fr/cgv/politique-de-confidentialite" target="_blank">politique de confidentialité</a diff --git a/src/scss/style.scss b/src/scss/style.scss index a3c4639..bdb052a 100644 --- a/src/scss/style.scss +++ b/src/scss/style.scss @@ -3,6 +3,11 @@ $background: hsl(15, 20%, 5%); $text: hsl(0, 0%, 100%); +$bp-large: 1200px; +$bp-mid: 1000px; // video disabled +$bp-small: 750px; +$bp-tiny: 500px; + body { font-size: 22px; background: $background; @@ -41,8 +46,9 @@ p { } ul { - list-style: disc inside; + list-style: disc outside; margin-top: -0.5rem; + margin-left: 1em; } li { @@ -154,21 +160,23 @@ section[data-scroll] .content { background-attachment: fixed; & .blur { - position: absolute; - backdrop-filter: blur(50px) brightness(0.8); - inset: 0; + backdrop-filter: blur(40px) brightness(0.7) saturate(0.8) sepia(0.2); display: flex; justify-content: center; - min-height: 100%; + width: 100%; + min-height: 100vh; } & .content { padding: 4rem; display: grid; - grid-template-columns: 1fr 1fr; + grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; justify-items: center; min-height: 75vh; gap: 4rem; + @media only screen and (max-width: $bp-large) { + grid-template-columns: 1fr; + } } & .text { display: flex; @@ -178,5 +186,6 @@ section[data-scroll] .content { } & img { box-shadow: 0 0 150px $background; + width: 100%; } } |