From 240b6e322b3b91de5f768579cb382ccd75021e11 Mon Sep 17 00:00:00 2001 From: Mike Swan Date: Wed, 25 Jun 2025 10:43:34 -0400 Subject: [PATCH] Adds documentation to the Image example page on how to add variants for dark and 2x images. --- Sources/Pages/Examples/ImageExamples.swift | 13 +++++++++++++ 1 file changed, 13 insertions(+) diff --git a/Sources/Pages/Examples/ImageExamples.swift b/Sources/Pages/Examples/ImageExamples.swift index 0fa0baa..7619986 100644 --- a/Sources/Pages/Examples/ImageExamples.swift +++ b/Sources/Pages/Examples/ImageExamples.swift @@ -47,6 +47,19 @@ struct ImageExamples: StaticPage { Text(markdown: "If you're working with large images, consider using the `lazy()` modifier to have them loaded lazily.") + Text(markdown: """ + You can add image variations for things like higher density displays or dark mode with the `@2x` and `~dark` modifiers. + - `rug.jpg` - the base image + - `rug@2x.jpg` - the double sized image + - `rug~dark.jpg` - the version to use in dark mode + - `rug@2x~dark.jpg` - the double sized image for use in dark mode + """) + + Alert { + Text(markdown: "The `~dark` image will only be used if the user's system is set to dark mode. If you manually switch to a dark mode Theme the base image will still be used. Likewise, the base image will be used if the user's system is in light mode regardless of what Theme is used.") + } + .role(.info) + Text("Icons") .font(.title2) .margin(.top, .xLarge)