how to customize CSS?

[netllama]

This theme is awesome! Thanks so much for creating and maintaining it.

One thing that I'm unclear how to accomplish is customizing the CSS for the theme. For a "normal" pelican theme, I'd clone the theme repo, then make my changes (and maybe send out a PR). But since this theme comes from a package, I have no repo to clone, and the theme isn't available under the themes directory anyway.

Is there some approved way to hack on the CSS to make changes that will be detected automatically when I run make publish or make html? thanks!

[MinchinWeb]

Hi @netllama ! Thanks you so much for your kind words.

It's true that being set up as a Python package and a Pelican plugin makes it less straightforward how to hack on this. Depending on how extensively your proposed changes, there are several ways to go about this. Here's a couple of tips that might help get you started:

• If you're comfortable with Git, you can just clone the repository, and add your cloned seafoam/pelican/plugins directory to your list of plugins. If Pelican doesn't load your version of the plugin, you might have to install the theme as a Python package (i.e. pip install . from the repo's root directory). Note that if you do this, you'll have to install it and not use editable mode (-e) for pip, as that doesn't seem to work as with namespace packages (like Pelican plugins). So you'll need to reinstall the package each time to make changes.
• the theme does provide two settings that may be of use: CUSTOM_CSS and CUSTOM_CSS_LIST; provide a link to your custom CSS that exists in your generated Pelican site, with relative links assumed to be realitive to the SITE_URL. This may be the way to go if you changes are relatively simple, one-off, or mostly applicable to your usecase.
• the generated CSS is actually generated from the source LESS files at css_src/less (here). Make your pull requests against here rather than the generated CSS.
• the LESS files that are probably the most interesting are the variables-minchinweb.less and the custom-minchinweb.less. Most of the rest is the base version of Bootstrap. If you want to do main level CSS changes, this is probably what you want to tinker with.
• if you want to do a colour scheme or font rework, probably best to create another sub-theme. Start with bootstrap.seafoam.less as a sample.
• if you want to make changes to the actual layout (rather than just CSS changes), the Jinja Templates are in the pelican/plugins/seafoam/templates folder (here)

Hopefully that helps you get started. If you need more help, let me know. I'm looking forward to your PR :)