How to create a different blog post css setting

[bgalvao]

Hey, I'm loving this theme! It's simple to set up and it has KaTeX :D
I have already deployed it to dev.brnrdo.xyz (I may need to find a more marketable domain).

My question is, how do I hack this theme to:

1. Recenter the main body of a blog post to the center (as opposed to leftwards as it is currently)
2. Use a custom font from Google Fonts (or a local ttf file)
3. How do I set a "template" to make blog posts use different predefined configurations between Congo's default CSS for blog posts and my future CSS setting (my wish is that technical posts would use a serif font and personal posts would use a sans serif font, for example)

I know there's documentation in Hugo and TailWinds, but I'd like to get some pointers before diving in those.

[jpanther]

Although some of these changes are not straightforward, you have the ability to provide your own custom CSS to override any of the theme behaviour. Refer to the overriding the stylesheet docs to learn more about this. This is the quickest way to do things like changing the font to use something custom.

You can also create your own templates for different types of content. The way to achieve this in Hugo is using "layouts". The docs also have a lot of detail on how to do this and I'd encourage you to read the content examples section to learn more about it.

Essentially you could create a custom layout for technical posts (by creating layouts/technical.html) and use the base theme template for normal posts. Then either override the layout in the front matter of technical posts with layout: "technical" or create different sections in your content so that it automatically applies the layout for you:

content/
├─ blog/
│  └─ blog_post.md
├─ technical/
│  └─ techical_post.md
└─ _index.md