The Setup

I’m on vacation. I opened Claude Code with a simple question: “What small blog tasks can I knock out today?”

The answer: way more than I expected.

What We Actually Did

1. Reorganized Blog Posts by Year

The Problem: 45 blog posts in a single flat directory (content/posts/). Hard to navigate, messy structure.

The Fix:

content/posts/
├── 2021/
├── 2022/
├── 2023/
├── 2024/
└── 2025/

Simple bash commands:

for year in 2021 2022 2023 2024 2025; do mkdir -p $year; done
for file in 2021-*.md; do mv "$file" 2021/; done
# repeat for other years...

Impact: Hugo still finds everything (uses recursive search), but now the repo is organized. Images stay in static/images/YYYY-MM-DD-post-slug/ and URLs don’t break because they use absolute paths (/images/...).

2. Rewrote the About Page

The Problem: Corporate buzzword soup. “Deep-rooted conviction”, “relentless pursuit of innovation”, “foster a culture of proactive security practices” - stuff I wrote in 2023 when I was trying to sell security consulting.

Spoiler: I don’t do that anymore.

The Fix: Honest, human writing. New structure:

  • Who I am (Go backend engineer, industrial IoT, north-bound connectors)
  • What I do (day job + side projects)
  • Tech stack (no religious wars, just what works)
  • The YouTube experiments (tried twice, failed twice, blogging works better)
  • Why this blog exists

Key insight from Claude: “Your ‘fuck off and reset’ post is 100x more authentic than this About page. They should match.”

He was right.

3. Built a Portfolio-First Home Page

The Problem: Default Hugo + PaperMod theme = blog list on home page. First impression: “this is a blog” (not: “this is an engineer’s portfolio”).

What We Built:

┌─────────────────────────────────────┐
│ Hero: Short intro + social icons    │
├─────────────────────────────────────┤
│ Featured Projects (grid, 3 columns) │
│ ┌─────┐ ┌─────┐ ┌─────┐            │
│ │Proj1│ │Proj2│ │Proj3│            │
│ └─────┘ └─────┘ └─────┘            │
├─────────────────────────────────────┤
│ Latest Writing (3 recent posts)     │
├─────────────────────────────────────┤
│ CTA: "Want to Work Together?"       │
└─────────────────────────────────────┘

Implementation:

  • Custom layouts/index.html (overrides theme default)
  • CSS in assets/css/extended/custom.css (PaperMod auto-bundles it)
  • Responsive grid (1 column mobile, 2 tablet, 3 desktop)

4. Switched from Hugo Modules to Theme Copy

The Problem: Hugo Modules keeps the theme in Go cache. Claude can’t see template files when debugging.

The Fix:

cd themes
git clone https://github.com/adityatelange/hugo-PaperMod.git PaperMod
rm -rf PaperMod/.git

Update config.toml:

theme = "PaperMod"

Remove go.mod, go.sum, and the [module] section.

Why: Simpler. No git submodule hell. No Hugo modules cache mystery. Claude can read the templates. Full control.

5. Added Writing Guidelines

Updated .claude/content-guide.md with a new rule:

Don’t use em-dashes ():

  • Why: Hard to distinguish visually, feels overly formal
  • Use hyphens (-) instead for parentheticals
  • Use colons (:) for explanations

This came up because Claude kept using em-dashes and I couldn’t see the difference between and - when reading markdown. Turns out it’s a classic “AI writing tells”.

The CSS Battle

Here’s the fun part: getting the project grid to actually work.

Attempt 1: Normal CSS

.project-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
}

Result: Vertical stack. PaperMod theme overrides it with display: block.

Attempt 2: Add !important

.project-grid {
    display: grid !important;
}

Result: Still vertical stack.

Attempt 3: More specific selectors

main section.projects-section div.project-grid {
    display: grid !important;
}

Result: Still doesn’t work.

The Real Problem: Custom CSS wasn’t loading at all.

I had css = ["css/custom.css"] in config.toml. Turns out PaperMod ignores that.

The Solution: PaperMod automatically bundles CSS from assets/css/extended/.

Move CSS:

mkdir -p assets/css/extended
mv static/css/custom.css assets/css/extended/custom.css

No config needed. Hugo rebuilds, CSS loads, grid works.

What I Learned

1. Hugo Modules vs Theme Copy

For side projects where you’re not tracking upstream updates religiously: just copy the theme. Simpler workflow, fewer abstractions, easier debugging.

2. PaperMod Custom CSS

Read the docs: PaperMod FAQs

Put CSS in assets/css/extended/. That’s it.

3. Micro-Tasks Work

Original plan: “small blog improvements, 1-2 hours max”.

Actual result: 3 hours, complete home page redesign, content reorganization, About page rewrite.

But it felt manageable because:

  • Each task was small (reorganize posts = 5 minutes)
  • No pressure to “finish everything”
  • Claude tracked progress with todos

This is exactly the workflow the “fuck off and reset” post was about.

4. Portfolio-First Matters

Before: “I’m a blogger who codes” After: “I’m an engineer who writes”

The home page structure signals intent. Projects first = builder. Blog first = writer.

I’m both, but the former is more accurate.

The Meta Irony

This post is about refactoring my blog during vacation.

The previous post was about how I should stop working on side projects during vacation and actually rest.

The gap between knowing what you should do and actually doing it: still undefeated.

But at least the home page looks good now.


Time spent: 3 hours (with breaks)

Coffee consumed: 2 cups

Times I said “fuck it, let’s just copy the theme”: 1

Times the CSS didn’t load and I didn’t notice for 2 hours: 1

Would I do it again? Probably. But next vacation, I’m really going to rest. I swear.


This post was written with Claude Code during a vacation that was supposed to be about resting. The irony is intentional.