On Hugo, the static site generator
Planted January 27, 2025

So, I published a little blog post about browser extensions to write down how we’re currently managing them, and I thought it went well, since I didn’t look at the site on mobile at all. Turns out, the code blocks in markdown were rendering the site way too wide for mobile and it looked really bad. Since most people these days probably use mobile first, I had to fix that.
This site is published using Hugo, the static site generator. I write markdown in my editor of choice (which at this moment happens to be Obsidian.md) and Hugo renders the markdown as HTML based on the templates provided. A while ago, I picked this theme you can see now, and forgot about it. It’s installed in my Hugo blog git repository under the themes
directory as a submodule so it should be really easy to update. Every time I push an update to the main branch, Cloudflare Pages gets that hook, pulls the latest from the git branch and you see this blog!
Evidently, when I started this site about 2 years ago, I never used any code-blocks, so I didn’t see this issue. Even if I had looked on a mobile viewport, it would have looked alright. After pushing the new blog post to my repo, I eventually showed someone else and texted it to them. Well, it looked bad! It was clipping past the right side of the phone screen and only showed about 2 lines of text with a lot of blank space under.
Long story short, I discovered that the code-blocks were not resizing to the mobile viewport. Next, I tried to debug using Chrome’s inspect tool to no avail. Then, I read up on how Hugo generates HTML from markdown, which was not exactly the answer. Finally, I hopped on the theme’s github page and found an issue related to my issue that had been closed as fixed.
After fussing with git submodule
for a while…
git pull
git submodule add https://github.com/apvarun/digital-garden-hugo-theme.git themes/digitalgarden\
git pull themes/digitalgarden
git pull themes/digitalgarden rebase
git pull
git config pull.rebase false
git pull themes/digitalgarden
git config pull.rebase true
git pull themes/digitalgarden
git submodule add https://github.com/apvarun/digital-garden-hugo-theme.git themes/digitalgarden\
git pull themes/digitalgarden
git clone https://github.com/apvarun/digital-garden-hugo-theme.git themes/digitalgarden\
git submodule add https://github.com/apvarun/digital-garden-hugo-theme.git themes/digitalgarden\
git submodule
git submodule pull
git submodule sync
git submodule asd
git submodule update
git submodule status
git submodule update --rebase
git submodule sync --recursive
git submodule status themes/digitalgarden
git submodule add https://github.com/apvarun/digital-garden-hugo-theme.git themes/digitalgarden\
git submodule update --init --recursive
git submodule
git submodule rm
git submodule deinit themes/digitalgarden
git submodule add https://github.com/apvarun/digital-garden-hugo-theme.git themes/digitalgarden
git submodule set-branch
git submodule set-branch --branch main
git submodule set-branch -d
git submodule set-branch -d themes/digitalgarden
git submodule
git submodule h
git submodule update
git submodule update --rebase
git submodule update -f --rebase
cd themes/digitalgarden
git pull
git checkout master
git checkout main
git submodule update
cd themes/digitalgarden
git checkout main
git pull
git submodule foreach git pull origin master
git submodule foreach git pull origin main
git submodule update --remote --merge\
git submodule update --init\
git submodule update --init --recursive\
Yes, this is my zsh_history
only filtering the git
commands from the past like 2 days
And I eventually succeeded in pulling the most-up-to-date version I could with the fix! I had even resorted to looking at other themes (and possibly designing my own despite not being skilled in front-end design at all). But I’m pretty happy with how this turned out and what I learned about Hugo site generation.
/ramble over!
Enjoy reading my content? Support me by using an affiliate link on Amazon! I have an excellent Dash Cam recommendation.