htmlcssjekyll

CSS to add to Jekyll Minima, not completely override it


I am building my first Jekyll site and am happy with the Minima theme as a starting point. I would however like to customise some aspects of the site, such as colours, adding elements to layouts etc.

However, whenever I create a stylesheet or layout in the following structure(currently empty files, as I want to add supplementary elements ad hoc)

/
 --assets
   --main.css
 --_layouts
   --default.html

It overrides the default layout and style, leaving a styleless website.

How can one supplement the Jekyll Minima theme, without overwriting the default?


Solution

  • By virtue of the way gem-based Jekyll themes work, any file at source-directory take precedence over the same file if it exists in the theme-gem. i.e., <source>/_sass/minima.scss will override the entire <theme-gem>/_sass/minima.scss by its mere presence.

    To make simple changes like changing the color, alter the variable values in _sass/minima.scss

    To alter layout styles, copy both _sass/minima.scss and _sass/minima/_layout.scss to source, and then alter the _layout partial


    Or if you simply want to add to Minima, do the following: