marius/risotto
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Document colour classes

Browse source
This commit is contained in:
Joe Roe 2024-02-12 09:43:53 +01:00
parent e81c2f02ed
commit 188903ac09
No known key found for this signature in database
GPG key ID: 032DAD09129ADB03
2 changed files with 13 additions and 4 deletions
Download patch file Download diff file Expand all files Collapse all files

5
NEWS.md
View file

@ -1,13 +1,14 @@
# risotto (development version) # risotto (development version)
* Fixed overflow of code blocks with line numbers (#41)
* Added descriptions to sidebar of list pages, where defined in the frontmatter of `_index.md` (#55) * Added descriptions to sidebar of list pages, where defined in the frontmatter of `_index.md` (#55)
* Made sidebar sticky, avoiding overflow for long tables of contents (#51) * Made sidebar sticky, avoiding overflow for long tables of contents (#51)
* Added convenience classes for colours, e.g. `.base00` and `.bg-base00`.
* Fixed overflow of code blocks with line numbers (#41)
* Fixed invalid HTML in page header (#64)
* Updated FontAwesome to 6.5.1 (#63) * Updated FontAwesome to 6.5.1 (#63)
* Please note that future versions will probably not include FontAwesome by default * Please note that future versions will probably not include FontAwesome by default
* Updated Academicons to 1.9.4 (#63) * Updated Academicons to 1.9.4 (#63)
* Please note that future versions will probably not include Academicons by default * Please note that future versions will probably not include Academicons by default
* Fixed invalid HTML in page header (#64)
# risotto 0.3.0 # risotto 0.3.0

12
README.md
View file

@ -15,7 +15,7 @@ risotto is a minimalist, responsive [hugo](https://gohugo.io) theme inspired by
* Plain, semantic HTML with no Javascript * Plain, semantic HTML with no Javascript
* Plain CSS – no frameworks, no preprocessors, just simple and easy-to-customise stylesheets * Plain CSS – no frameworks, no preprocessors, just simple and easy-to-customise stylesheets
* Uses [CSS Grid](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_grid_layout) for native responsive behaviour without arbitrary breakpoints * Uses [CSS Grid](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_grid_layout) for native responsive behaviour without arbitrary breakpoints
* Comes with [16 built-in colour schemes](#colour-palettes) based on popular terminal themes plus the ability to use custom themes using the [base16 system](https://github.com/monicfenga/base16-styles) * Comes with [16 built-in colour schemes](#colour-schemes) based on popular terminal themes plus the ability to use custom themes using the [base16 system](https://github.com/monicfenga/base16-styles)
## Install ## Install
@ -52,7 +52,7 @@ To use the theme, add `theme = 'risotto'` to your site's `config.toml`, or `them
See `exampleSite/config.toml` for the theme-specific parameters you need to add to your site's `config.toml` or `config.yaml` to configure the theme. See `exampleSite/config.toml` for the theme-specific parameters you need to add to your site's `config.toml` or `config.yaml` to configure the theme.
### Colour palettes ### Colour schemes
risotto uses the [base16 framework](https://github.com/chriskempson/base16) to define colour schemes that can be used with the `theme.palette` parameter. risotto uses the [base16 framework](https://github.com/chriskempson/base16) to define colour schemes that can be used with the `theme.palette` parameter.
A selection of 16 palettes (10 dark, 6 light) are bundled with the theme: `apprentice`, `base16-dark`, `base16-light`, `dracula`, `gruvbox-dark`, `gruvbox-light`, `material`, `papercolor-dark`, `papercolor-light`, `solarized-dark`, `solarized-light`, `tender`, `tokyo-night-dark`, `tokyo-night-light`, `windows-95` and `windows-95-light`. A selection of 16 palettes (10 dark, 6 light) are bundled with the theme: `apprentice`, `base16-dark`, `base16-light`, `dracula`, `gruvbox-dark`, `gruvbox-light`, `material`, `papercolor-dark`, `papercolor-light`, `solarized-dark`, `solarized-light`, `tender`, `tokyo-night-dark`, `tokyo-night-light`, `windows-95` and `windows-95-light`.
@ -86,6 +86,14 @@ Or to define a wholly custom theme, you will need to define the following CSS va
For light mode palettes, the sequence of 00–07 should be reversed (light to dark, not dark to light). For light mode palettes, the sequence of 00–07 should be reversed (light to dark, not dark to light).
Note that not all colours are currently used in the theme. Note that not all colours are currently used in the theme.
You you use these colours directly in content using the convenience classes `.baseXX` and `.bg-baseXX`.
For example:
```html
<span class="base0A">Yellow text</span>
<mark class="base0D">Text highlighted in green</mark>
```
## Favicon ## Favicon
risotto will automatically use favicons placed in the `static/` directory. risotto will automatically use favicons placed in the `static/` directory.