Merge branch 'main' into main
This commit is contained in:
Joe Roe
GitHub
commit
59e27a3d50
23 changed files with 203 additions and 142 deletions
1
.gitignore
vendored
Normal file
1
.gitignore
vendored
Normal file
|
|
@ -0,0 +1 @@
|
|||
.hugo_build.lock
|
||||
36
README.md
36
README.md
|
|
@ -18,12 +18,6 @@ If your site is already a git repository, you can add the theme as a submodule i
|
|||
git submodule add https://github.com/joeroe/risotto.git themes/risotto
|
||||
```
|
||||
|
||||
## Configure
|
||||
|
||||
To use the theme, add `theme = risotto` to your site's `config.toml` or `config.yaml`.
|
||||
|
||||
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.
|
||||
|
||||
## Update
|
||||
|
||||
If you installed the theme using `git clone`, pull the repository to get the latest version:
|
||||
|
|
@ -39,3 +33,33 @@ Or, if you added it as a git submodule:
|
|||
git submodule update --remote
|
||||
```
|
||||
|
||||
## Configure
|
||||
|
||||
To use the theme, add `theme = risotto` to your site's `config.toml` or `config.yaml`.
|
||||
|
||||
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 palettes for the theme are defined using the [base16 system](https://github.com/chriskempson/base16):
|
||||
|
||||
| Base | Default colour | Used for | Examples |
|
||||
| ---- | -------------- | -------- | -------- |
|
||||
| 00 | Dark | Background | Page background |
|
||||
| 01 | │ | Alt. background | Content background |
|
||||
| 02 | │ | In-text backgrounds | `<pre>`, `<code>`, `<kbd>`, `<samp>` |
|
||||
| 03 | │ | Muted text | `:before` & `:marker` symbols |
|
||||
| 04 | │ | Alt. foreground | Aside text |
|
||||
| 05 | │ | Foreground | Content text |
|
||||
| 06 | │ | | |
|
||||
| 07 | Light | | |
|
||||
| 08 | Red | | |
|
||||
| 09 | Orange | | |
|
||||
| 0A | Yellow | Highlights | Selected text, `<mark>` |
|
||||
| 0B | Green | Primary accent | Logo |
|
||||
| 0C | Cyan | Active links | `a:active`, `a:hover` |
|
||||
| 0D | Blue | Links | `a:link`, `a:visited` |
|
||||
| 0E | Magenta | | |
|
||||
| 0F | Brown | | |
|
||||
|
||||
For light mode palettes, the sequence of 00–07 should be reversed (light to dark, not dark to light).
|
||||
|
|
|
|||
0
exampleSite/.hugo_build.lock
Normal file
0
exampleSite/.hugo_build.lock
Normal file
|
|
@ -1,29 +0,0 @@
|
|||
# hugoBasicExample
|
||||
|
||||
This repository offers an example site for [Hugo](https://gohugo.io/) and also it provides the default content for demos hosted on the [Hugo Themes Showcase](https://themes.gohugo.io/).
|
||||
|
||||
# Using
|
||||
|
||||
1. [Install Hugo](https://gohugo.io/overview/installing/)
|
||||
2. Clone this repository
|
||||
|
||||
```bash
|
||||
git clone https://github.com/gohugoio/hugoBasicExample.git
|
||||
cd hugoBasicExample
|
||||
```
|
||||
|
||||
3. Clone the repository you want to test. If you want to test all Hugo Themes then follow the instructions provided [here](https://github.com/gohugoio/hugoThemes#installing-all-themes)
|
||||
|
||||
4. Run Hugo and select the theme of your choosing
|
||||
|
||||
```bash
|
||||
hugo server -t YOURTHEME
|
||||
```
|
||||
|
||||
5. Under `/content/` this repository contains the following:
|
||||
|
||||
- A section called `/post/` with sample markdown content
|
||||
- A headless bundle called `homepage` that you may want to use for single page applications. You can find instructions about headless bundles over [here](https://gohugo.io/content-management/page-bundles/#headless-bundle)
|
||||
- An `about.md` that is intended to provide the `/about/` page for a theme demo
|
||||
|
||||
6. If you intend to build a theme that does not fit in the content structure provided in this repository, then you are still more than welcome to submit it for review at the [Hugo Themes](https://github.com/gohugoio/hugoThemes/issues) respository
|
||||
|
|
@ -15,10 +15,10 @@ ignoreErrors = ["error-remote-getjson"]
|
|||
sectionPagesMenu = "main"
|
||||
|
||||
[params]
|
||||
noindex = false
|
||||
|
||||
[params.theme]
|
||||
palette = "gruvbox-dark"
|
||||
mode = "dark-mode"
|
||||
palette = "base16-dark"
|
||||
|
||||
# Sidebar: about/bio
|
||||
[params.about]
|
||||
|
|
@ -28,16 +28,16 @@ logo = "images/rice.svg"
|
|||
|
||||
# Sidebar: social links
|
||||
# Available icon sets:
|
||||
# * FontAwesome 5 <https://fontawesome.com/> ('fas fa-' or 'fab-fa' for brands)
|
||||
# * FontAwesome 6 <https://fontawesome.com/> ('fa-brands', 'fa-normal', or 'fa-solid' for brands)
|
||||
# * Academicons <https://jpswalsh.github.io/academicons> ('ai ai-')
|
||||
|
||||
[[params.socialLinks]]
|
||||
icon = "fab fa-github"
|
||||
icon = "fa-brands fa-github"
|
||||
title = "GitHub"
|
||||
url = "https://github.com/joeroe/risotto"
|
||||
|
||||
[[params.socialLinks]]
|
||||
icon = "fas fa-envelope"
|
||||
icon = "fa-solid fa-envelope"
|
||||
title = "Email"
|
||||
url = "mailto:example@example.com"
|
||||
|
||||
|
|
|
|||
|
|
@ -1,3 +0,0 @@
|
|||
+++
|
||||
author = "Hugo Authors"
|
||||
+++
|
||||
1
exampleSite/content/_index.md
Symbolic link
1
exampleSite/content/_index.md
Symbolic link
|
|
@ -0,0 +1 @@
|
|||
../../README.md
|
||||
3
exampleSite/content/_index.md.old
Normal file
3
exampleSite/content/_index.md.old
Normal file
|
|
@ -0,0 +1,3 @@
|
|||
+++
|
||||
author = "Hugo Authors"
|
||||
+++
|
||||
|
|
@ -1,5 +1,5 @@
|
|||
{{ define "main" }}
|
||||
<h1 id="{{ .Title | urlize }}">{{ .Title | markdownify }}</h2>
|
||||
<h1 id="{{ .Title | urlize }}">{{ .Title | markdownify }}</h1>
|
||||
|
||||
{{ .Content }}
|
||||
|
||||
|
|
|
|||
|
|
@ -3,15 +3,15 @@
|
|||
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<meta charset="UTF-8"/>
|
||||
{{ if .Site.Params.noindex }}<meta name="robots" content="noindex" /> {{ end }}
|
||||
|
||||
<!-- FontAwesome <https://fontawesome.com/> -->
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.2/css/all.min.css" integrity="sha512-HK5fgLBL+xu6dm/Ii3z4xhlSUyZgTT9tuc/hSrtw6uzJOvgRr2a9jyxxT1ely+B+xFAmJKVSTbpM/CuL7qxO8w==" crossorigin="anonymous" />
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.1.2/css/all.min.css" integrity="sha512-1sCRPdkRXhBV2PBLUdRb4tMg1w2YPf37qatUFeS7zlBy7jJI8Lf4VHwWfZZfpXtYSLy85pkm9GaYVYMfw5BC1A==" crossorigin="anonymous" />
|
||||
|
||||
<!-- Academicons <https://jpswalsh.github.io/academicons/> -->
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/academicons/1.9.1/css/academicons.min.css" integrity="sha512-b1ASx0WHgVFL5ZQhTgiPWX+68KjS38Jk87jg7pe+qC7q9YkEtFq0z7xCglv7qGIs/68d3mAp+StfC8WKC5SSAg==" crossorigin="anonymous" />
|
||||
|
||||
<!-- risotto -->
|
||||
<link rel="stylesheet" href="{{ printf "css/colour/%s.css" .Site.Params.theme.palette | absURL }}">
|
||||
<link rel="stylesheet" href="{{ printf "css/colour/%s.css" .Site.Params.theme.mode | absURL }}">
|
||||
<!-- risotto theme -->
|
||||
<link rel="stylesheet" href="{{ printf "css/palettes/%s.css" (.Site.Params.theme.palette | default "base16-dark") | absURL }}">
|
||||
<link rel="stylesheet" href="{{ "css/risotto.css" | absURL }}">
|
||||
<link rel="stylesheet" href="{{ "css/custom.css" | absURL }}">
|
||||
|
|
|
|||
|
|
@ -1,7 +0,0 @@
|
|||
:root {
|
||||
--bg: var(--black);
|
||||
--dark-bg: var(--dark-black);
|
||||
--bright-bg: var(--bright-black);
|
||||
--fg: var(--white);
|
||||
--bright-fg: var(--bright-white);
|
||||
}
|
||||
|
|
@ -1,29 +0,0 @@
|
|||
/* gruvbox dark mode
|
||||
* https://github.com/morhetz/gruvbox
|
||||
*/
|
||||
:root {
|
||||
--dark-black: #1d2021;
|
||||
--black: #282828;
|
||||
--bright-black: #928374;
|
||||
|
||||
--white: #ebdbb2;
|
||||
--bright-white: #fbf1c7;
|
||||
|
||||
--red: #cc241d;
|
||||
--green: #98971a;
|
||||
--yellow: #d79921;
|
||||
--blue: #458588;
|
||||
--magenta: #b16286;
|
||||
--cyan: #689d6a;
|
||||
--orange: #d65d0e;
|
||||
--gray: #928374;
|
||||
|
||||
--bright-red: #fb4934;
|
||||
--bright-green: #b8bb26;
|
||||
--bright-yellow: #fabd2f;
|
||||
--bright-blue: #83a598;
|
||||
--bright-magenta: #d3869b;
|
||||
--bright-cyan: #8ec07c;
|
||||
--bright-orange: #fe8019;
|
||||
--bright-gray: #a89984;
|
||||
}
|
||||
|
|
@ -1,30 +0,0 @@
|
|||
/* gruvbox light mode
|
||||
* https://github.com/morhetz/gruvbox
|
||||
*/
|
||||
:root {
|
||||
--dark-black: #282828;
|
||||
--black: #3c3836;
|
||||
--bright-black: #928374;
|
||||
|
||||
--white: #fbf1c7;
|
||||
--bright-white: #f9f5d7;
|
||||
|
||||
--red: #9d0006;
|
||||
--green: #79740e;
|
||||
--yellow: #b57614;
|
||||
--blue: #076678;
|
||||
--magenta: #8f3f71;
|
||||
--cyan: #427b58;
|
||||
--orange: #af3a03;
|
||||
--gray: #7c6f64;
|
||||
|
||||
--dark-white: #f2e5bc;
|
||||
--bright-red: #cc241d;
|
||||
--bright-green: #98971a;
|
||||
--bright-yellow: #d79921;
|
||||
--bright-blue: #458588;
|
||||
--bright-magenta: #b16286;
|
||||
--bright-cyan: #689d6a;
|
||||
--bright-orange: #d65d0e;
|
||||
--bright-gray: #928374;
|
||||
}
|
||||
|
|
@ -1,7 +0,0 @@
|
|||
:root {
|
||||
--bg: var(--white);
|
||||
--dark-bg: var(--dark-white);
|
||||
--bright-bg: var(--bright-black);
|
||||
--fg: var(--black);
|
||||
--bright-fg: var(--bright-black);
|
||||
}
|
||||
17
static/css/colours.css
Normal file
17
static/css/colours.css
Normal file
|
|
@ -0,0 +1,17 @@
|
|||
:root {
|
||||
/* Background */
|
||||
--bg: var(--base00);
|
||||
--off-bg: var(--base01);
|
||||
--inner-bg: var(--base02);
|
||||
|
||||
/* Text */
|
||||
--fg: var(--base05);
|
||||
--off-fg: var(--base04);
|
||||
--muted: var(--base03);
|
||||
--link: var(--base0D);
|
||||
--hover: var(--base0C);
|
||||
--highlight: var(--base0A);
|
||||
|
||||
/* Logo */
|
||||
--logo: var(--base0B);
|
||||
}
|
||||
|
|
@ -1,5 +1,5 @@
|
|||
.page__footer {
|
||||
color: var(--bright-bg);
|
||||
color: var(--off-fg);
|
||||
}
|
||||
|
||||
.page__footer p {
|
||||
|
|
|
|||
|
|
@ -41,13 +41,14 @@
|
|||
/* Body + aside */
|
||||
.page__body {
|
||||
grid-area: body;
|
||||
background-color: var(--bg);
|
||||
box-shadow: 0 0 0 1rem var(--bg);
|
||||
background-color: var(--off-bg);
|
||||
box-shadow: 0 0 0 1rem var(--off-bg);
|
||||
overflow-wrap: break-word;
|
||||
}
|
||||
|
||||
.page__aside {
|
||||
grid-area: aside;
|
||||
color: var(--bright-bg);
|
||||
color: var(--off-fg);
|
||||
}
|
||||
|
||||
/* Footer */
|
||||
|
|
|
|||
|
|
@ -11,7 +11,8 @@
|
|||
|
||||
.page__logo-inner {
|
||||
display: block;
|
||||
background: var(--green);
|
||||
background: var(--logo);
|
||||
opacity: 0.90;
|
||||
padding: 0.25rem;
|
||||
}
|
||||
|
||||
|
|
@ -22,7 +23,7 @@ a.page__logo-inner:link, a.page__logo-inner:visited {
|
|||
|
||||
a.page__logo-inner:hover,
|
||||
a.page__logo-inner:active {
|
||||
background: var(--bright-green);
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.page__logo-inner:before {
|
||||
|
|
|
|||
22
static/css/palettes/base16-dark.css
Normal file
22
static/css/palettes/base16-dark.css
Normal file
|
|
@ -0,0 +1,22 @@
|
|||
/* base16 default dark
|
||||
* https://github.com/chriskempson/base16-default-schemes
|
||||
*/
|
||||
|
||||
:root {
|
||||
--base00: #181818;
|
||||
--base01: #282828;
|
||||
--base02: #383838;
|
||||
--base03: #585858;
|
||||
--base04: #b8b8b8;
|
||||
--base05: #d8d8d8;
|
||||
--base06: #e8e8e8;
|
||||
--base07: #f8f8f8;
|
||||
--base08: #ab4642;
|
||||
--base09: #dc9656;
|
||||
--base0A: #f7ca88;
|
||||
--base0B: #a1b56c;
|
||||
--base0C: #86c1b9;
|
||||
--base0D: #7cafc2;
|
||||
--base0E: #ba8baf;
|
||||
--base0F: #a16946;
|
||||
}
|
||||
22
static/css/palettes/base16-light.css
Normal file
22
static/css/palettes/base16-light.css
Normal file
|
|
@ -0,0 +1,22 @@
|
|||
/* base16 default light
|
||||
* https://github.com/chriskempson/base16-default-schemes
|
||||
*/
|
||||
|
||||
:root {
|
||||
--base00: #f8f8f8;
|
||||
--base01: #e8e8e8;
|
||||
--base02: #d8d8d8;
|
||||
--base03: #b8b8b8;
|
||||
--base04: #585858;
|
||||
--base05: #383838;
|
||||
--base06: #282828;
|
||||
--base07: #181818;
|
||||
--base08: #ab4642;
|
||||
--base09: #dc9656;
|
||||
--base0A: #f7ca88;
|
||||
--base0B: #a1b56c;
|
||||
--base0C: #86c1b9;
|
||||
--base0D: #7cafc2;
|
||||
--base0E: #ba8baf;
|
||||
--base0F: #a16946;
|
||||
}
|
||||
23
static/css/palettes/gruvbox-dark.css
Normal file
23
static/css/palettes/gruvbox-dark.css
Normal file
|
|
@ -0,0 +1,23 @@
|
|||
/* gruvbox dark
|
||||
* https://github.com/morhetz/gruvbox
|
||||
* base16: https://github.com/dawikur/base16-gruvbox-scheme
|
||||
*/
|
||||
|
||||
:root {
|
||||
--base00: #282828;
|
||||
--base01: #3c3836;
|
||||
--base02: #504945;
|
||||
--base03: #665c54;
|
||||
--base04: #bdae93;
|
||||
--base05: #d5c4a1;
|
||||
--base06: #ebdbb2;
|
||||
--base07: #fbf1c7;
|
||||
--base08: #fb4934;
|
||||
--base09: #fe8019;
|
||||
--base0A: #fabd2f;
|
||||
--base0B: #b8bb26;
|
||||
--base0C: #8ec07c;
|
||||
--base0D: #83a598;
|
||||
--base0E: #d3869b;
|
||||
--base0F: #d65d0e;
|
||||
}
|
||||
23
static/css/palettes/gruvbox-light.css
Normal file
23
static/css/palettes/gruvbox-light.css
Normal file
|
|
@ -0,0 +1,23 @@
|
|||
/* gruvbox light
|
||||
* https://github.com/morhetz/gruvbox
|
||||
* base16: https://github.com/dawikur/base16-gruvbox-scheme
|
||||
*/
|
||||
|
||||
:root {
|
||||
--base00: #fbf1c7;
|
||||
--base01: #ebdbb2;
|
||||
--base02: #d5c4a1;
|
||||
--base03: #bdae93;
|
||||
--base04: #665c54;
|
||||
--base05: #504945;
|
||||
--base06: #3c3836;
|
||||
--base07: #282828;
|
||||
--base08: #9d0006;
|
||||
--base09: #af3a03;
|
||||
--base0A: #b57614;
|
||||
--base0B: #79740e;
|
||||
--base0C: #427b58;
|
||||
--base0D: #076678;
|
||||
--base0E: #8f3f71;
|
||||
--base0F: #d65d0e;
|
||||
}
|
||||
|
|
@ -1,3 +1,4 @@
|
|||
@import 'colours.css';
|
||||
@import 'typography.css';
|
||||
@import 'layout.css';
|
||||
@import 'header.css';
|
||||
|
|
@ -6,6 +7,6 @@
|
|||
@import 'footer.css';
|
||||
|
||||
body {
|
||||
background-color: var(--dark-bg);
|
||||
background-color: var(--bg);
|
||||
color: var(--fg);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -52,7 +52,7 @@ h3:before,
|
|||
h4:before,
|
||||
h5:before,
|
||||
h6:before {
|
||||
color: var(--bright-bg);
|
||||
color: var(--muted);
|
||||
}
|
||||
|
||||
h1:first-child {
|
||||
|
|
@ -67,21 +67,21 @@ p {
|
|||
/* Links */
|
||||
|
||||
a:link, a:visited {
|
||||
color: var(--fg);
|
||||
color: var(--link);
|
||||
}
|
||||
|
||||
a:hover, a:active {
|
||||
color: var(--bright-fg);
|
||||
color: var(--hover);
|
||||
}
|
||||
|
||||
/* Lists */
|
||||
ul {
|
||||
margin: 1rem 0;
|
||||
margin: 0 0 1.5rem 0;
|
||||
padding-left: 1.25rem;
|
||||
}
|
||||
|
||||
ol {
|
||||
margin: 1rem 0;
|
||||
margin: 0 0 1.5rem 0;
|
||||
padding-left: 1.75rem;
|
||||
}
|
||||
|
||||
|
|
@ -94,11 +94,29 @@ ol ol {
|
|||
|
||||
ul li::marker {
|
||||
content: '∗\00A0';
|
||||
color: var(--bright-bg);
|
||||
color: var(--muted);
|
||||
}
|
||||
|
||||
ol li::marker {
|
||||
color: var(--bright-bg);
|
||||
color: var(--muted);
|
||||
}
|
||||
|
||||
dt {
|
||||
margin: 0;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
dd {
|
||||
margin: 0 0 0 1.5rem;
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
dd + dt {
|
||||
margin-top: 1.5rem;
|
||||
}
|
||||
|
||||
dl {
|
||||
margin: 0 0 1.5rem 0;
|
||||
}
|
||||
|
||||
/* Blockquotes */
|
||||
|
|
@ -111,7 +129,7 @@ blockquote::before {
|
|||
position: absolute;
|
||||
left: -1.5rem;
|
||||
content: ">";
|
||||
color: var(--bright-bg);
|
||||
color: var(--muted);
|
||||
}
|
||||
|
||||
.twitter-tweet::before {
|
||||
|
|
@ -123,14 +141,15 @@ blockquote::before {
|
|||
/* Code */
|
||||
pre,
|
||||
code,
|
||||
kbd {
|
||||
overflow-x: auto;
|
||||
background: var(--dark-bg) !important;
|
||||
kbd,
|
||||
samp {
|
||||
background: var(--inner-bg) !important;
|
||||
font-family: var(--font-monospace);
|
||||
color: var(--bright-bg);
|
||||
color: var(--off-fg);
|
||||
}
|
||||
|
||||
pre {
|
||||
overflow-x: auto;
|
||||
padding: 1.5rem;
|
||||
margin: 0 0 1.5rem 0;
|
||||
}
|
||||
|
|
@ -144,20 +163,22 @@ strong {
|
|||
/* Highlighting */
|
||||
::selection,
|
||||
mark {
|
||||
background-color: var(--yellow);
|
||||
background-color: var(--highlight);
|
||||
color: var(--bg);
|
||||
}
|
||||
|
||||
/* Other typographic elements */
|
||||
hr {
|
||||
border: 0;
|
||||
margin-bottom: 1.5rem;
|
||||
}
|
||||
|
||||
hr:after {
|
||||
content: '---';
|
||||
color: var(--bright-bg);
|
||||
color: var(--muted);
|
||||
}
|
||||
|
||||
|
||||
/* Prevent super/sub from affecting line height */
|
||||
sup, sub {
|
||||
vertical-align: baseline;
|
||||
|
|
@ -185,3 +206,9 @@ th:first-child, td:first-child {
|
|||
th {
|
||||
text-align: inherit;
|
||||
}
|
||||
|
||||
/* Figures */
|
||||
img {
|
||||
max-width: 100%;
|
||||
height: auto;
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue