fix: add ios startup splash coverage for modern devices

scripts/generate-icons.js

@@ -11,14 +11,43 @@ const faviconPath = path.join(__dirname, "../public/favicon.png");
 
 // Configuration des splashscreens pour différents appareils
 const splashScreens = [
-  { width: 2048, height: 2732, name: "iPad Pro 12.9" }, // iPad Pro 12.9
-  { width: 1668, height: 2388, name: "iPad Pro 11" }, // iPad Pro 11
-  { width: 1536, height: 2048, name: "iPad Mini/Air" }, // iPad Mini, Air
-  { width: 1125, height: 2436, name: "iPhone X/XS" }, // iPhone X/XS
-  { width: 1242, height: 2688, name: "iPhone XS Max" }, // iPhone XS Max
-  { width: 828, height: 1792, name: "iPhone XR" }, // iPhone XR
-  { width: 750, height: 1334, name: "iPhone 8/SE" }, // iPhone 8, SE
-  { width: 1242, height: 2208, name: "iPhone 8 Plus" }, // iPhone 8 Plus
+  // iPad (portrait + landscape)
+  { width: 2048, height: 2732, name: "iPad Pro 12.9 portrait" },
+  { width: 2732, height: 2048, name: "iPad Pro 12.9 landscape" },
+  { width: 1668, height: 2388, name: "iPad Pro 11 portrait" },
+  { width: 2388, height: 1668, name: "iPad Pro 11 landscape" },
+  { width: 1536, height: 2048, name: "iPad Mini/Air portrait" },
+  { width: 2048, height: 1536, name: "iPad Mini/Air landscape" },
+  { width: 1620, height: 2160, name: "iPad 10.2 portrait" },
+  { width: 2160, height: 1620, name: "iPad 10.2 landscape" },
+  { width: 1640, height: 2360, name: "iPad Air 10.9 portrait" },
+  { width: 2360, height: 1640, name: "iPad Air 10.9 landscape" },
+
+  // iPhone legacy
+  { width: 1125, height: 2436, name: "iPhone X/XS/11 Pro portrait" },
+  { width: 2436, height: 1125, name: "iPhone X/XS/11 Pro landscape" },
+  { width: 1242, height: 2688, name: "iPhone XS Max/11 Pro Max portrait" },
+  { width: 2688, height: 1242, name: "iPhone XS Max/11 Pro Max landscape" },
+  { width: 828, height: 1792, name: "iPhone XR/11 portrait" },
+  { width: 1792, height: 828, name: "iPhone XR/11 landscape" },
+  { width: 750, height: 1334, name: "iPhone 8/SE portrait" },
+  { width: 1334, height: 750, name: "iPhone 8/SE landscape" },
+  { width: 1242, height: 2208, name: "iPhone 8 Plus portrait" },
+  { width: 2208, height: 1242, name: "iPhone 8 Plus landscape" },
+
+  // iPhone modern (12+)
+  { width: 1170, height: 2532, name: "iPhone 12/13/14 portrait" },
+  { width: 2532, height: 1170, name: "iPhone 12/13/14 landscape" },
+  { width: 1284, height: 2778, name: "iPhone 12/13/14 Pro Max portrait" },
+  { width: 2778, height: 1284, name: "iPhone 12/13/14 Pro Max landscape" },
+  { width: 1179, height: 2556, name: "iPhone 14 Pro portrait" },
+  { width: 2556, height: 1179, name: "iPhone 14 Pro landscape" },
+  { width: 1290, height: 2796, name: "iPhone 14/15 Pro Max portrait" },
+  { width: 2796, height: 1290, name: "iPhone 14/15 Pro Max landscape" },
+  { width: 1179, height: 2556, name: "iPhone 15 portrait" },
+  { width: 2556, height: 1179, name: "iPhone 15 landscape" },
+  { width: 1170, height: 2532, name: "iPhone 16/16e portrait" },
+  { width: 2532, height: 1170, name: "iPhone 16/16e landscape" },
 ];
 
 async function generateSplashScreens() {

src/app/layout.tsx

@@ -131,41 +131,121 @@ export default async function RootLayout({ children }: { children: React.ReactNo
           href="/images/splash/splash-2048x2732.png"
           media="(device-width: 1024px) and (device-height: 1366px) and (-webkit-device-pixel-ratio: 2) and (orientation: portrait)"
         />
+        <link
+          rel="apple-touch-startup-image"
+          href="/images/splash/splash-2732x2048.png"
+          media="(device-width: 1366px) and (device-height: 1024px) and (-webkit-device-pixel-ratio: 2) and (orientation: landscape)"
+        />
         <link
           rel="apple-touch-startup-image"
           href="/images/splash/splash-1668x2388.png"
           media="(device-width: 834px) and (device-height: 1194px) and (-webkit-device-pixel-ratio: 2) and (orientation: portrait)"
         />
+        <link
+          rel="apple-touch-startup-image"
+          href="/images/splash/splash-2388x1668.png"
+          media="(device-width: 1194px) and (device-height: 834px) and (-webkit-device-pixel-ratio: 2) and (orientation: landscape)"
+        />
         <link
           rel="apple-touch-startup-image"
           href="/images/splash/splash-1536x2048.png"
           media="(device-width: 768px) and (device-height: 1024px) and (-webkit-device-pixel-ratio: 2) and (orientation: portrait)"
         />
+        <link
+          rel="apple-touch-startup-image"
+          href="/images/splash/splash-2048x1536.png"
+          media="(device-width: 1024px) and (device-height: 768px) and (-webkit-device-pixel-ratio: 2) and (orientation: landscape)"
+        />
         <link
           rel="apple-touch-startup-image"
           href="/images/splash/splash-1125x2436.png"
           media="(device-width: 375px) and (device-height: 812px) and (-webkit-device-pixel-ratio: 3) and (orientation: portrait)"
         />
+        <link
+          rel="apple-touch-startup-image"
+          href="/images/splash/splash-2436x1125.png"
+          media="(device-width: 812px) and (device-height: 375px) and (-webkit-device-pixel-ratio: 3) and (orientation: landscape)"
+        />
         <link
           rel="apple-touch-startup-image"
           href="/images/splash/splash-1242x2688.png"
           media="(device-width: 414px) and (device-height: 896px) and (-webkit-device-pixel-ratio: 3) and (orientation: portrait)"
         />
+        <link
+          rel="apple-touch-startup-image"
+          href="/images/splash/splash-2688x1242.png"
+          media="(device-width: 896px) and (device-height: 414px) and (-webkit-device-pixel-ratio: 3) and (orientation: landscape)"
+        />
         <link
           rel="apple-touch-startup-image"
           href="/images/splash/splash-828x1792.png"
           media="(device-width: 414px) and (device-height: 896px) and (-webkit-device-pixel-ratio: 2) and (orientation: portrait)"
         />
+        <link
+          rel="apple-touch-startup-image"
+          href="/images/splash/splash-1792x828.png"
+          media="(device-width: 896px) and (device-height: 414px) and (-webkit-device-pixel-ratio: 2) and (orientation: landscape)"
+        />
         <link
           rel="apple-touch-startup-image"
           href="/images/splash/splash-750x1334.png"
           media="(device-width: 375px) and (device-height: 667px) and (-webkit-device-pixel-ratio: 2) and (orientation: portrait)"
         />
+        <link
+          rel="apple-touch-startup-image"
+          href="/images/splash/splash-1334x750.png"
+          media="(device-width: 667px) and (device-height: 375px) and (-webkit-device-pixel-ratio: 2) and (orientation: landscape)"
+        />
         <link
           rel="apple-touch-startup-image"
           href="/images/splash/splash-1242x2208.png"
           media="(device-width: 414px) and (device-height: 736px) and (-webkit-device-pixel-ratio: 3) and (orientation: portrait)"
         />
+        <link
+          rel="apple-touch-startup-image"
+          href="/images/splash/splash-2208x1242.png"
+          media="(device-width: 736px) and (device-height: 414px) and (-webkit-device-pixel-ratio: 3) and (orientation: landscape)"
+        />
+        <link
+          rel="apple-touch-startup-image"
+          href="/images/splash/splash-1170x2532.png"
+          media="(device-width: 390px) and (device-height: 844px) and (-webkit-device-pixel-ratio: 3) and (orientation: portrait)"
+        />
+        <link
+          rel="apple-touch-startup-image"
+          href="/images/splash/splash-2532x1170.png"
+          media="(device-width: 844px) and (device-height: 390px) and (-webkit-device-pixel-ratio: 3) and (orientation: landscape)"
+        />
+        <link
+          rel="apple-touch-startup-image"
+          href="/images/splash/splash-1284x2778.png"
+          media="(device-width: 428px) and (device-height: 926px) and (-webkit-device-pixel-ratio: 3) and (orientation: portrait)"
+        />
+        <link
+          rel="apple-touch-startup-image"
+          href="/images/splash/splash-2778x1284.png"
+          media="(device-width: 926px) and (device-height: 428px) and (-webkit-device-pixel-ratio: 3) and (orientation: landscape)"
+        />
+        <link
+          rel="apple-touch-startup-image"
+          href="/images/splash/splash-1179x2556.png"
+          media="(device-width: 393px) and (device-height: 852px) and (-webkit-device-pixel-ratio: 3) and (orientation: portrait)"
+        />
+        <link
+          rel="apple-touch-startup-image"
+          href="/images/splash/splash-2556x1179.png"
+          media="(device-width: 852px) and (device-height: 393px) and (-webkit-device-pixel-ratio: 3) and (orientation: landscape)"
+        />
+        <link
+          rel="apple-touch-startup-image"
+          href="/images/splash/splash-1290x2796.png"
+          media="(device-width: 430px) and (device-height: 932px) and (-webkit-device-pixel-ratio: 3) and (orientation: portrait)"
+        />
+        <link
+          rel="apple-touch-startup-image"
+          href="/images/splash/splash-2796x1290.png"
+          media="(device-width: 932px) and (device-height: 430px) and (-webkit-device-pixel-ratio: 3) and (orientation: landscape)"
+        />
       </head>
       <body
         className={cn(