CSS for all hours

How adaptive is your app? Maybe it accounts for browser capabilities, screen size, language, and even location — but what about time?

Recently, developers have started to consider time in their UX. After all, your office isn’t a windowless casino. Two examples: Apple’s new dark mode in Mavericks and F.lux, which adjusts screen brightness & tint based on the sun cycle.

Smarten up your app with Goodnight, a JavaScript library that swaps CSS files based on the time of day:

Goodnight in action

Written by Jared Cubilla, Goodnight is super easy to implement:



If you take advantage of CSS selectors and classes, you can go even further, changing functionality by showing and hiding elements.

Comments :)
2017 Neal Shyam