là où on est - Githubissues

J'ai abandonné cette approche, après avoir fait une migration à astro v4: désormais, nous utilisons les options du composant Image de astro:assets, pour générer différentes images optimisées, et avoir un srcset.

Typiquement :

    <!-- CRT DISPLAY -->
    <!-- Tailwind css config:

        'xxs-noyoutube': '135px',
        // => @media (min-width: 135px) { ... }

        'xxs': '240px',
        // => @media (min-width: 240px) { ... }

        'xs-noyoutube': '335px', // at this exact screen size, the youtube video gallery will disappear
        // => @media (min-width: 335px) { ... }

        'xs': '360px',
        // => @media (min-width: 360px) { ... }

        'sm': '640px',
        // => @media (min-width: 640px) { ... }

        'md': '768px',
        // => @media (min-width: 768px) { ... }

        'lg': '1024px',
        // => @media (min-width: 1024px) { ... }

        'lgxl': '1220px',
        // => @media (min-width: 1220px) { ... }

        'xl': '1280px',
        // => @media (min-width: 1280px) { ... }

        'xxl': '1480px',
        // => @media (min-width: 1480px) { ... }

      [size of {arcTriomphe} image is 1197x666] 
     -->
    <Image
      src={arcTriomphe}
      widths={[240, 335, 360, 640, 768, 1024, 2000]}
      sizes={`(max-width: 240px) 200px, (max-width: 335px) 300px, (max-width: 360px) 320px, (max-width: 640px) 600px, (max-width: 768px) 720px, (max-width: 1024px) 800px, (max-width: 2000px) 900px`}
      class="rounded-[50px] filter grayscale blur-[2px] z-1 xl:max-w-[80%]"
      alt="L'Arc de Triomphe."
    />

3forges / juste-un-curieux

là où on est #40