^ Tags/Topics   ^^ All Articles

🎨 Redesigned My Blog with Minimal CSS

I had trouble sleeping tonight, so I decided to redesign the blog portion of my website using as little CSS as possible. Additionally, I created a workflow where I can write new articles in Markdown and convert them to HTML. Although I’m aware of the various static site generators available, I initially chose to write articles manually using an HTML template I put together. This method worked for a while, but as I wanted to add more content, it became incredibly inefficient and prone to broken links and maintenance issues.

The Old Crusty Blog…

Articles page Articles page

Example article Example article

After writing this short post, I was done with manually doing it

After writing this specific blog post, I was personally done with manually doing it.

The old page looked okay, but I don’t prioritize aesthetics for this site. My focus is on functionality, minimalism, and providing a place for people to read about my interests, opinions, and other topics.

I discovered a method for dark mode device recognition:

<meta name="color-scheme" content="light dark">

It’s great because it doesn’t require using @media CSS queries.

I also experimented with pandoc and created this Makefile to compile Markdown into usable HTML, streamlining the process.

With the simpler design, it’s easier to manipulate pandoc CSS styling for the few elements that require it.

Looks like crap, but it works and makes things easy for me Looks like crap, but it works and makes things easy for me.

Looks like crap, but it works and makes things easy for me — in light mode (Again, in light mode) Looks like crap, but it works and makes things easy for me.

So yeah, you’re most definitely seeing the new design now, and the old one is not coming back. This new approach is simpler, plainer, and surprisingly readable.

An RSS feed is coming soon.

Related:
Programming