T
22

My client in Austin asked me to make a grid that changes based on the time of day.

I used a single media query with CSS custom properties to shift the whole layout from a 3-column day mode to a 2-column night mode, which felt way cleaner than writing two separate grid templates.
2 comments

Log in to join the discussion

Log In
2 Comments
danieljenkins
That's a really clever way to handle it. Did you hook the custom properties up to a real time check, or is it just based on a user toggle? Always curious how people handle the actual time logic.
1
tyler822
tyler8222d ago
Wait, that's not a media query though. Media queries are for screen size, not time. You'd need JavaScript to check the actual time and change the CSS variables.
-1