After I switched the theme for this blog, for the longest time I had not noticed that when reader is viewing specific post, they do not see the metadata like title, date etc.
When I noticed, I tried some time debugging, but couldn’t figure out why this was happening. So like a good developer that I am, I created a github issue so that I can fix it later (and not forget it)
I started this blog using indiefeed theme. But soon realized that the original creator has moved on. They have marked the repo as read-only on github. I had already started tweaking it to my liking, but now changes are more than tweaks. e.g. The original theme did not have good image support. i.e. only images used were in the Author profile image, and it has rounded corners/circular shape, which does not work when image is part of the post itself.
Today I spent some more time modifying the IndieFeed theme
As I mentioned earlier, I started using hugo modules instead of git submodule from the beginning. One of the downside of it was I could not preview my changes without pushing the changes to github first.
Sometimes that might be OK, most times it is not.
How do theme developers work in such scenario. Turns out there is a hack just for that.
I have been using Dendron for some time now as a PKM tool. I started when it was using 11ty to generate site out of the notes.
It would create the site in docs folder, using Dendron: Site Build in VSCode I had mapped the docs folder to a git repo.
I would push ready-made site to git, and netlify deploy was a no-op
%%{init: {'themeVariables':{'lineColor': 'lightblue', 'arrowheadColor': 'lightblue'}}}%% graph LR; A{ Write Content in markdown } A -->| git push | B[ source git repo ] A -->| Dendron: Site Build | C[ Site in `docs` folder ] C -->| git push | D[ netlify deploy ] Then recently they switched to next.
It surprised me at first to notice that this site looks different based on the time of the day. Upon debugging (aka using Browser Developer tools) I realized that the CSS has media query for prefer-color-theme Learn more here to learn more.
I made some minor changes to the theme, but I could only test one variant based on the time of the day.
That when I remembered that I had set system auto theme for firefox, which enabled dark mode during the evening/night.
I started with indiefeed theme. While it is possible to make visual changes by creating css/style.css (as explained in the README) I’m thinking of making other changes as well.
So I started by forking the theme. So far my changes are only in css/style.css
I’m not a frontend developer. But I know enough HTML/CSS to be dangerous 😆