search

martignoni / hugo-notice

A Hugo theme component to display nice notices
GNU General Public License v3.0
242 stars 49 forks source link

Add support for dark mode #19

Closed MarekPikula closed 2 years ago

MarekPikula commented 2 years ago

I would like to use this module with a theme which natively supports dark mode (namely Stack). Unfortunately, as I can see, it doesn't change the colours when the dark mode is enabled.

This is how it looks like with the base theme in dark mode: obraz

It's not terrible, but it would be nice if the colour scheme changed. Do you think it's easy to implement, or should I request it in the theme itself?

martignoni commented 2 years ago

This is fixed by PR #16 and commit 029d66f. Enjoy!

sourcevault commented 1 year ago

How do you change to dark mode colors ?

martignoni commented 1 year ago

There: https://github.com/martignoni/hugo-notice/blob/cce7afd430d49fe01ad6e2c006c3518fddc8ad77/layouts/shortcodes/notice.html#L8

martignoni commented 10 months ago

How do you change to dark mode colors ?

Re-reading this, I'm thinking your asking how to enable dark mode in your website (sorry for the misunderstanding).

Make your CSS use prefers-color-scheme and it'll work automatically. Another way to make it work is to inject class dark into the body element of your page when dark mode is needed.

oliverlabs commented 9 months ago

Hi @martignoni , thanks so much for clarifying this. It helped :) Please consider adding it to the official documentation as I couldn't easily find it on the main project page.

martignoni commented 9 months ago

Please consider adding it to the official documentation

I thought the same thing after reading you issue and this one, and began already. Thanks for the feedback and idea.

martignoni commented 9 months ago

Done: ca7c13c0f8c32d1b83529bfd7d0d10aa9314a1c2.