Night & Day

code projects
#ai #cursor #rails #tailwind #ui

One of the best things I've found about vibe coding is that it becomes cheaper to experiment. Certainly not free—if you've paid the price for Opus 4.5 usage beyond your included plan limits, you know what I mean. But much cheaper in terms of time for planning, execution, and delivery than similar features would have taken in the past.

You could say it's a night and day difference in how engineers approach coding.

Light Mode & Dark Mode

My latest vibed feature on this site: light mode and dark mode support.

Approach

I've implemented dark mode support on other sites like HaydenIdaho.com. Despite being different codebases (React Router 7 vs. Ruby on Rails 8.1), they both use Tailwind, and as a result I was able to use the approach I'd already implemented as a guide for how to add it to this site.

  1. In the existing website repository, I prompted Cursor to:

Create a Styling.md file based on the approach to styling, light mode, dark mode, and theming that I'm using on this website. Keep it high level and not framework specific.

  1. In this repository, I prompted it to use Styling.md as a guide to create a plan to implement light mode and dark mode.

  2. Review and edit the plan making certain clarifications, i.e., providing specifics like where I wanted the toggle to display in the navigation, and guidelines for responsiveness (different toggle locations based on screen size).

  3. Build the plan.

  4. Review / QA. I run the website locally with watch running so I can see Rails and styling changes immediately. Multiple follow-up prompt sessions to make specific changes. I tend to use new sessions to avoid issues with the context window being too full and to prevent the model from getting confused by everything else it has already done.

  5. Upon final verification, I push the branch to GitHub, which triggers a workflow that deploys my updated site to Fly.io.

  6. Review the changes on production and rejoice.

Wrapped

I'm glad to finally have dark mode support on this website; it's my default appearance setting on iOS, and I want the site to be easier for everyone to see and read.