You’ve probably noticed that the Sparsebundle site has had a new coat of paint. The original layout was something I knocked together in about an hour just to get the site up, I was never a fan of green or the sidebar, so I got rid of them completely. Additionally, I also reworked the tragic icon I hastily created using the OCR HOOK symbol. This time, I made the effort to create a custom one from scratch.

One particular feature that the Sparsebundle now has that I’ve blatantly stolen from apps like Instapaper and Twitterrific is night mode. I came across a Javascript method of doing this via CSS-Tricks which demonstrated how you can load different stylesheets based upon the time of day. After modifying it to better suit my need, the site inverts the colour scheme between the hours of 10pm and 6am for easier viewing, getting the time from the visitor and not the server.

Sparsebundle’s night mode

Reading Instapaper articles in a room with very little light is great, the dark background reduces eye strain. Browsing the web in the same situation is like looking directly into a supernova. If you’re interested in implementing this yourself, here’s how I did it:

https://gist.github.com/jordanmerrick/5670906.js

Just add that to your <head> after the rest of your CSS and alter the path to the correct stylesheet and you’ll be able to use it to override your styles.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s