chore: add light/dark mode theme detection to image component example

[styfle]

This PR adds documentation for light/dark mode detection with next/image.

In the future, we could also document the picture solution once #51205 goes stable (although preloading would still be a problem).

• x-ref: https://twitter.com/victorbayas/status/1688596439704780822

[styfle]

After merging, we should double check that https://image-component.nextjs.gallery/theme deployed properly.

I set it up in #47130 to automatically deploy but its good to double check to avoid a broken link.

[leerob]

Do we want to document this or should it wait for the upcoming changes? It feels a bit strange to recommend the CSS display none change, felt like more of a hack than best practices, but maybe missing something.

[styfle]

Do we want to document this or should it wait for the upcoming changes?

If you are referring to #51205, then I think it actually ends up being a lot more code and a lot more complex then the example in this PR. That is really only needed for Art Direction.

We already know that CSS like this works because we've been using it in production for several years. So its best to document and explain how it works since this question comes up a lot.

Furthermore, most apps that use dark/light mode already have detection outside the image, especially if they allow the user to toggle between light/dark because that would be stored in a cookie. So a simple media query may not be enough, but dynamic css is sufficient for all cases.