Bimlas, Nice share. I am playing with it now, to understand how it works, it restores to day when I close the tiddler.
Using this filter invert gives me the clue I was looking for, a way to get Icons to be given contrasting colors. Without even knowing the color one can use its rotated hue. - Somehow I feel this feature could be built into svg display or designs to allow a primary colour to be selected freely knowing its background as an example will contrast. - my interest is to allow designers to use alternate colors on available icons when adding a new button feature, but we always have the issue of "other themes", changes in background color etc... - This may also apply to svgs from the icon source Mohammad shared recently Nice work Tones On Friday, 20 November 2020 at 09:29:33 UTC+11 bimlas wrote: > To set automatic night mode (dark mode), create a new tiddler and add the > $:/tags/PageTamplate tag. > > <$vars > currentTime=<<now "hhmm">> > nightStart="2000" <!-- 20:00 --> > nightEnd="800" <!-- 8:00 --> > > > <$list filter="[<currentTime>compare:number:gteq<nightStart>] > [<currentTime>compare:number:lt<nightEnd>]"> > <!-- Code taken from > https://dev.to/akhilarjun/one-line-dark-mode-using-css-24li --> > <style> > html { > filter: invert(1) hue-rotate(180deg); > } > html img { > filter: invert(1) hue-rotate(180deg); > } > </style> > </$list> > </$vars> > -- You received this message because you are subscribed to the Google Groups "TiddlyWiki" group. To unsubscribe from this group and stop receiving emails from it, send an email to [email protected]. To view this discussion on the web visit https://groups.google.com/d/msgid/tiddlywiki/44bde000-170b-4d15-aa08-184437486512n%40googlegroups.com.
