New style for Leggero theme: Stringendo Dark

[eagleman]

Hello,
today, using Claude.ai, I have created a dark version for Stringendo style.
Unfortunately I have some problems to add the dark theme to the admin panel.
Take a look and tell me what do you think.

[fraenkiman]

Hi Eagleman,

I've made the necessary changes in the relevant sections. You should now be able to see and select the style in the admin area.

stringendo_dark.zip

(90.95 KiB) Downloaded 62 times

The style has low contrast in some places, making it difficult to read. This could negatively impact search engine rankings.

Best regards,
Frank

[fraenkiman]

Hi eagleman,

I actually have a suggestion for you—or rather, for the AI:

Depending on the browser or system color scheme, the color palette should be light or dark.

This could be achieved using a media query:

Code: Select all

:root {
    /* Let form controls follow the active browser/system palette */
    color-scheme: light dark;
    ...
}
@media (prefers-color-scheme: dark) {
...
}

This way, the visitor would get the best of both worlds (day, night), depending on the device’s settings.
Just a suggestion:

prefers-color-scheme_dark.png (187.46 KiB) Viewed 1018 times

I enabled this on my blog. Now, visitors using a light theme see the original Stringendo style, while those using a dark theme see "Dark Mode".

Please don’t forget to let me know whether the patch I mentioned helped or not. WineMan has already replied that the patch fixed the issue.

Best regards,
Frank

[eagleman]

Code: Select all

:root {
    /* Let form controls follow the active browser/system palette */
    color-scheme: light dark;
    ...
}
@media (prefers-color-scheme: dark) {
...
}

This way, the visitor would get the best of both worlds (day, night), depending on the device’s settings.
Just a suggestion:
prefers-color-scheme_dark.png

Ok, it's a nice idea, but where have i to add the query?

[fraenkiman]

Hello eagleman,

The easiest way is to place the media query at the end of the CSS file. Within the media query, you include the rules that override those above it.

So, for example, if the CSS file starts with #cpmain { white }, then #cpmain { black } goes inside the media query.
When the visitor’s device signals @media (prefers-color-scheme: dark), #cpmain { black } is selected.

An example with body[class^="admin-"] .entry

Screenshot 2026-03-23 232451.png (8.66 KiB) Viewed 983 times

Screenshot 2026-03-23 232839.png (13.63 KiB) Viewed 983 times

Feel free to use and customize the style I’ve adapted. The style accounts for light/dark modes for both the frontend and the admin area. I’ve made it available via the wiki.
To test it, select “Light” or “Dark” in your browser settings. Alternatively, you can adjust the setting in your operating system.

Best regards,
Frank