Both color palettes can be found in assets/scss/colors/variables.scss.
By default, there are 2 accent colors plus 10 on the demo site, distributed into pairs.
You can change the default mode and accent colors in the config:
# Dark mode as default# User preferences (site/system settings) will still have priority over it# The default is falseisDark = true# Accent colors for dark and light mode respectivelydarkAccent = "#1dbc91"# Default is "#1dbc91"lightAccent = "#1f676b"# Default is "#1f676b"# More colors, pick as many as you want (not really sure if there's a limit)# Apparently these may not show up on every modern browser (ie.: Firefox)# There's no default value. Used here just as examplepresets = [ "#1f676b", "#f3a530", "#902b37", "#1dbc91", "#754e85", "#7fc121", "#a8314a", "#ff7433", "#3e6728", "#c063bd" ]
This theme comes with two chroma styles, meant to be used with dark and light mode respectively. These are Monokai for dark mode and Solarized Dark for light mode.
It’s worth noting that I’m not using the original stylesheets, but modified stylesheets based on the pygments-high-contrast-stylesheets (aka “WCAG AA passing Pygments stylesheets”).
In case you want to change it, it can be found in assets/scss/colors/chroma as dark.scss and light.scss.
The lines below are required in your config file to make use of this feature:
noClasses = false
To disable it, you can just remove the noClasses = false (as its default value is true) and add the lines below:
useCustomChroma = false
By default, images with width equal or greater than 1280 pixels are processed (resized) into 3 resolutions: 1280x, 960x and 640x (this one with quality at 90, as opposed to the default 75).
You can change this behavior via config:
highRes = [ "1280x", "1280w" ]
mediumRes = [ "960x", "960w" ]
lowRes = [ "640x q90", "640w" ]
# entry = [ resize options, condition ]# Images with width equal or greater this value# will be processed into the 3 resolutions above# Valid only for images rendered via markdown# The default value is 1280markupAutoResizeWidth = 1280
The shortcodes img and figure will always process images and cover images will also process resolutions for Open Graph (1200x630) and Twitter (1280x640).
The most complex shortcodes here are the social and contact-form. They can be used to inject a list of social platform links and a contact form, respectively.
Here I make a distinction between centralized and decentralized platforms.
Since decentralized platforms introduced the concept of “instances”. It’s not uncommon that a single person owns multiple accounts, in multiple instances, in the same platform.
This information will also be used to generate social meta tags (ie.: rel=“me” and Schema.org).
# Contact form shortcode
# formspree.io Form IDformspreeFormId = "example"# Autocomplete [on/off] and min character length for messageautoComplete = false# Default is falsemessageMinLength = 140# Default is 140# Subject# You can set a single value below (and it will cease to be a dropdown),# BUT KEEP IT AS AN ARRAY# It can also be disabled entirely (and it will turn into a text field)subject = [ 'Just saying "hi"', "I know what you did last winter", "... Is that a sloth?", "お前はもう死んでいる。" ]
# Text placeholders. As usual, comment the lines if you don't want use them# The "subject" below will only be used if the "subject" above doesn't exist (ie.: commented/deleted)
name = "Jane Doe"email = "firstname.lastname@example.org"subject = 'Just saying "hi"'message = "Aenean lacinia bibendum nulla sed consectetur. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Donec ullamcorper nulla non metus auctor fringilla nullam quis risus."
Minimal effort was put here, since I don’t use this feature. I recommend that you create your own assets/scss/rich-content.scss.
A really basic 404 page can be generated via config file by using:
title = "Page not found"description = "This page was not found."paragraph = "Nothing to see here, buddy."
Custom front matter params
mainTitle (string): Can be used to replace the <title> meta tag, if you wish it to be different from the <h1> (which will still use the title param);
sitemapExclude (true|false): Can be used to exclude a page/section from the sitemap;
noindex (true|false): Similar to the above. Can be used to exclude a page/section from being indexed (by bots or your own site). It will change the meta tag robots to noindex and the page(s) will not be added to the site’s search index.
The site title can be replaced by creating a file named layouts/partials/custom/site-title.html;
Custom favicons can be used by creating a file named layouts/partials/custom/head-append.html;
Custom CSS can be imported into the main CSS file by creating a file named static/css/custom.css or assets/scss/custom.scss;
The footerText param can be replaced by creating a file named layouts/partials/custom/footer-text.html.
More possible params for your config file (or front matter):