feat: Bootstrap icons, new H1 style, symlink README to site index
This commit is contained in:
parent
17ed382092
commit
d39b7f5630
17 changed files with 2288 additions and 242 deletions
162
README.md
162
README.md
|
|
@ -1,162 +0,0 @@
|
|||
# Duckquill
|
||||
|
||||
[](https://nogithub.codeberg.page)
|
||||
[](https://ci.exozy.me/repos/159)
|
||||
|
||||
[Duckquill](https://git.exozy.me/daudix/duckquill) is a modern, pretty, and clean (and very opinionated) [Zola](https://www.getzola.org) theme that has the purpose of greatly simplifying the process of rolling up your blog. It aims to provide all the needed options for comfortable writing, keeping the balance of it being simple.
|
||||
|
||||
> Duckquill is made based on needs of [my website](https://daudix.exozy.me), if you need some feature/configuration that doesn't exist feel free to open an issue or better yet, pull request!
|
||||
|
||||
[](https://i.imgur.com/1fCi1sF.png)
|
||||
|
||||
## Installation
|
||||
|
||||
First, download this theme to your `themes` directory:
|
||||
|
||||
```sh
|
||||
git clone https://git.exozy.me/daudix/duckquill.git themes/duckquill
|
||||
```
|
||||
|
||||
...or add as submodule for easy updating (recommended if you already have git setup on site):
|
||||
|
||||
```sh
|
||||
git submodule init
|
||||
git submodule add https://git.exozy.me/daudix/duckquill.git themes/duckquill
|
||||
```
|
||||
|
||||
and then enable it in your `config.toml`:
|
||||
|
||||
```toml
|
||||
theme = "duckquill"
|
||||
```
|
||||
|
||||
## Options
|
||||
|
||||
Duckquill offers some configuration options to make it fit you better.
|
||||
|
||||
### Custom stylesheets
|
||||
|
||||
You can add your own or override existing styles by creating custom stylesheet and adding it in the `config.toml`:
|
||||
|
||||
```toml
|
||||
[extra]
|
||||
stylesheets = [
|
||||
"YOUR_STYLE.css"
|
||||
]
|
||||
```
|
||||
|
||||
It expects the style to be in the `static` directory. If you are using Sass it will be compiled there anyway.
|
||||
|
||||
If for some reason overridden class are not respected, try using `!important`. You can import styles from Duckquill using `@use "../themes/duckquill/sass/NEEDED_FILE.scss";`.
|
||||
|
||||
### Primary color
|
||||
|
||||
Duckquill respects chosen primary color everywhere, you can use any HEX color code you want
|
||||
|
||||
First, change the primary color in `config.toml`:
|
||||
|
||||
```toml
|
||||
[extra]
|
||||
primary_color = "#HEX_COLOR_CODE"
|
||||
```
|
||||
|
||||
Then, paste the following code inside `sass/custom.scss` (inside your site, not the theme):
|
||||
|
||||
```sass
|
||||
@use "sass:color";
|
||||
|
||||
$primary-color: #HEX_COLOR_CODE;
|
||||
$primary-color-alpha: color.scale($primary-color, $alpha: -80%);
|
||||
|
||||
$bg-color-l: color.mix($primary-color, rgb(250, 250, 250), 10%);
|
||||
$bg-color-d: color.mix($primary-color, rgb(11, 11, 11), 5%);
|
||||
|
||||
$crt-bg: radial-gradient(
|
||||
color.scale($primary-color, $lightness: -80%),
|
||||
color.scale($primary-color, $lightness: -90%)
|
||||
);
|
||||
|
||||
$glow: 0 0 0 1px color.scale($primary-color, $alpha: -95%),
|
||||
0 2px 6px 2px color.scale($primary-color, $alpha: -95%),
|
||||
0 4px 24px 4px color.scale($primary-color, $alpha: -90%);
|
||||
|
||||
:root {
|
||||
--bg-color: #{$bg-color-l};
|
||||
--crt-bg: #{$crt-bg};
|
||||
--primary-color-alpha: #{$primary-color-alpha};
|
||||
--primary-color: #{$primary-color};
|
||||
--glow: #{$glow};
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
:root {
|
||||
--bg-color: #{$bg-color-d};
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
Set any color in `$primary-color` and reload, the primary color should be used now. This is a hack that is needed until Zola will be able to use `config.toml` inside Sass.
|
||||
|
||||
### `[extra]` variables:
|
||||
|
||||
- `primary_color`: Primary color used in some browsers set in metadata, see [#primary-color](https://git.exozy.me/daudix/duckquill#primary-color)
|
||||
- `animated_favicon`: Specify if the favicon are animated GIF (true, false)
|
||||
- `date_format`: Allows setting custom date format in [Tera](https://keats.github.io/tera) format, all available variables are listed [here](https://docs.rs/chrono/0.4.31/chrono/format/strftime/index.html). Does not apply to comments
|
||||
- `hosting`: Where the website source are located, used on 404 page
|
||||
- `issues_url`: Link to site bug tracker, if present
|
||||
- `source_url`: Link to site source (not built site)
|
||||
|
||||
### `[extra.nav]` variables:
|
||||
|
||||
- `show_feed`: Whether to display "Feed" link
|
||||
- `nav_links`: Links used in navigation bar
|
||||
|
||||
The `nav_links` are set like the following:
|
||||
|
||||
```toml
|
||||
[extra]
|
||||
nav_links = [
|
||||
{url = "https://example.org", name = "Example"},
|
||||
{url = "https://mstdn.social", name = "Mastodon"},
|
||||
]
|
||||
```
|
||||
|
||||
### `[extra.footer]` variables:
|
||||
|
||||
- `johnvert_ref`: Site URL without `https://` part or trailing slashes, e.g `example.org`. Works only if `show_johnvert` are set to `true`
|
||||
- `show_copyright`: Whether to display `© Duckquill, 2023`. (true, false)
|
||||
- `show_johnvert`: Whether to display [Johnvertisement](https://john.citrons.xyz). (true, false)
|
||||
- `show_powered_by`: Whether to display `Powered by Zola and Duckquill`. (true, false)
|
||||
- `show_source`: Whether to display `Website source` link. (true, false)
|
||||
|
||||
### `[extra.comments]` variables:
|
||||
|
||||
- `host`: Mastodon home server, e.g `mstdn.social`
|
||||
- `user`: Mastodon username, e.g `Daudix`
|
||||
- `token`: Mastodon app token, e.g `jTNX9pAV8XEPBby0cPWF6CmGY60kkIy4vidggfxXmoQ`. Can be left empty, but in this case only first 60 comments will be loaded, instructions on how to get one are available [here](https://github.com/cassidyjames/cassidyjames.github.io/blob/47c449a0083113ea5be8d215beb6650ac64929e4/_config.yaml#L48-L52)
|
||||
|
||||
These values are also used in the `<head>` for Mastodon verification.
|
||||
|
||||
## Test pages
|
||||
|
||||
- [Demo page](https://duckquill.exozy.me/demo)
|
||||
- [Cake Party!](https://duckquill.exozy.me/demo/page)
|
||||
- [ActivityPub/Fediverse comments demo](https://duckquill.exozy.me/demo/comments)
|
||||
|
||||
## Contribute
|
||||
|
||||
If you want to improve Duckquill in any way, feel free to open an issue, or even better, a pull request! I'm happy about every contribution!
|
||||
|
||||
The main repo is https://git.exozy.me/daudix/duckquill, but since only exozy.me members can open issues and pull requests, there is two-way mirror at https://next.forgejo.org/daudix-UFO/duckquill, you can open issues and pull requests there just fine.
|
||||
|
||||
## Credits
|
||||
|
||||
- [Quill image used in the metadata card](https://commons.wikimedia.org/wiki/File:3quills.jpg)
|
||||
|
||||
## Special thanks ♥
|
||||
|
||||
- [Jakub Steiner](https://jimmac.eu) for an awesome [OS Component Website](https://jimmac.github.io/os-component-website), on top of which this whole thing is built
|
||||
- [Cassidy James](https://cassidyjames.com) for an awesome [Mastodon-powered Comments](https://cassidyjames.com/blog/fediverse-blog-comments-mastodon)
|
||||
- [Mehdi](https://codepen.io/meduzen) for an awesome [CSS Scanlines](https://codepen.io/meduzen/pen/zxbwRV)
|
||||
- dwb, ejm and jgs for awesome ASCII art
|
||||
- Everyone who supported me and said good stuff <3
|
||||
1
README.md
Symbolic link
1
README.md
Symbolic link
|
|
@ -0,0 +1 @@
|
|||
/var/home/daudix/duckquill/content/_index.md
|
||||
|
|
@ -32,9 +32,9 @@ source_url = "https://git.exozy.me/daudix/duckquill"
|
|||
[extra.nav]
|
||||
show_feed = true
|
||||
links = [
|
||||
{url = "https://git.exozy.me/daudix/duckquill", name = "Repo"},
|
||||
{url = "/demo", name = "Demo"},
|
||||
{url = "/blog", name = "Blog"},
|
||||
{url = "https://git.exozy.me/daudix/duckquill", name = "Repo", icon = "git"},
|
||||
{url = "/demo", name = "Demo", icon = "car-front-fill"},
|
||||
{url = "/blog", name = "Blog", icon = "journal-bookmark-fill"},
|
||||
]
|
||||
|
||||
[extra.footer]
|
||||
|
|
|
|||
|
|
@ -12,6 +12,9 @@ jgs~^~^`---'~^~^~^`---'~^~^~^`---'~^~^~^`---'~^~^~^`---'~^~^~
|
|||
|
||||
# Duckquill
|
||||
|
||||
<a href="https://nogithub.codeberg.page"><img class="transparent no-hover" style="display:inline-block;" alt="Please don't upload to GitHub" src="https://nogithub.codeberg.page/badge.svg" /></a>
|
||||
<a href="https://ci.exozy.me/repos/159"><img class="transparent no-hover" style="display:inline-block;" alt="status-badge" src="https://ci.exozy.me/api/badges/159/status.svg" /></a>
|
||||
|
||||
[Duckquill](https://codeberg.org/daudix-UFO/duckquill) is a modern, pretty, and clean (and very opinionated) [Zola](https://www.getzola.org) theme that has the purpose of greatly simplifying the process of rolling up your blog. It aims to provide all the needed options for comfortable writing, keeping the balance of it being simple.
|
||||
|
||||
Edit a bit of metadata and tweak some of the included graphics and have a blog up in minutes!
|
||||
|
|
@ -20,48 +23,157 @@ Edit a bit of metadata and tweak some of the included graphics and have a blog u
|
|||
- For a very pleasant look, the colors are tinted with the primary color.
|
||||
- Proper favicon for modern browsers and Apple device icons.
|
||||
- Mastodon, Lemmy and other social media meta cards for easy sharing. Try [Share Preview](https://apps.gnome.org/SharePreview/) to test.
|
||||
- Local copy of the amazing [Inter](https://rsms.me/inter/) and [JetBrains Mono](https://www.jetbrains.com/lp/mono/) fonts. No slowdowns pulling from external hosting.
|
||||
- Local copy of the amazing [Inter](https://rsms.me/inter/) and [JetBrains Mono](https://www.jetbrains.com/lp/mono/) fonts, plus [Bootstrap Icons](https://icons.getbootstrap.com). No slowdowns pulling from external hosting.
|
||||
- Mobile friendly, with proper dark variant.
|
||||
- [Mastodon-powered comments](https://cassidyjames.com/blog/fediverse-blog-comments-mastodon). Comment using any ActivityPub service by replying to Mastodon post.
|
||||
|
||||
> See [demo](@/demo/index.md) for showcase of all Duckquill possibilities. Oh and [comments demo](@/demo/comments.md) for showcase of Mastodon-powered comments.
|
||||
> Duckquill is made based on needs of [my website](https://daudix.exozy.me), if you need some feature/configuration that doesn't exist feel free to open an issue or better yet, pull request!
|
||||
|
||||
Make yourself a cup of your <abbr title="Coffee, tea, or water">favorite drink</abbr> and let's start!
|
||||
## Installation
|
||||
|
||||
## Getting started
|
||||
|
||||
> If you already have Zola site with Git skip to step #3
|
||||
|
||||
Setting up Zola blog with Duckquill is very simple and consists of the following steps:
|
||||
|
||||
1. [Install Zola](https://www.getzola.org/documentation/getting-started/installation/) and create default site:
|
||||
First, download this theme to your `themes` directory:
|
||||
|
||||
```sh
|
||||
zola init blog
|
||||
git clone https://git.exozy.me/daudix/duckquill.git themes/duckquill
|
||||
```
|
||||
|
||||
2. Initialize Git:
|
||||
|
||||
```sh
|
||||
git init
|
||||
```
|
||||
|
||||
3. Add Duckquill as Git submodule for easy updating:
|
||||
...or add as submodule for easy updating (recommended if you already have git setup on site):
|
||||
|
||||
```sh
|
||||
git submodule init
|
||||
git submodule add https://git.exozy.me/daudix/duckquill.git themes/duckquill
|
||||
```
|
||||
|
||||
4. Edit `config.toml` and enable Duckquill theme:
|
||||
and then enable it in your `config.toml`:
|
||||
|
||||
```toml
|
||||
theme = "duckquill"
|
||||
```
|
||||
|
||||
Voilà! now it's just a matter of changing some settings and writing your first post.
|
||||
## Options
|
||||
|
||||
See project's [README](https://codeberg.org/daudix-UFO/duckquill#duckquill) for all available configuration variables and [Zola docs](https://www.getzola.org/documentation/) for everything else.
|
||||
Duckquill offers some configuration options to make it fit you better.
|
||||
|
||||
### Custom stylesheets
|
||||
|
||||
You can add your own or override existing styles by creating custom stylesheet and adding it in the `config.toml`:
|
||||
|
||||
```toml
|
||||
[extra]
|
||||
stylesheets = [
|
||||
"YOUR_STYLE.css"
|
||||
]
|
||||
```
|
||||
|
||||
It expects the style to be in the `static` directory. If you are using Sass it will be compiled there anyway.
|
||||
|
||||
If for some reason overridden class are not respected, try using `!important`. You can import styles from Duckquill using `@use "../themes/duckquill/sass/NEEDED_FILE.scss";`.
|
||||
|
||||
### Primary color
|
||||
|
||||
Duckquill respects chosen primary color everywhere, you can use any HEX color code you want
|
||||
|
||||
First, change the primary color in `config.toml`:
|
||||
|
||||
```toml
|
||||
[extra]
|
||||
primary_color = "#HEX_COLOR_CODE"
|
||||
```
|
||||
|
||||
Then, paste the following code inside `sass/custom.scss` (inside your site, not the theme):
|
||||
|
||||
```sass
|
||||
@use "sass:color";
|
||||
|
||||
$primary-color: #HEX_COLOR_CODE;
|
||||
$primary-color-alpha: color.scale($primary-color, $alpha: -80%);
|
||||
|
||||
$bg-color-l: color.mix($primary-color, rgb(250, 250, 250), 10%);
|
||||
$bg-color-d: color.mix($primary-color, rgb(11, 11, 11), 5%);
|
||||
|
||||
$crt-bg: radial-gradient(
|
||||
color.scale($primary-color, $lightness: -80%),
|
||||
color.scale($primary-color, $lightness: -90%)
|
||||
);
|
||||
|
||||
$glow: 0 0 0 1px color.scale($primary-color, $alpha: -95%),
|
||||
0 2px 6px 2px color.scale($primary-color, $alpha: -95%),
|
||||
0 4px 24px 4px color.scale($primary-color, $alpha: -90%);
|
||||
|
||||
:root {
|
||||
--bg-color: #{$bg-color-l};
|
||||
--crt-bg: #{$crt-bg};
|
||||
--primary-color-alpha: #{$primary-color-alpha};
|
||||
--primary-color: #{$primary-color};
|
||||
--glow: #{$glow};
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
:root {
|
||||
--bg-color: #{$bg-color-d};
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
Set any color in `$primary-color` and reload, the primary color should be used now. This is a hack that is needed until Zola will be able to use `config.toml` inside Sass.
|
||||
|
||||
### `[extra]` variables:
|
||||
|
||||
- `primary_color`: Primary color used in some browsers set in metadata, see [#primary-color](https://git.exozy.me/daudix/duckquill#primary-color)
|
||||
- `animated_favicon`: Specify if the favicon are animated GIF (true, false)
|
||||
- `date_format`: Allows setting custom date format in [Tera](https://keats.github.io/tera) format, all available variables are listed [here](https://docs.rs/chrono/0.4.31/chrono/format/strftime/index.html). Does not apply to comments
|
||||
- `hosting`: Where the website source are located, used on 404 page
|
||||
- `issues_url`: Link to site bug tracker, if present
|
||||
- `source_url`: Link to site source (not built site)
|
||||
|
||||
### `[extra.nav]` variables:
|
||||
|
||||
- `show_feed`: Whether to display "Feed" link
|
||||
- `nav_links`: Links used in navigation bar
|
||||
|
||||
The `nav_links` are set like the following:
|
||||
|
||||
```toml
|
||||
[extra]
|
||||
nav_links = [
|
||||
{url = "https://example.org", name = "Example"},
|
||||
{url = "https://mstdn.social", name = "Mastodon", icon = "mastodon"},
|
||||
]
|
||||
```
|
||||
|
||||
You can set any icon from [Bootstrap Icons](https://icons.getbootstrap.com) for the navigation items, simply add the `icon` variable and put icon name there, without `bi-` prefix, since it's added automatically :)
|
||||
|
||||
### `[extra.footer]` variables:
|
||||
|
||||
- `johnvert_ref`: Site URL without `https://` part or trailing slashes, e.g `example.org`. Works only if `show_johnvert` are set to `true`
|
||||
- `show_copyright`: Whether to display `© Duckquill, 2023`. (true, false)
|
||||
- `show_johnvert`: Whether to display [Johnvertisement](https://john.citrons.xyz). (true, false)
|
||||
- `show_powered_by`: Whether to display `Powered by Zola and Duckquill`. (true, false)
|
||||
- `show_source`: Whether to display `Website source` link. (true, false)
|
||||
|
||||
### `[extra.comments]` variables:
|
||||
|
||||
- `host`: Mastodon home server, e.g `mstdn.social`
|
||||
- `user`: Mastodon username, e.g `Daudix`
|
||||
- `token`: Mastodon app token, e.g `jTNX9pAV8XEPBby0cPWF6CmGY60kkIy4vidggfxXmoQ`. Can be left empty, but in this case only first 60 comments will be loaded, instructions on how to get one are available [here](https://github.com/cassidyjames/cassidyjames.github.io/blob/47c449a0083113ea5be8d215beb6650ac64929e4/_config.yaml#L48-L52)
|
||||
|
||||
These values are also used in the `<head>` for Mastodon verification.
|
||||
|
||||
## Test pages
|
||||
|
||||
- [Demo page](https://duckquill.exozy.me/demo)
|
||||
- [Cake Party!](https://duckquill.exozy.me/demo/page)
|
||||
- [ActivityPub/Fediverse comments demo](https://duckquill.exozy.me/demo/comments)
|
||||
|
||||
## Contribute
|
||||
|
||||
If you want to improve Duckquill in any way, feel free to open an issue, or even better, a pull request! I'm happy about every contribution!
|
||||
|
||||
The main repo is https://git.exozy.me/daudix/duckquill, but since only exozy.me members can open issues and pull requests, there is two-way mirror at https://next.forgejo.org/daudix-UFO/duckquill, you can open issues and pull requests there just fine.
|
||||
|
||||
## Credits
|
||||
|
||||
- [Quill image used in the metadata card](https://commons.wikimedia.org/wiki/File:3quills.jpg)
|
||||
|
||||
## Special thanks ♥
|
||||
|
||||
|
|
|
|||
|
|
@ -167,7 +167,13 @@ Variables should be comma-separated and be inside the brackets.
|
|||
{{/* image(url="image.png", alt="This is an image" no_hover=true) */}}
|
||||
```
|
||||
|
||||
{{ image(url="https://i.imgur.com/Fr1ImW9.png", alt="Portal Gun blueprint", no_hover=true) }}
|
||||
{{ image(url="https://i1.theportalwiki.net/img/2/23/Ashpd_blueprint.jpg", alt="Portal Gun blueprint", no_hover=true) }}
|
||||
|
||||
<figcaption>Image with an alt text and without zoom on hover</figcaption>
|
||||
|
||||
{{ image(url="https://upload.wikimedia.org/wikipedia/commons/b/b4/JPEG_example_JPG_RIP_100.jpg", url_min="https://upload.wikimedia.org/wikipedia/commons/3/38/JPEG_example_JPG_RIP_010.jpg", alt="The gravestone of J.P.G.", no_hover=true) }}
|
||||
|
||||
<figcaption>Image with compressed version, an alt text, and without zoom on hover</figcaption>
|
||||
|
||||
#### Video
|
||||
|
||||
|
|
@ -179,6 +185,8 @@ Same as images, but with a few differences: `no_hover` and `url_min` are not ava
|
|||
|
||||
{{ video(url="https://interactive-examples.mdn.mozilla.net/media/cc0-videos/flower.webm", alt="Red flower wakes up") }}
|
||||
|
||||
<figcaption>WebM video example from MDN</figcaption>
|
||||
|
||||
#### CRT
|
||||
|
||||
Alright, this one doesn't simplify anything, it just adds a CRT-like effect around Markdown code blocks.
|
||||
|
|
@ -190,6 +198,7 @@ Alright, this one doesn't simplify anything, it just adds a CRT-like effect arou
|
|||
```
|
||||
|
||||
{% crt() %}
|
||||
|
||||
```
|
||||
_____________________________________________
|
||||
|.'', Public_Library_Halls ,''.|
|
||||
|
|
@ -212,6 +221,7 @@ Alright, this one doesn't simplify anything, it just adds a CRT-like effect arou
|
|||
|.',' /%%%%%%%%%%%%%%%\ ','.|
|
||||
|;____________/%%%%%Spicer%%%%%%\____________;|
|
||||
```
|
||||
|
||||
{% end %}
|
||||
|
||||
## Captions
|
||||
|
|
@ -220,10 +230,12 @@ Media can have additional text description using the `<figcaption>` HTML tag.
|
|||
|
||||
```markdown
|
||||
|
||||
|
||||
<figcaption>The image caption</figcaption>
|
||||
```
|
||||
|
||||
|
||||
|
||||
|
||||
<figcaption>The Office where Stanley works, it has yellow floor and beige walls</figcaption>
|
||||
|
||||
## Accordion
|
||||
|
|
@ -233,7 +245,7 @@ Media can have additional text description using the `<figcaption>` HTML tag.
|
|||
|
||||
_Quack-quack!_
|
||||
|
||||
|
||||
|
||||
|
||||
</details>
|
||||
|
||||
|
|
@ -251,7 +263,7 @@ The <abbr title="American Standard Code for Information Interchange">ASCII</abbr
|
|||
<kbd>⌘ Super</kbd> + <kbd>Space</kbd>
|
||||
```
|
||||
|
||||
<kbd>⌘ Super</kbd> + <kbd>Space</kbd>
|
||||
To switch the keyboard layout, press <kbd>⌘ Super</kbd> + <kbd>Space</kbd>.
|
||||
|
||||
## Highlighted
|
||||
|
||||
|
|
|
|||
|
|
@ -1,9 +1,9 @@
|
|||
+++
|
||||
+++
|
||||
|
||||
# Welcome to the cake party!
|
||||
# Welcome to the cake party
|
||||
|
||||
<img class="transparent no-hover" style="width:50%" src="https://i.imgur.com/ZS4LFj8.png"/>
|
||||
<img class="transparent no-hover" style="width:50%" src="https://i1.theportalwiki.net/img/0/0a/Portal_Cake.png"/>
|
||||
|
||||
Sadly, the cake is a _lie_
|
||||
|
||||
|
|
|
|||
|
|
@ -86,7 +86,14 @@ h6 {
|
|||
}
|
||||
|
||||
h1 {
|
||||
font-size: 2rem;
|
||||
letter-spacing: -0.08rem;
|
||||
font-weight: 900;
|
||||
font-size: 3rem;
|
||||
}
|
||||
|
||||
h1::after {
|
||||
content: ".";
|
||||
color: var(--primary-color);
|
||||
}
|
||||
|
||||
h2 {
|
||||
|
|
@ -130,11 +137,15 @@ dl dd {
|
|||
}
|
||||
|
||||
hr {
|
||||
background-color: var(--primary-color);
|
||||
height: 0.3rem;
|
||||
margin: 3rem auto 4rem;
|
||||
width: 40%;
|
||||
opacity: 40%;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
// background-image: repeating-linear-gradient(-45deg, transparent, transparent 8px, var(--primary-color) 8px, var(--primary-color) 10px);
|
||||
|
||||
blockquote {
|
||||
padding: 0 1rem;
|
||||
margin-left: 0;
|
||||
|
|
@ -161,14 +172,13 @@ abbr {
|
|||
|
||||
kbd {
|
||||
display: inline-block;
|
||||
line-height: normal;
|
||||
font-family: "JetBrains Mono", monospace;
|
||||
padding: 2px 6px;
|
||||
border-radius: var(--rounded-corner-small);
|
||||
background-color: var(--fg07);
|
||||
box-shadow: inset 0 -2px 0 var(--fg09);
|
||||
font-size: 0.8rem;
|
||||
box-shadow: inset 0 -2px 0 var(--fg09), 0 -1px 0 var(--fg09);
|
||||
cursor: pointer;
|
||||
user-select: none;
|
||||
-webkit-user-select: none;
|
||||
}
|
||||
|
||||
// small nice thingy, keys can be pressed!
|
||||
|
|
@ -272,6 +282,11 @@ img:not(.no-hover):hover {
|
|||
box-shadow: none;
|
||||
}
|
||||
|
||||
// bootstrap icons
|
||||
.bi {
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
// NAVBAR
|
||||
.site-nav {
|
||||
z-index: 1;
|
||||
|
|
@ -320,9 +335,9 @@ img:not(.no-hover):hover {
|
|||
font-size: 1.2rem;
|
||||
}
|
||||
|
||||
svg {
|
||||
transform: translateY(-0.125rem) translateX(-0.125rem); // fix icon position
|
||||
}
|
||||
// svg {
|
||||
// transform: translateY(-0.125rem) translateX(-0.125rem); // fix icon position
|
||||
// }
|
||||
}
|
||||
|
||||
@media only screen and (max-device-width: 480px) {
|
||||
|
|
|
|||
2090
sass/bootstrap-icons.scss
vendored
Normal file
2090
sass/bootstrap-icons.scss
vendored
Normal file
File diff suppressed because it is too large
Load diff
|
|
@ -16,5 +16,6 @@
|
|||
@use "main";
|
||||
@use "comments";
|
||||
@use "scanlines";
|
||||
@use "bootstrap-icons";
|
||||
@import "syntax-theme-dark.css" (prefers-color-scheme: dark);
|
||||
@import "syntax-theme-light.css" (prefers-color-scheme: light);
|
||||
|
|
|
|||
BIN
static/fonts/bootstrap-icons.woff
Normal file
BIN
static/fonts/bootstrap-icons.woff
Normal file
Binary file not shown.
BIN
static/fonts/bootstrap-icons.woff2
Normal file
BIN
static/fonts/bootstrap-icons.woff2
Normal file
Binary file not shown.
|
|
@ -1,7 +1,7 @@
|
|||
{% extends "base.html" %}
|
||||
|
||||
{% block content %}
|
||||
<img src="404.png" class="full pixels transparent no-hover" />
|
||||
<img src="{{ get_url(path='404.png') }}" class="full pixels transparent no-hover" />
|
||||
|
||||
<h1>Document Not Found</h1>
|
||||
|
||||
|
|
|
|||
|
|
@ -13,13 +13,8 @@
|
|||
{%- for name, taxon in page.taxonomies %}
|
||||
•
|
||||
{%- for item in taxon %}
|
||||
<a class="link-tag" href="{{ get_taxonomy_url(kind=name, name=item) }}">
|
||||
<svg class="link-icon" viewBox="0 0 16 16" width="16" height="16">
|
||||
<path
|
||||
fill="currentColor"
|
||||
d="M4 0C1.785 0 0 1.785 0 4v3.09c0 .847.336 1.66.938 2.262l5.382 5.382c.93.934 2.43.934 3.36 0l4.965-4.964c.98-.98.98-2.56 0-3.54L9.227.812A2.777 2.777 0 0 0 7.266 0H4zm0 2h3.266c.207 0 .402.082.546.227l5.418 5.418a.512.512 0 0 1 0 .71L8.266 13.32a.38.38 0 0 1-.532 0L2.352 7.937A1.198 1.198 0 0 1 2 7.09V4c0-1.098.902-2 2-2zm.5 1a1.5 1.5 0 1 0 0 3 1.5 1.5 0 0 0 0-3z"
|
||||
/>
|
||||
</svg>
|
||||
<a href="{{ get_taxonomy_url(kind=name, name=item) }}">
|
||||
<i class="bi bi-tag-fill"></i>
|
||||
{{ item }}
|
||||
</a>
|
||||
{%- endfor %}
|
||||
|
|
|
|||
|
|
@ -28,13 +28,8 @@
|
|||
{%- for name, taxon in page.taxonomies %}
|
||||
•
|
||||
{%-for item in taxon %}
|
||||
<a class="link-tag" href="{{ get_taxonomy_url(kind=name, name=item) }}">
|
||||
<svg class="link-icon" viewBox="0 0 16 16" width="16" height="16">
|
||||
<path
|
||||
fill="currentColor"
|
||||
d="M4 0C1.785 0 0 1.785 0 4v3.09c0 .847.336 1.66.938 2.262l5.382 5.382c.93.934 2.43.934 3.36 0l4.965-4.964c.98-.98.98-2.56 0-3.54L9.227.812A2.777 2.777 0 0 0 7.266 0H4zm0 2h3.266c.207 0 .402.082.546.227l5.418 5.418a.512.512 0 0 1 0 .71L8.266 13.32a.38.38 0 0 1-.532 0L2.352 7.937A1.198 1.198 0 0 1 2 7.09V4c0-1.098.902-2 2-2zm.5 1a1.5 1.5 0 1 0 0 3 1.5 1.5 0 0 0 0-3z"
|
||||
/>
|
||||
</svg>
|
||||
<a href="{{ get_taxonomy_url(kind=name, name=item) }}">
|
||||
<i class="bi bi-tag-fill"></i>
|
||||
{{ item }}
|
||||
</a>
|
||||
{%- endfor %}
|
||||
|
|
|
|||
|
|
@ -11,10 +11,10 @@
|
|||
{% else %} {{ config.title }} {% endif %}
|
||||
</title>
|
||||
|
||||
<link href="{{ get_url(path='style.css') }}" rel="stylesheet" />
|
||||
<link rel="stylesheet" href="{{ get_url(path='style.css') }}" />
|
||||
{% if config.extra.stylesheets %}
|
||||
{% for stylesheet in config.extra.stylesheets %}
|
||||
<link href="{{ get_url(path=stylesheet) }}" rel="stylesheet" />
|
||||
<link rel="stylesheet" href="{{ get_url(path=stylesheet) }}" />
|
||||
{% endfor %}
|
||||
{% endif %}
|
||||
|
||||
|
|
|
|||
|
|
@ -6,18 +6,18 @@
|
|||
<ul>
|
||||
{% for link in config.extra.nav.links %}
|
||||
<li>
|
||||
<a href="{{ link.url }}">{{ link.name }}</a>
|
||||
<a href="{{ link.url }}">
|
||||
{% if link.icon %}
|
||||
<i class="bi bi-{{ link.icon }}"></i>
|
||||
{% endif %}
|
||||
{{ link.name }}
|
||||
</a>
|
||||
</li>
|
||||
{% endfor %}
|
||||
{% if config.extra.nav.show_feed %}
|
||||
<li>
|
||||
<a href="{{ config.base_url }}/atom.xml">
|
||||
<svg class="link-icon" viewBox="0 0 16 16" width="16" height="16">
|
||||
<path
|
||||
fill="currentColor"
|
||||
d="M1.988 1.988V3c.008.547.453.984 1 .988.004-.004.008-.004.012-.004v.028A8.977 8.977 0 0 1 11.988 13a.991.991 0 0 0 1 .984h1V13h-.004c0-.004 0-.004.004-.008C13.984 7.02 9.184 2.148 3.242 2.02A1.004 1.004 0 0 0 3 1.988v-.004zm0 4V7c.008.547.453.984 1 .988.004-.004.008-.004.012-.004V8a4.985 4.985 0 0 1 4.996 4.844 1.002 1.002 0 0 0 .988 1.145c.008-.005.012-.005.016-.005v.004h.984V13H10c0-3.793-3.047-6.898-6.82-6.992 0-.004-.004-.004-.004-.004A.892.892 0 0 0 3 5.988v-.004zm2 4a1.999 1.999 0 1 0-.002 3.998 1.999 1.999 0 0 0 .002-3.998zm0 0"
|
||||
/>
|
||||
</svg>
|
||||
<i class="bi bi-rss-fill"></i>
|
||||
Feed
|
||||
</a>
|
||||
</li>
|
||||
|
|
|
|||
|
|
@ -8,16 +8,8 @@
|
|||
<br />
|
||||
{% for tag in terms %}
|
||||
<small>
|
||||
<a
|
||||
class="link-tag"
|
||||
href="{{ get_taxonomy_url(kind='tags', name=tag.name) }}"
|
||||
>
|
||||
<svg class="link-icon" viewBox="0 0 16 16" width="16" height="16">
|
||||
<path
|
||||
fill="currentColor"
|
||||
d="M4 0C1.785 0 0 1.785 0 4v3.09c0 .847.336 1.66.938 2.262l5.382 5.382c.93.934 2.43.934 3.36 0l4.965-4.964c.98-.98.98-2.56 0-3.54L9.227.812A2.777 2.777 0 0 0 7.266 0H4zm0 2h3.266c.207 0 .402.082.546.227l5.418 5.418a.512.512 0 0 1 0 .71L8.266 13.32a.38.38 0 0 1-.532 0L2.352 7.937A1.198 1.198 0 0 1 2 7.09V4c0-1.098.902-2 2-2zm.5 1a1.5 1.5 0 1 0 0 3 1.5 1.5 0 0 0 0-3z"
|
||||
/>
|
||||
</svg>
|
||||
<a href="{{ get_taxonomy_url(kind='tags', name=tag.name) }}">
|
||||
<i class="bi bi-tag-fill"></i>
|
||||
{{ tag.name }}
|
||||
</a>
|
||||
<br />
|
||||
|
|
|
|||
|
|
@ -22,13 +22,8 @@
|
|||
{%- for name, taxon in page.taxonomies %}
|
||||
•
|
||||
{%- for item in taxon %}
|
||||
<a class="link-tag" href="{{ get_taxonomy_url(kind=name, name=item) }}">
|
||||
<svg class="link-icon" viewBox="0 0 16 16" width="16" height="16">
|
||||
<path
|
||||
fill="currentColor"
|
||||
d="M4 0C1.785 0 0 1.785 0 4v3.09c0 .847.336 1.66.938 2.262l5.382 5.382c.93.934 2.43.934 3.36 0l4.965-4.964c.98-.98.98-2.56 0-3.54L9.227.812A2.777 2.777 0 0 0 7.266 0H4zm0 2h3.266c.207 0 .402.082.546.227l5.418 5.418a.512.512 0 0 1 0 .71L8.266 13.32a.38.38 0 0 1-.532 0L2.352 7.937A1.198 1.198 0 0 1 2 7.09V4c0-1.098.902-2 2-2zm.5 1a1.5 1.5 0 1 0 0 3 1.5 1.5 0 0 0 0-3z"
|
||||
/>
|
||||
</svg>
|
||||
<a href="{{ get_taxonomy_url(kind=name, name=item) }}">
|
||||
<i class="bi bi-tag-fill"></i>
|
||||
{{ item }}
|
||||
</a>
|
||||
{%- endfor %}
|
||||
|
|
|
|||
Loading…
Reference in a new issue