feat(thebook): book (the web documentation) for presenterm

This commit is contained in:
pwnwriter 2024-01-10 08:56:31 +05:45 committed by Matias Fontanini
parent a014f837c6
commit d8112f6d67
24 changed files with 1634 additions and 46 deletions

36
.github/workflows/mdbook-build.yml vendored Normal file
View File

@ -0,0 +1,36 @@
name: MdBook Build and Deploy
on:
push:
branches:
- main
pull_request:
permissions:
contents: write
jobs:
build-and-deploy:
runs-on: ubuntu-latest
steps:
- name: Checkout code
uses: actions/checkout@v3
- name: Install MdBook
run: |
curl -sSL -o /tmp/mdbook.tar.gz https://github.com/rust-lang/mdBook/releases/download/v0.4.36/mdbook-v0.4.36-x86_64-unknown-linux-gnu.tar.gz
tar -xf /tmp/mdbook.tar.gz -C /usr/local/bin
mdbook --version
- name: Build the book
run: |
mdbook build
- name: Deploy build to gh-pages branch
uses: crazy-max/ghaction-github-pages@v4
with:
target_branch: book
build_dir: book
env:
GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

View File

@ -9,50 +9,51 @@ _presenterm_ lets you create presentations in markdown format and render them in
This is how the [demo presentation](examples/demo.md) looks like:
![](assets/demo.gif)
![](/docs/src/assets/demo.gif)
# Installation
The recommended way to install _presenterm_ is to download the latest pre-built version for your system from the
[releases](https://github.com/mfontanini/presenterm/releases) page.
For other alternative ways to install it, visit the [installation](/docs/install.md) docs.
For other alternative ways to install it, visit the [installation](/docs/src/guides/installation.md) docs.
# Features
* Define your presentation in a single markdown file.
* [Image rendering support](/docs/intro.md#images) for _iterm2_, terminals that support the _kitty_ graphics protocol,
and _sixel_.
* [Customize your presentation's look](/docs/themes.md) by defining themes, including colors, margins, layout
* [Image rendering support](/docs/src/guides/introduction.md#images) for _iterm2_, terminals that support the _kitty_
graphics protocol, and _sixel_.
* [Customize your presentation's look](/docs/src/guides/themes.md) by defining themes, including colors, margins, layout
(left/center aligned content), footer for every slide, etc.
* Code highlighting for a [wide list of programming languages](/docs/highlighting.md).
* [Selective/dynamic](/docs/highlighting.md#selective-highlighting) code highlighting such that only a subset of the
lines are highlighted at a time, and different sets of lines are highlighted as you move your slides forward.
* Configurable [column layouts](/docs/layouts.md) that let you structure parts of your slide into columns.
* Support for [_LaTeX_ and _typst_ code block rendering](/docs/latex.md) so you can define formulas as text and have
them automatically render as images when rendering a presentation.
* Support for an [introduction slide](/docs/intro.md#introduction-slide) that displays the presentation title and your
name.
* Support for [slide titles](/docs/intro.md#slide-titles).
* Support for [shell code execution](/docs/highlighting.md#executing-code).
* Support for [generating PDF files](/docs/pdf-export.md) from presentations to share with other people.
* Support for [pauses](/docs/intro.md#pauses) in between each slide so that it progressively renders for a more
interactive presentation.
* Code highlighting for a [wide list of programming languages](/docs/src/guides/code-highlight.md).
* [Selective/dynamic](/docs/src/guides/code-highlight.md#selective-highlighting) code highlighting such that only a
subset of the lines are highlighted at a time, and different sets of lines are highlighted as you move your slides
forward.
* Configurable [column layouts](/docs/src/guides/layout.md) that let you structure parts of your slide into columns.
* Support for [_LaTeX_ and _typst_ code block rendering](/docs/src/guides/latex.md) so you can define formulas as text
and have them automatically render as images when rendering a presentation.
* Support for an [introduction slide](/docs/src/guides/introduction.md#introduction-slide) that displays the
presentation title and your name.
* Support for [slide titles](/docs/src/guides/introduction.md#slide-titles).
* Support for [shell code execution](/docs/src/guides/code-highlight.md#executing-code).
* Support for [generating PDF files](/docs/src/guides/pdf-export.md) from presentations to share with other people.
* Support for [pauses](/docs/src/guides/introduction.md#pauses) in between each slide so that it progressively renders
for a more interactive presentation.
* Automatically reload your presentation every time it changes for a fast development loop.
* [Terminal colored themes](/docs/themes.md#built-in-themes) that use your terminal's color scheme. This means if your
terminal uses transparent backgrounds or images as background, those will be implicitly set as the background of your
presentation.
* [Terminal colored themes](/docs/src/guides/themes.md#built-in-themes) that use your terminal's color scheme. This
means if your terminal uses transparent backgrounds or images as background, those will be implicitly set as the
background of your presentation.
See the [introduction page](/docs/intro.md) to learn more.
See the [introduction page](/docs/src/guides/introduction.md) to learn more.
## Images
Images are supported if you're using iterm2, a terminal the supports the kitty graphics protocol (such as
[kitty](https://sw.kovidgoyal.net/kitty/), of course), or one that supports sixel.
![](assets/demo-image.png)
![](/docs/src/assets/demo-image.png)
Read more about images [here](/docs/intro.md#images).
Read more about images [here](/docs/src/guides/introduction.md#images).
## Hot reload
@ -68,9 +69,9 @@ how the changes look like.
Column layouts allow you to organize content into columns. You can define 2 or more columns, choose how wide you want
them to be, and then put any content into them. For example:
![](/assets/layouts.png)
![](/docs/src/assets/layouts.png)
See the [documentation](/docs/layouts.md) on layouts to learn more.
See the [documentation](/docs/src/guides/layout.md) on layouts to learn more.
## Shell code execution
@ -79,11 +80,11 @@ In order to do this, annotate the code block with `+exec` (e.g. `bash +exec`). *
[![asciicast](https://asciinema.org/a/1v3IqCEtU9tqDjVj78Pp7SSe2.svg)](https://asciinema.org/a/1v3IqCEtU9tqDjVj78Pp7SSe2)
See more details on this [here](docs/highlighting.md).
See more details on this [here](/docs/src/guides/code-highlight.md).
# Docs
Some docs on how to configure _presenterm_ and how it works internally can be found [here](docs/README.md).
Some docs on how to configure _presenterm_ and how it works internally can be found [here](/docs/src/SUMMARY.md).
# Acknowledgements

1
docs/.gitignore vendored Normal file
View File

@ -0,0 +1 @@
book/

View File

@ -1,17 +0,0 @@
# Docs
This section contains documentation of different pieces of _presenterm_:
* [Installation](/docs/install.md).
* [Introduction](/docs/intro.md): the place where you should start after you've installed _presenterm_.
* [Themes](/docs/themes.md): learn how to customize your presentation's looks.
* [Layouts](/docs/layouts.md): learn how to organize your slides into columns.
* [Code highlighting](/docs/highlighting.md): learn how to use the code highlighting capabilities.
* [PDF export](/docs/pdf-export.md): learn how to turn your presentations into a PDF file that can be shared with
others.
* [LaTeX and typst rendering](/docs/latex.md): learn how to write _LaTeX_ and _typst_ formulas as text and have them
automatically transformed into images by _presenterm_.
* [Configuration](/docs/config.md): learn about the different configuration parameters supported.
## Internals
* [Parsing and rendering](/docs/parse.md).

16
docs/book.toml Normal file
View File

@ -0,0 +1,16 @@
[book]
authors = ["mfontanini"]
language = "en"
multilingual = false
src = "src"
title = "Presenterm documentation"
[preprocessor]
[preprocessor.catppuccin]
assets_version = "2.1.0"
[output]
[output.html]
additional-css = ["./theme/catppuccin.css", "./theme/catppuccin-admonish.css"]

16
docs/src/SUMMARY.md Normal file
View File

@ -0,0 +1,16 @@
# Summary
[About](./about.md)
# Guides
- [installation](./guides/installation.md)
- [Introduction](./guides/introduction.md)
- [Themes](./guides/themes.md)
- [Layout](./guides/layout.md)
- [Code highlighting](./guides/code-highlight.md)
- [Pdf export](./guides/pdf-export.md)
- [LaTeX and typst](./guides/latex.md)
- [Configuration](./guides/configuration.md)
# Internals
- [Parse](./internals/parse.md)

16
docs/src/about.md Normal file
View File

@ -0,0 +1,16 @@
# About
Welcome to the [Presenterm][github] documentation, A reliable resource
providing comprehensive information about Presenterm !!
Presenterm is a terminal-based tool that allows you to create presentations in
Markdown format and easily render them within your terminal interface.
## Quick demo
This is how demo presentation looks like:
![demo]
<!-- Links -->
[github]: https://github.com/mfontanini/presenterm/
[demo]: /assets/demo.gif

View File

Before

Width:  |  Height:  |  Size: 282 KiB

After

Width:  |  Height:  |  Size: 282 KiB

View File

Before

Width:  |  Height:  |  Size: 462 KiB

After

Width:  |  Height:  |  Size: 462 KiB

View File

Before

Width:  |  Height:  |  Size: 12 KiB

After

Width:  |  Height:  |  Size: 12 KiB

View File

Before

Width:  |  Height:  |  Size: 282 KiB

After

Width:  |  Height:  |  Size: 282 KiB

View File

Before

Width:  |  Height:  |  Size: 82 KiB

After

Width:  |  Height:  |  Size: 82 KiB

View File

@ -1,6 +1,6 @@
# Installation
There's different ways to install _presenterm_.
There are different ways to install _presenterm_.
## Pre-built binaries (recommended)
@ -51,3 +51,19 @@ nix run github:mfontanini/presenterm # to run from github repo
For more information see
[nixpkgs](https://search.nixos.org/packages?channel=unstable&show=presenterm&from=0&size=50&sort=relevance&type=packages&query=presenterm)
## Arch linux repository (Aur)
Presenterm is also available in the aur. You can use any AUR helper to install.
#### Building from git
> ***recommended for upstream updates***
```bash
paru/yay -S presenterm-git
```
#### Binary release
```bash
paru/yay -S presenterm-bin
```

View File

@ -100,3 +100,4 @@ This would render the following way:
Besides organizing your slides into columns, you can use column layouts to center a piece of your slide. For example, if
you want a certain portion of your slide to be centered, you could define a column layout like `[1, 3, 1]` and then only
write content into the middle column. This would make your content take up the center 60% of the screen.

363
docs/theme/catppuccin-admonish.css vendored Normal file
View File

@ -0,0 +1,363 @@
.mocha :is(.admonition):is(.admonish-hint, .admonish-important, .admonish-tip) {
border-color: #f9e2af;
}
.mocha :is(.admonish-hint, .admonish-important, .admonish-tip) > :is(.admonition-title, summary.admonition-title) {
background-color: rgba(249, 226, 175, 0.2);
}
.mocha :is(.admonish-hint, .admonish-important, .admonish-tip) > :is(.admonition-title, summary.admonition-title)::before {
background-color: #f9e2af;
}
.mocha :is(.admonition):is(.admonish-abstract, .admonish-summary, .admonish-tldr) {
border-color: #f2cdcd;
}
.mocha :is(.admonish-abstract, .admonish-summary, .admonish-tldr) > :is(.admonition-title, summary.admonition-title) {
background-color: rgba(242, 205, 205, 0.2);
}
.mocha :is(.admonish-abstract, .admonish-summary, .admonish-tldr) > :is(.admonition-title, summary.admonition-title)::before {
background-color: #f2cdcd;
}
.mocha :is(.admonition):is(.admonish-example) {
border-color: #cba6f7;
}
.mocha :is(.admonish-example) > :is(.admonition-title, summary.admonition-title) {
background-color: rgba(203, 166, 247, 0.2);
}
.mocha :is(.admonish-example) > :is(.admonition-title, summary.admonition-title)::before {
background-color: #cba6f7;
}
.mocha :is(.admonition):is(.admonish-info, .admonish-todo) {
border-color: #89dceb;
}
.mocha :is(.admonish-info, .admonish-todo) > :is(.admonition-title, summary.admonition-title) {
background-color: rgba(137, 220, 235, 0.2);
}
.mocha :is(.admonish-info, .admonish-todo) > :is(.admonition-title, summary.admonition-title)::before {
background-color: #89dceb;
}
.mocha :is(.admonition):is(.admonish-check, .admonish-done, .admonish-success) {
border-color: #a6e3a1;
}
.mocha :is(.admonish-check, .admonish-done, .admonish-success) > :is(.admonition-title, summary.admonition-title) {
background-color: rgba(166, 227, 161, 0.2);
}
.mocha :is(.admonish-check, .admonish-done, .admonish-success) > :is(.admonition-title, summary.admonition-title)::before {
background-color: #a6e3a1;
}
.mocha :is(.admonition):is(.admonish-note) {
border-color: #89b4fa;
}
.mocha :is(.admonish-note) > :is(.admonition-title, summary.admonition-title) {
background-color: rgba(137, 180, 250, 0.2);
}
.mocha :is(.admonish-note) > :is(.admonition-title, summary.admonition-title)::before {
background-color: #89b4fa;
}
.mocha :is(.admonition):is(.admonish-attention, .admonish-caution, .admonish-warning) {
border-color: #fab387;
}
.mocha :is(.admonish-attention, .admonish-caution, .admonish-warning) > :is(.admonition-title, summary.admonition-title) {
background-color: rgba(250, 179, 135, 0.2);
}
.mocha :is(.admonish-attention, .admonish-caution, .admonish-warning) > :is(.admonition-title, summary.admonition-title)::before {
background-color: #fab387;
}
.mocha :is(.admonition):is(.admonish-faq, .admonish-help, .admonish-question) {
border-color: #94e2d5;
}
.mocha :is(.admonish-faq, .admonish-help, .admonish-question) > :is(.admonition-title, summary.admonition-title) {
background-color: rgba(148, 226, 213, 0.2);
}
.mocha :is(.admonish-faq, .admonish-help, .admonish-question) > :is(.admonition-title, summary.admonition-title)::before {
background-color: #94e2d5;
}
.mocha :is(.admonition):is(.admonish-bug, .admonish-danger, .admonish-error, .admonish-fail, .admonish-failure, .admonish-missing) {
border-color: #f38ba8;
}
.mocha :is(.admonish-bug, .admonish-danger, .admonish-error, .admonish-fail, .admonish-failure, .admonish-missing) > :is(.admonition-title, summary.admonition-title) {
background-color: rgba(243, 139, 168, 0.2);
}
.mocha :is(.admonish-bug, .admonish-danger, .admonish-error, .admonish-fail, .admonish-failure, .admonish-missing) > :is(.admonition-title, summary.admonition-title)::before {
background-color: #f38ba8;
}
.mocha :is(.admonition):is(.admonish-cite, .admonish-quote) {
border-color: #f5c2e7;
}
.mocha :is(.admonish-cite, .admonish-quote) > :is(.admonition-title, summary.admonition-title) {
background-color: rgba(245, 194, 231, 0.2);
}
.mocha :is(.admonish-cite, .admonish-quote) > :is(.admonition-title, summary.admonition-title)::before {
background-color: #f5c2e7;
}
.macchiato :is(.admonition):is(.admonish-hint, .admonish-important, .admonish-tip) {
border-color: #eed49f;
}
.macchiato :is(.admonish-hint, .admonish-important, .admonish-tip) > :is(.admonition-title, summary.admonition-title) {
background-color: rgba(238, 212, 159, 0.2);
}
.macchiato :is(.admonish-hint, .admonish-important, .admonish-tip) > :is(.admonition-title, summary.admonition-title)::before {
background-color: #eed49f;
}
.macchiato :is(.admonition):is(.admonish-abstract, .admonish-summary, .admonish-tldr) {
border-color: #f0c6c6;
}
.macchiato :is(.admonish-abstract, .admonish-summary, .admonish-tldr) > :is(.admonition-title, summary.admonition-title) {
background-color: rgba(240, 198, 198, 0.2);
}
.macchiato :is(.admonish-abstract, .admonish-summary, .admonish-tldr) > :is(.admonition-title, summary.admonition-title)::before {
background-color: #f0c6c6;
}
.macchiato :is(.admonition):is(.admonish-example) {
border-color: #c6a0f6;
}
.macchiato :is(.admonish-example) > :is(.admonition-title, summary.admonition-title) {
background-color: rgba(198, 160, 246, 0.2);
}
.macchiato :is(.admonish-example) > :is(.admonition-title, summary.admonition-title)::before {
background-color: #c6a0f6;
}
.macchiato :is(.admonition):is(.admonish-info, .admonish-todo) {
border-color: #91d7e3;
}
.macchiato :is(.admonish-info, .admonish-todo) > :is(.admonition-title, summary.admonition-title) {
background-color: rgba(145, 215, 227, 0.2);
}
.macchiato :is(.admonish-info, .admonish-todo) > :is(.admonition-title, summary.admonition-title)::before {
background-color: #91d7e3;
}
.macchiato :is(.admonition):is(.admonish-check, .admonish-done, .admonish-success) {
border-color: #a6da95;
}
.macchiato :is(.admonish-check, .admonish-done, .admonish-success) > :is(.admonition-title, summary.admonition-title) {
background-color: rgba(166, 218, 149, 0.2);
}
.macchiato :is(.admonish-check, .admonish-done, .admonish-success) > :is(.admonition-title, summary.admonition-title)::before {
background-color: #a6da95;
}
.macchiato :is(.admonition):is(.admonish-note) {
border-color: #8aadf4;
}
.macchiato :is(.admonish-note) > :is(.admonition-title, summary.admonition-title) {
background-color: rgba(138, 173, 244, 0.2);
}
.macchiato :is(.admonish-note) > :is(.admonition-title, summary.admonition-title)::before {
background-color: #8aadf4;
}
.macchiato :is(.admonition):is(.admonish-attention, .admonish-caution, .admonish-warning) {
border-color: #f5a97f;
}
.macchiato :is(.admonish-attention, .admonish-caution, .admonish-warning) > :is(.admonition-title, summary.admonition-title) {
background-color: rgba(245, 169, 127, 0.2);
}
.macchiato :is(.admonish-attention, .admonish-caution, .admonish-warning) > :is(.admonition-title, summary.admonition-title)::before {
background-color: #f5a97f;
}
.macchiato :is(.admonition):is(.admonish-faq, .admonish-help, .admonish-question) {
border-color: #8bd5ca;
}
.macchiato :is(.admonish-faq, .admonish-help, .admonish-question) > :is(.admonition-title, summary.admonition-title) {
background-color: rgba(139, 213, 202, 0.2);
}
.macchiato :is(.admonish-faq, .admonish-help, .admonish-question) > :is(.admonition-title, summary.admonition-title)::before {
background-color: #8bd5ca;
}
.macchiato :is(.admonition):is(.admonish-bug, .admonish-danger, .admonish-error, .admonish-fail, .admonish-failure, .admonish-missing) {
border-color: #ed8796;
}
.macchiato :is(.admonish-bug, .admonish-danger, .admonish-error, .admonish-fail, .admonish-failure, .admonish-missing) > :is(.admonition-title, summary.admonition-title) {
background-color: rgba(237, 135, 150, 0.2);
}
.macchiato :is(.admonish-bug, .admonish-danger, .admonish-error, .admonish-fail, .admonish-failure, .admonish-missing) > :is(.admonition-title, summary.admonition-title)::before {
background-color: #ed8796;
}
.macchiato :is(.admonition):is(.admonish-cite, .admonish-quote) {
border-color: #f5bde6;
}
.macchiato :is(.admonish-cite, .admonish-quote) > :is(.admonition-title, summary.admonition-title) {
background-color: rgba(245, 189, 230, 0.2);
}
.macchiato :is(.admonish-cite, .admonish-quote) > :is(.admonition-title, summary.admonition-title)::before {
background-color: #f5bde6;
}
.frappe :is(.admonition):is(.admonish-hint, .admonish-important, .admonish-tip) {
border-color: #e5c890;
}
.frappe :is(.admonish-hint, .admonish-important, .admonish-tip) > :is(.admonition-title, summary.admonition-title) {
background-color: rgba(229, 200, 144, 0.2);
}
.frappe :is(.admonish-hint, .admonish-important, .admonish-tip) > :is(.admonition-title, summary.admonition-title)::before {
background-color: #e5c890;
}
.frappe :is(.admonition):is(.admonish-abstract, .admonish-summary, .admonish-tldr) {
border-color: #eebebe;
}
.frappe :is(.admonish-abstract, .admonish-summary, .admonish-tldr) > :is(.admonition-title, summary.admonition-title) {
background-color: rgba(238, 190, 190, 0.2);
}
.frappe :is(.admonish-abstract, .admonish-summary, .admonish-tldr) > :is(.admonition-title, summary.admonition-title)::before {
background-color: #eebebe;
}
.frappe :is(.admonition):is(.admonish-example) {
border-color: #ca9ee6;
}
.frappe :is(.admonish-example) > :is(.admonition-title, summary.admonition-title) {
background-color: rgba(202, 158, 230, 0.2);
}
.frappe :is(.admonish-example) > :is(.admonition-title, summary.admonition-title)::before {
background-color: #ca9ee6;
}
.frappe :is(.admonition):is(.admonish-info, .admonish-todo) {
border-color: #99d1db;
}
.frappe :is(.admonish-info, .admonish-todo) > :is(.admonition-title, summary.admonition-title) {
background-color: rgba(153, 209, 219, 0.2);
}
.frappe :is(.admonish-info, .admonish-todo) > :is(.admonition-title, summary.admonition-title)::before {
background-color: #99d1db;
}
.frappe :is(.admonition):is(.admonish-check, .admonish-done, .admonish-success) {
border-color: #a6d189;
}
.frappe :is(.admonish-check, .admonish-done, .admonish-success) > :is(.admonition-title, summary.admonition-title) {
background-color: rgba(166, 209, 137, 0.2);
}
.frappe :is(.admonish-check, .admonish-done, .admonish-success) > :is(.admonition-title, summary.admonition-title)::before {
background-color: #a6d189;
}
.frappe :is(.admonition):is(.admonish-note) {
border-color: #8caaee;
}
.frappe :is(.admonish-note) > :is(.admonition-title, summary.admonition-title) {
background-color: rgba(140, 170, 238, 0.2);
}
.frappe :is(.admonish-note) > :is(.admonition-title, summary.admonition-title)::before {
background-color: #8caaee;
}
.frappe :is(.admonition):is(.admonish-attention, .admonish-caution, .admonish-warning) {
border-color: #ef9f76;
}
.frappe :is(.admonish-attention, .admonish-caution, .admonish-warning) > :is(.admonition-title, summary.admonition-title) {
background-color: rgba(239, 159, 118, 0.2);
}
.frappe :is(.admonish-attention, .admonish-caution, .admonish-warning) > :is(.admonition-title, summary.admonition-title)::before {
background-color: #ef9f76;
}
.frappe :is(.admonition):is(.admonish-faq, .admonish-help, .admonish-question) {
border-color: #81c8be;
}
.frappe :is(.admonish-faq, .admonish-help, .admonish-question) > :is(.admonition-title, summary.admonition-title) {
background-color: rgba(129, 200, 190, 0.2);
}
.frappe :is(.admonish-faq, .admonish-help, .admonish-question) > :is(.admonition-title, summary.admonition-title)::before {
background-color: #81c8be;
}
.frappe :is(.admonition):is(.admonish-bug, .admonish-danger, .admonish-error, .admonish-fail, .admonish-failure, .admonish-missing) {
border-color: #e78284;
}
.frappe :is(.admonish-bug, .admonish-danger, .admonish-error, .admonish-fail, .admonish-failure, .admonish-missing) > :is(.admonition-title, summary.admonition-title) {
background-color: rgba(231, 130, 132, 0.2);
}
.frappe :is(.admonish-bug, .admonish-danger, .admonish-error, .admonish-fail, .admonish-failure, .admonish-missing) > :is(.admonition-title, summary.admonition-title)::before {
background-color: #e78284;
}
.frappe :is(.admonition):is(.admonish-cite, .admonish-quote) {
border-color: #f4b8e4;
}
.frappe :is(.admonish-cite, .admonish-quote) > :is(.admonition-title, summary.admonition-title) {
background-color: rgba(244, 184, 228, 0.2);
}
.frappe :is(.admonish-cite, .admonish-quote) > :is(.admonition-title, summary.admonition-title)::before {
background-color: #f4b8e4;
}
.latte :is(.admonition):is(.admonish-hint, .admonish-important, .admonish-tip) {
border-color: #df8e1d;
}
.latte :is(.admonish-hint, .admonish-important, .admonish-tip) > :is(.admonition-title, summary.admonition-title) {
background-color: rgba(223, 142, 29, 0.2);
}
.latte :is(.admonish-hint, .admonish-important, .admonish-tip) > :is(.admonition-title, summary.admonition-title)::before {
background-color: #df8e1d;
}
.latte :is(.admonition):is(.admonish-abstract, .admonish-summary, .admonish-tldr) {
border-color: #dd7878;
}
.latte :is(.admonish-abstract, .admonish-summary, .admonish-tldr) > :is(.admonition-title, summary.admonition-title) {
background-color: rgba(221, 120, 120, 0.2);
}
.latte :is(.admonish-abstract, .admonish-summary, .admonish-tldr) > :is(.admonition-title, summary.admonition-title)::before {
background-color: #dd7878;
}
.latte :is(.admonition):is(.admonish-example) {
border-color: #8839ef;
}
.latte :is(.admonish-example) > :is(.admonition-title, summary.admonition-title) {
background-color: rgba(136, 57, 239, 0.2);
}
.latte :is(.admonish-example) > :is(.admonition-title, summary.admonition-title)::before {
background-color: #8839ef;
}
.latte :is(.admonition):is(.admonish-info, .admonish-todo) {
border-color: #04a5e5;
}
.latte :is(.admonish-info, .admonish-todo) > :is(.admonition-title, summary.admonition-title) {
background-color: rgba(4, 165, 229, 0.2);
}
.latte :is(.admonish-info, .admonish-todo) > :is(.admonition-title, summary.admonition-title)::before {
background-color: #04a5e5;
}
.latte :is(.admonition):is(.admonish-check, .admonish-done, .admonish-success) {
border-color: #40a02b;
}
.latte :is(.admonish-check, .admonish-done, .admonish-success) > :is(.admonition-title, summary.admonition-title) {
background-color: rgba(64, 160, 43, 0.2);
}
.latte :is(.admonish-check, .admonish-done, .admonish-success) > :is(.admonition-title, summary.admonition-title)::before {
background-color: #40a02b;
}
.latte :is(.admonition):is(.admonish-note) {
border-color: #1e66f5;
}
.latte :is(.admonish-note) > :is(.admonition-title, summary.admonition-title) {
background-color: rgba(30, 102, 245, 0.2);
}
.latte :is(.admonish-note) > :is(.admonition-title, summary.admonition-title)::before {
background-color: #1e66f5;
}
.latte :is(.admonition):is(.admonish-attention, .admonish-caution, .admonish-warning) {
border-color: #fe640b;
}
.latte :is(.admonish-attention, .admonish-caution, .admonish-warning) > :is(.admonition-title, summary.admonition-title) {
background-color: rgba(254, 100, 11, 0.2);
}
.latte :is(.admonish-attention, .admonish-caution, .admonish-warning) > :is(.admonition-title, summary.admonition-title)::before {
background-color: #fe640b;
}
.latte :is(.admonition):is(.admonish-faq, .admonish-help, .admonish-question) {
border-color: #179299;
}
.latte :is(.admonish-faq, .admonish-help, .admonish-question) > :is(.admonition-title, summary.admonition-title) {
background-color: rgba(23, 146, 153, 0.2);
}
.latte :is(.admonish-faq, .admonish-help, .admonish-question) > :is(.admonition-title, summary.admonition-title)::before {
background-color: #179299;
}
.latte :is(.admonition):is(.admonish-bug, .admonish-danger, .admonish-error, .admonish-fail, .admonish-failure, .admonish-missing) {
border-color: #d20f39;
}
.latte :is(.admonish-bug, .admonish-danger, .admonish-error, .admonish-fail, .admonish-failure, .admonish-missing) > :is(.admonition-title, summary.admonition-title) {
background-color: rgba(210, 15, 57, 0.2);
}
.latte :is(.admonish-bug, .admonish-danger, .admonish-error, .admonish-fail, .admonish-failure, .admonish-missing) > :is(.admonition-title, summary.admonition-title)::before {
background-color: #d20f39;
}
.latte :is(.admonition):is(.admonish-cite, .admonish-quote) {
border-color: #ea76cb;
}
.latte :is(.admonish-cite, .admonish-quote) > :is(.admonition-title, summary.admonition-title) {
background-color: rgba(234, 118, 203, 0.2);
}
.latte :is(.admonish-cite, .admonish-quote) > :is(.admonition-title, summary.admonition-title)::before {
background-color: #ea76cb;
}

787
docs/theme/catppuccin.css vendored Normal file
View File

@ -0,0 +1,787 @@
.mocha.hljs {
color: #cdd6f4;
background: #1e1e2e;
}
.mocha .hljs-keyword {
color: #cba6f7;
}
.mocha .hljs-built_in {
color: #f38ba8;
}
.mocha .hljs-type {
color: #f9e2af;
}
.mocha .hljs-literal {
color: #fab387;
}
.mocha .hljs-number {
color: #fab387;
}
.mocha .hljs-operator {
color: #94e2d5;
}
.mocha .hljs-punctuation {
color: #bac2de;
}
.mocha .hljs-property {
color: #94e2d5;
}
.mocha .hljs-regexp {
color: #f5c2e7;
}
.mocha .hljs-string {
color: #a6e3a1;
}
.mocha .hljs-char.escape_ {
color: #a6e3a1;
}
.mocha .hljs-subst {
color: #a6adc8;
}
.mocha .hljs-symbol {
color: #f2cdcd;
}
.mocha .hljs-variable {
color: #cba6f7;
}
.mocha .hljs-variable.language_ {
color: #cba6f7;
}
.mocha .hljs-variable.constant_ {
color: #fab387;
}
.mocha .hljs-title {
color: #89b4fa;
}
.mocha .hljs-title.class_ {
color: #f9e2af;
}
.mocha .hljs-title.function_ {
color: #89b4fa;
}
.mocha .hljs-params {
color: #cdd6f4;
}
.mocha .hljs-comment {
color: #585b70;
}
.mocha .hljs-doctag {
color: #f38ba8;
}
.mocha .hljs-meta {
color: #fab387;
}
.mocha .hljs-section {
color: #89b4fa;
}
.mocha .hljs-tag {
color: #a6adc8;
}
.mocha .hljs-name {
color: #cba6f7;
}
.mocha .hljs-attr {
color: #89b4fa;
}
.mocha .hljs-attribute {
color: #a6e3a1;
}
.mocha .hljs-bullet {
color: #94e2d5;
}
.mocha .hljs-code {
color: #a6e3a1;
}
.mocha .hljs-emphasis {
color: #f38ba8;
font-style: italic;
}
.mocha .hljs-strong {
color: #f38ba8;
font-weight: bold;
}
.mocha .hljs-formula {
color: #94e2d5;
}
.mocha .hljs-link {
color: #74c7ec;
font-style: italic;
}
.mocha .hljs-quote {
color: #a6e3a1;
font-style: italic;
}
.mocha .hljs-selector-tag {
color: #f9e2af;
}
.mocha .hljs-selector-id {
color: #89b4fa;
}
.mocha .hljs-selector-class {
color: #94e2d5;
}
.mocha .hljs-selector-attr {
color: #cba6f7;
}
.mocha .hljs-selector-pseudo {
color: #94e2d5;
}
.mocha .hljs-template-tag {
color: #f2cdcd;
}
.mocha .hljs-template-variable {
color: #f2cdcd;
}
.mocha .hljs-addition {
color: #a6e3a1;
background: rgba(166, 227, 161, 0.15);
}
.mocha .hljs-deletion {
color: #f38ba8;
background: rgba(243, 139, 168, 0.15);
}
.mocha code {
color: #cdd6f4;
background: #181825;
}
.mocha blockquote blockquote {
border-top: 0.1em solid #585b70;
border-bottom: 0.1em solid #585b70;
}
.mocha hr {
color: #585b70;
}
.mocha del {
color: #9399b2;
}
.mocha .ace_gutter {
color: #7f849c;
background: #181825;
}
.mocha .ace_gutter-active-line.ace_gutter-cell {
color: #f5c2e7;
background: #181825;
}
.macchiato.hljs {
color: #cad3f5;
background: #24273a;
}
.macchiato .hljs-keyword {
color: #c6a0f6;
}
.macchiato .hljs-built_in {
color: #ed8796;
}
.macchiato .hljs-type {
color: #eed49f;
}
.macchiato .hljs-literal {
color: #f5a97f;
}
.macchiato .hljs-number {
color: #f5a97f;
}
.macchiato .hljs-operator {
color: #8bd5ca;
}
.macchiato .hljs-punctuation {
color: #b8c0e0;
}
.macchiato .hljs-property {
color: #8bd5ca;
}
.macchiato .hljs-regexp {
color: #f5bde6;
}
.macchiato .hljs-string {
color: #a6da95;
}
.macchiato .hljs-char.escape_ {
color: #a6da95;
}
.macchiato .hljs-subst {
color: #a5adcb;
}
.macchiato .hljs-symbol {
color: #f0c6c6;
}
.macchiato .hljs-variable {
color: #c6a0f6;
}
.macchiato .hljs-variable.language_ {
color: #c6a0f6;
}
.macchiato .hljs-variable.constant_ {
color: #f5a97f;
}
.macchiato .hljs-title {
color: #8aadf4;
}
.macchiato .hljs-title.class_ {
color: #eed49f;
}
.macchiato .hljs-title.function_ {
color: #8aadf4;
}
.macchiato .hljs-params {
color: #cad3f5;
}
.macchiato .hljs-comment {
color: #5b6078;
}
.macchiato .hljs-doctag {
color: #ed8796;
}
.macchiato .hljs-meta {
color: #f5a97f;
}
.macchiato .hljs-section {
color: #8aadf4;
}
.macchiato .hljs-tag {
color: #a5adcb;
}
.macchiato .hljs-name {
color: #c6a0f6;
}
.macchiato .hljs-attr {
color: #8aadf4;
}
.macchiato .hljs-attribute {
color: #a6da95;
}
.macchiato .hljs-bullet {
color: #8bd5ca;
}
.macchiato .hljs-code {
color: #a6da95;
}
.macchiato .hljs-emphasis {
color: #ed8796;
font-style: italic;
}
.macchiato .hljs-strong {
color: #ed8796;
font-weight: bold;
}
.macchiato .hljs-formula {
color: #8bd5ca;
}
.macchiato .hljs-link {
color: #7dc4e4;
font-style: italic;
}
.macchiato .hljs-quote {
color: #a6da95;
font-style: italic;
}
.macchiato .hljs-selector-tag {
color: #eed49f;
}
.macchiato .hljs-selector-id {
color: #8aadf4;
}
.macchiato .hljs-selector-class {
color: #8bd5ca;
}
.macchiato .hljs-selector-attr {
color: #c6a0f6;
}
.macchiato .hljs-selector-pseudo {
color: #8bd5ca;
}
.macchiato .hljs-template-tag {
color: #f0c6c6;
}
.macchiato .hljs-template-variable {
color: #f0c6c6;
}
.macchiato .hljs-addition {
color: #a6da95;
background: rgba(166, 218, 149, 0.15);
}
.macchiato .hljs-deletion {
color: #ed8796;
background: rgba(237, 135, 150, 0.15);
}
.macchiato code {
color: #cad3f5;
background: #1e2030;
}
.macchiato blockquote blockquote {
border-top: 0.1em solid #5b6078;
border-bottom: 0.1em solid #5b6078;
}
.macchiato hr {
color: #5b6078;
}
.macchiato del {
color: #939ab7;
}
.macchiato .ace_gutter {
color: #8087a2;
background: #1e2030;
}
.macchiato .ace_gutter-active-line.ace_gutter-cell {
color: #f5bde6;
background: #1e2030;
}
.frappe.hljs {
color: #c6d0f5;
background: #303446;
}
.frappe .hljs-keyword {
color: #ca9ee6;
}
.frappe .hljs-built_in {
color: #e78284;
}
.frappe .hljs-type {
color: #e5c890;
}
.frappe .hljs-literal {
color: #ef9f76;
}
.frappe .hljs-number {
color: #ef9f76;
}
.frappe .hljs-operator {
color: #81c8be;
}
.frappe .hljs-punctuation {
color: #b5bfe2;
}
.frappe .hljs-property {
color: #81c8be;
}
.frappe .hljs-regexp {
color: #f4b8e4;
}
.frappe .hljs-string {
color: #a6d189;
}
.frappe .hljs-char.escape_ {
color: #a6d189;
}
.frappe .hljs-subst {
color: #a5adce;
}
.frappe .hljs-symbol {
color: #eebebe;
}
.frappe .hljs-variable {
color: #ca9ee6;
}
.frappe .hljs-variable.language_ {
color: #ca9ee6;
}
.frappe .hljs-variable.constant_ {
color: #ef9f76;
}
.frappe .hljs-title {
color: #8caaee;
}
.frappe .hljs-title.class_ {
color: #e5c890;
}
.frappe .hljs-title.function_ {
color: #8caaee;
}
.frappe .hljs-params {
color: #c6d0f5;
}
.frappe .hljs-comment {
color: #626880;
}
.frappe .hljs-doctag {
color: #e78284;
}
.frappe .hljs-meta {
color: #ef9f76;
}
.frappe .hljs-section {
color: #8caaee;
}
.frappe .hljs-tag {
color: #a5adce;
}
.frappe .hljs-name {
color: #ca9ee6;
}
.frappe .hljs-attr {
color: #8caaee;
}
.frappe .hljs-attribute {
color: #a6d189;
}
.frappe .hljs-bullet {
color: #81c8be;
}
.frappe .hljs-code {
color: #a6d189;
}
.frappe .hljs-emphasis {
color: #e78284;
font-style: italic;
}
.frappe .hljs-strong {
color: #e78284;
font-weight: bold;
}
.frappe .hljs-formula {
color: #81c8be;
}
.frappe .hljs-link {
color: #85c1dc;
font-style: italic;
}
.frappe .hljs-quote {
color: #a6d189;
font-style: italic;
}
.frappe .hljs-selector-tag {
color: #e5c890;
}
.frappe .hljs-selector-id {
color: #8caaee;
}
.frappe .hljs-selector-class {
color: #81c8be;
}
.frappe .hljs-selector-attr {
color: #ca9ee6;
}
.frappe .hljs-selector-pseudo {
color: #81c8be;
}
.frappe .hljs-template-tag {
color: #eebebe;
}
.frappe .hljs-template-variable {
color: #eebebe;
}
.frappe .hljs-addition {
color: #a6d189;
background: rgba(166, 209, 137, 0.15);
}
.frappe .hljs-deletion {
color: #e78284;
background: rgba(231, 130, 132, 0.15);
}
.frappe code {
color: #c6d0f5;
background: #292c3c;
}
.frappe blockquote blockquote {
border-top: 0.1em solid #626880;
border-bottom: 0.1em solid #626880;
}
.frappe hr {
color: #626880;
}
.frappe del {
color: #949cbb;
}
.frappe .ace_gutter {
color: #838ba7;
background: #292c3c;
}
.frappe .ace_gutter-active-line.ace_gutter-cell {
color: #f4b8e4;
background: #292c3c;
}
.latte.hljs {
color: #4c4f69;
background: #eff1f5;
}
.latte .hljs-keyword {
color: #8839ef;
}
.latte .hljs-built_in {
color: #d20f39;
}
.latte .hljs-type {
color: #df8e1d;
}
.latte .hljs-literal {
color: #fe640b;
}
.latte .hljs-number {
color: #fe640b;
}
.latte .hljs-operator {
color: #179299;
}
.latte .hljs-punctuation {
color: #5c5f77;
}
.latte .hljs-property {
color: #179299;
}
.latte .hljs-regexp {
color: #ea76cb;
}
.latte .hljs-string {
color: #40a02b;
}
.latte .hljs-char.escape_ {
color: #40a02b;
}
.latte .hljs-subst {
color: #6c6f85;
}
.latte .hljs-symbol {
color: #dd7878;
}
.latte .hljs-variable {
color: #8839ef;
}
.latte .hljs-variable.language_ {
color: #8839ef;
}
.latte .hljs-variable.constant_ {
color: #fe640b;
}
.latte .hljs-title {
color: #1e66f5;
}
.latte .hljs-title.class_ {
color: #df8e1d;
}
.latte .hljs-title.function_ {
color: #1e66f5;
}
.latte .hljs-params {
color: #4c4f69;
}
.latte .hljs-comment {
color: #acb0be;
}
.latte .hljs-doctag {
color: #d20f39;
}
.latte .hljs-meta {
color: #fe640b;
}
.latte .hljs-section {
color: #1e66f5;
}
.latte .hljs-tag {
color: #6c6f85;
}
.latte .hljs-name {
color: #8839ef;
}
.latte .hljs-attr {
color: #1e66f5;
}
.latte .hljs-attribute {
color: #40a02b;
}
.latte .hljs-bullet {
color: #179299;
}
.latte .hljs-code {
color: #40a02b;
}
.latte .hljs-emphasis {
color: #d20f39;
font-style: italic;
}
.latte .hljs-strong {
color: #d20f39;
font-weight: bold;
}
.latte .hljs-formula {
color: #179299;
}
.latte .hljs-link {
color: #209fb5;
font-style: italic;
}
.latte .hljs-quote {
color: #40a02b;
font-style: italic;
}
.latte .hljs-selector-tag {
color: #df8e1d;
}
.latte .hljs-selector-id {
color: #1e66f5;
}
.latte .hljs-selector-class {
color: #179299;
}
.latte .hljs-selector-attr {
color: #8839ef;
}
.latte .hljs-selector-pseudo {
color: #179299;
}
.latte .hljs-template-tag {
color: #dd7878;
}
.latte .hljs-template-variable {
color: #dd7878;
}
.latte .hljs-addition {
color: #40a02b;
background: rgba(64, 160, 43, 0.15);
}
.latte .hljs-deletion {
color: #d20f39;
background: rgba(210, 15, 57, 0.15);
}
.latte code {
color: #4c4f69;
background: #e6e9ef;
}
.latte blockquote blockquote {
border-top: 0.1em solid #acb0be;
border-bottom: 0.1em solid #acb0be;
}
.latte hr {
color: #acb0be;
}
.latte del {
color: #7c7f93;
}
.latte .ace_gutter {
color: #8c8fa1;
background: #e6e9ef;
}
.latte .ace_gutter-active-line.ace_gutter-cell {
color: #ea76cb;
background: #e6e9ef;
}
.mocha {
--bg: #1e1e2e;
--fg: #cdd6f4;
--sidebar-bg: #181825;
--sidebar-fg: #cdd6f4;
--sidebar-non-existant: #6c7086;
--sidebar-active: #89b4fa;
--sidebar-spacer: #6c7086;
--scrollbar: #6c7086;
--icons: #6c7086;
--icons-hover: #7f849c;
--links: #89b4fa;
--inline-code-color: #fab387;
--theme-popup-bg: #181825;
--theme-popup-border: #6c7086;
--theme-hover: #6c7086;
--quote-bg: #181825;
--quote-border: #11111b;
--table-border-color: #11111b;
--table-header-bg: #181825;
--table-alternate-bg: #181825;
--searchbar-border-color: #11111b;
--searchbar-bg: #181825;
--searchbar-fg: #cdd6f4;
--searchbar-shadow-color: #11111b;
--searchresults-header-fg: #cdd6f4;
--searchresults-border-color: #11111b;
--searchresults-li-bg: #1e1e2e;
--search-mark-bg: #fab387;
--warning-border: #fab387;
}
.macchiato {
--bg: #24273a;
--fg: #cad3f5;
--sidebar-bg: #1e2030;
--sidebar-fg: #cad3f5;
--sidebar-non-existant: #6e738d;
--sidebar-active: #8aadf4;
--sidebar-spacer: #6e738d;
--scrollbar: #6e738d;
--icons: #6e738d;
--icons-hover: #8087a2;
--links: #8aadf4;
--inline-code-color: #f5a97f;
--theme-popup-bg: #1e2030;
--theme-popup-border: #6e738d;
--theme-hover: #6e738d;
--quote-bg: #1e2030;
--quote-border: #181926;
--table-border-color: #181926;
--table-header-bg: #1e2030;
--table-alternate-bg: #1e2030;
--searchbar-border-color: #181926;
--searchbar-bg: #1e2030;
--searchbar-fg: #cad3f5;
--searchbar-shadow-color: #181926;
--searchresults-header-fg: #cad3f5;
--searchresults-border-color: #181926;
--searchresults-li-bg: #24273a;
--search-mark-bg: #f5a97f;
--warning-border: #f5a97f;
}
.frappe {
--bg: #303446;
--fg: #c6d0f5;
--sidebar-bg: #292c3c;
--sidebar-fg: #c6d0f5;
--sidebar-non-existant: #737994;
--sidebar-active: #8caaee;
--sidebar-spacer: #737994;
--scrollbar: #737994;
--icons: #737994;
--icons-hover: #838ba7;
--links: #8caaee;
--inline-code-color: #ef9f76;
--theme-popup-bg: #292c3c;
--theme-popup-border: #737994;
--theme-hover: #737994;
--quote-bg: #292c3c;
--quote-border: #232634;
--table-border-color: #232634;
--table-header-bg: #292c3c;
--table-alternate-bg: #292c3c;
--searchbar-border-color: #232634;
--searchbar-bg: #292c3c;
--searchbar-fg: #c6d0f5;
--searchbar-shadow-color: #232634;
--searchresults-header-fg: #c6d0f5;
--searchresults-border-color: #232634;
--searchresults-li-bg: #303446;
--search-mark-bg: #ef9f76;
--warning-border: #ef9f76;
}
.latte {
--bg: #eff1f5;
--fg: #4c4f69;
--sidebar-bg: #e6e9ef;
--sidebar-fg: #4c4f69;
--sidebar-non-existant: #9ca0b0;
--sidebar-active: #1e66f5;
--sidebar-spacer: #9ca0b0;
--scrollbar: #9ca0b0;
--icons: #9ca0b0;
--icons-hover: #8c8fa1;
--links: #1e66f5;
--inline-code-color: #fe640b;
--theme-popup-bg: #e6e9ef;
--theme-popup-border: #9ca0b0;
--theme-hover: #9ca0b0;
--quote-bg: #e6e9ef;
--quote-border: #dce0e8;
--table-border-color: #dce0e8;
--table-header-bg: #e6e9ef;
--table-alternate-bg: #e6e9ef;
--searchbar-border-color: #dce0e8;
--searchbar-bg: #e6e9ef;
--searchbar-fg: #4c4f69;
--searchbar-shadow-color: #dce0e8;
--searchresults-header-fg: #4c4f69;
--searchresults-border-color: #dce0e8;
--searchresults-li-bg: #eff1f5;
--search-mark-bg: #fe640b;
--warning-border: #fe640b;
}

352
docs/theme/index.hbs vendored Normal file
View File

@ -0,0 +1,352 @@
<!DOCTYPE HTML>
<html lang="{{ language }}" class="{{ default_theme }}" dir="{{ text_direction }}">
<head>
<!-- Book generated using mdBook -->
<meta charset="UTF-8">
<title>{{ title }}</title>
{{#if is_print }}
<meta name="robots" content="noindex">
{{/if}}
{{#if base_url}}
<base href="{{ base_url }}">
{{/if}}
<!-- Custom HTML head -->
{{> head}}
<meta name="description" content="{{ description }}">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="theme-color" content="#ffffff">
{{#if favicon_svg}}
<link rel="icon" href="{{ path_to_root }}favicon.svg">
{{/if}}
{{#if favicon_png}}
<link rel="shortcut icon" href="{{ path_to_root }}favicon.png">
{{/if}}
<link rel="stylesheet" href="{{ path_to_root }}css/variables.css">
<link rel="stylesheet" href="{{ path_to_root }}css/general.css">
<link rel="stylesheet" href="{{ path_to_root }}css/chrome.css">
{{#if print_enable}}
<link rel="stylesheet" href="{{ path_to_root }}css/print.css" media="print">
{{/if}}
<!-- Fonts -->
<link rel="stylesheet" href="{{ path_to_root }}FontAwesome/css/font-awesome.css">
{{#if copy_fonts}}
<link rel="stylesheet" href="{{ path_to_root }}fonts/fonts.css">
{{/if}}
<!-- Highlight.js Stylesheets -->
<link rel="stylesheet" href="{{ path_to_root }}highlight.css">
<link rel="stylesheet" href="{{ path_to_root }}tomorrow-night.css">
<link rel="stylesheet" href="{{ path_to_root }}ayu-highlight.css">
<!-- Custom theme stylesheets -->
{{#each additional_css}}
<link rel="stylesheet" href="{{ ../path_to_root }}{{ this }}">
{{/each}}
{{#if mathjax_support}}
<!-- MathJax -->
<script async src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.1/MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script>
{{/if}}
</head>
<body class="sidebar-visible no-js">
<div id="body-container">
<!-- Provide site root to javascript -->
<script>
var path_to_root = "{{ path_to_root }}";
var default_theme = window.matchMedia("(prefers-color-scheme: dark)").matches ? "{{ preferred_dark_theme }}" : "{{ default_theme }}";
</script>
<!-- Work around some values being stored in localStorage wrapped in quotes -->
<script>
try {
var theme = localStorage.getItem('mdbook-theme');
var sidebar = localStorage.getItem('mdbook-sidebar');
if (theme.startsWith('"') && theme.endsWith('"')) {
localStorage.setItem('mdbook-theme', theme.slice(1, theme.length - 1));
}
if (sidebar.startsWith('"') && sidebar.endsWith('"')) {
localStorage.setItem('mdbook-sidebar', sidebar.slice(1, sidebar.length - 1));
}
} catch (e) { }
</script>
<!-- Set the theme before any content is loaded, prevents flash -->
<script>
var theme;
try { theme = localStorage.getItem('mdbook-theme'); } catch(e) { }
if (theme === null || theme === undefined) { theme = default_theme; }
var html = document.querySelector('html');
html.classList.remove('{{ default_theme }}')
html.classList.add(theme);
var body = document.querySelector('body');
body.classList.remove('no-js')
body.classList.add('js');
</script>
<input type="checkbox" id="sidebar-toggle-anchor" class="hidden">
<!-- Hide / unhide sidebar before it is displayed -->
<script>
var body = document.querySelector('body');
var sidebar = null;
var sidebar_toggle = document.getElementById("sidebar-toggle-anchor");
if (document.body.clientWidth >= 1080) {
try { sidebar = localStorage.getItem('mdbook-sidebar'); } catch(e) { }
sidebar = sidebar || 'visible';
} else {
sidebar = 'hidden';
}
sidebar_toggle.checked = sidebar === 'visible';
body.classList.remove('sidebar-visible');
body.classList.add("sidebar-" + sidebar);
</script>
<nav id="sidebar" class="sidebar" aria-label="Table of contents">
<div class="sidebar-scrollbox">
{{#toc}}{{/toc}}
</div>
<div id="sidebar-resize-handle" class="sidebar-resize-handle"></div>
</nav>
<!-- Track and set sidebar scroll position -->
<script>
var sidebarScrollbox = document.querySelector('#sidebar .sidebar-scrollbox');
sidebarScrollbox.addEventListener('click', function(e) {
if (e.target.tagName === 'A') {
sessionStorage.setItem('sidebar-scroll', sidebarScrollbox.scrollTop);
}
}, { passive: true });
var sidebarScrollTop = sessionStorage.getItem('sidebar-scroll');
sessionStorage.removeItem('sidebar-scroll');
if (sidebarScrollTop) {
// preserve sidebar scroll position when navigating via links within sidebar
sidebarScrollbox.scrollTop = sidebarScrollTop;
} else {
// scroll sidebar to current active section when navigating via "next/previous chapter" buttons
var activeSection = document.querySelector('#sidebar .active');
if (activeSection) {
activeSection.scrollIntoView({ block: 'center' });
}
}
</script>
<div id="page-wrapper" class="page-wrapper">
<div class="page">
{{> header}}
<div id="menu-bar-hover-placeholder"></div>
<div id="menu-bar" class="menu-bar sticky">
<div class="left-buttons">
<label id="sidebar-toggle" class="icon-button" for="sidebar-toggle-anchor" title="Toggle Table of Contents" aria-label="Toggle Table of Contents" aria-controls="sidebar">
<i class="fa fa-bars"></i>
</label>
<button id="theme-toggle" class="icon-button" type="button" title="Change theme" aria-label="Change theme" aria-haspopup="true" aria-expanded="false" aria-controls="theme-list">
<i class="fa fa-paint-brush"></i>
</button>
<ul id="theme-list" class="theme-popup" aria-label="Themes" role="menu">
<li role="none"><button role="menuitem" class="theme" id="mocha">Mocha</button></li>
<li role="none"><button role="menuitem" class="theme" id="macchiato">Macchiato</button></li>
<li role="none"><button role="menuitem" class="theme" id="frappe">Frappé</button></li>
<li role="none"><button role="menuitem" class="theme" id="latte">Latte</button></li>
<!--
<li role="none"><button role="menuitem" class="theme" id="light">Light</button></li>
<li role="none"><button role="menuitem" class="theme" id="rust">Rust</button></li>
<li role="none"><button role="menuitem" class="theme" id="coal">Coal</button></li>
<li role="none"><button role="menuitem" class="theme" id="navy">Navy</button></li>
<li role="none"><button role="menuitem" class="theme" id="ayu">Ayu</button></li>
-->
</ul>
{{#if search_enabled}}
<button id="search-toggle" class="icon-button" type="button" title="Search. (Shortkey: s)" aria-label="Toggle Searchbar" aria-expanded="false" aria-keyshortcuts="S" aria-controls="searchbar">
<i class="fa fa-search"></i>
</button>
{{/if}}
</div>
<h1 class="menu-title">{{ book_title }}</h1>
<div class="right-buttons">
{{#if print_enable}}
<a href="{{ path_to_root }}print.html" title="Print this book" aria-label="Print this book">
<i id="print-button" class="fa fa-print"></i>
</a>
{{/if}}
{{#if git_repository_url}}
<a href="{{git_repository_url}}" title="Git repository" aria-label="Git repository">
<i id="git-repository-button" class="fa {{git_repository_icon}}"></i>
</a>
{{/if}}
{{#if git_repository_edit_url}}
<a href="{{git_repository_edit_url}}" title="Suggest an edit" aria-label="Suggest an edit">
<i id="git-edit-button" class="fa fa-edit"></i>
</a>
{{/if}}
</div>
</div>
{{#if search_enabled}}
<div id="search-wrapper" class="hidden">
<form id="searchbar-outer" class="searchbar-outer">
<input type="search" id="searchbar" name="searchbar" placeholder="Search this book ..." aria-controls="searchresults-outer" aria-describedby="searchresults-header">
</form>
<div id="searchresults-outer" class="searchresults-outer hidden">
<div id="searchresults-header" class="searchresults-header"></div>
<ul id="searchresults">
</ul>
</div>
</div>
{{/if}}
<!-- Apply ARIA attributes after the sidebar and the sidebar toggle button are added to the DOM -->
<script>
document.getElementById('sidebar-toggle').setAttribute('aria-expanded', sidebar === 'visible');
document.getElementById('sidebar').setAttribute('aria-hidden', sidebar !== 'visible');
Array.from(document.querySelectorAll('#sidebar a')).forEach(function(link) {
link.setAttribute('tabIndex', sidebar === 'visible' ? 0 : -1);
});
</script>
<div id="content" class="content">
<main>
{{{ content }}}
</main>
<nav class="nav-wrapper" aria-label="Page navigation">
<!-- Mobile navigation buttons -->
{{#previous}}
<a rel="prev" href="{{ path_to_root }}{{link}}" class="mobile-nav-chapters previous" title="Previous chapter" aria-label="Previous chapter" aria-keyshortcuts="Left">
<i class="fa fa-angle-left"></i>
</a>
{{/previous}}
{{#next}}
<a rel="next prefetch" href="{{ path_to_root }}{{link}}" class="mobile-nav-chapters next" title="Next chapter" aria-label="Next chapter" aria-keyshortcuts="Right">
<i class="fa fa-angle-right"></i>
</a>
{{/next}}
<div style="clear: both"></div>
</nav>
</div>
</div>
<nav class="nav-wide-wrapper" aria-label="Page navigation">
{{#previous}}
<a rel="prev" href="{{ path_to_root }}{{link}}" class="nav-chapters previous" title="Previous chapter" aria-label="Previous chapter" aria-keyshortcuts="Left">
<i class="fa fa-angle-left"></i>
</a>
{{/previous}}
{{#next}}
<a rel="next prefetch" href="{{ path_to_root }}{{link}}" class="nav-chapters next" title="Next chapter" aria-label="Next chapter" aria-keyshortcuts="Right">
<i class="fa fa-angle-right"></i>
</a>
{{/next}}
</nav>
</div>
{{#if live_reload_endpoint}}
<!-- Livereload script (if served using the cli tool) -->
<script>
const wsProtocol = location.protocol === 'https:' ? 'wss:' : 'ws:';
const wsAddress = wsProtocol + "//" + location.host + "/" + "{{{live_reload_endpoint}}}";
const socket = new WebSocket(wsAddress);
socket.onmessage = function (event) {
if (event.data === "reload") {
socket.close();
location.reload();
}
};
window.onbeforeunload = function() {
socket.close();
}
</script>
{{/if}}
{{#if google_analytics}}
<!-- Google Analytics Tag -->
<script>
var localAddrs = ["localhost", "127.0.0.1", ""];
// make sure we don't activate google analytics if the developer is
// inspecting the book locally...
if (localAddrs.indexOf(document.location.hostname) === -1) {
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
ga('create', '{{google_analytics}}', 'auto');
ga('send', 'pageview');
}
</script>
{{/if}}
{{#if playground_line_numbers}}
<script>
window.playground_line_numbers = true;
</script>
{{/if}}
{{#if playground_copyable}}
<script>
window.playground_copyable = true;
</script>
{{/if}}
{{#if playground_js}}
<script src="{{ path_to_root }}ace.js"></script>
<script src="{{ path_to_root }}editor.js"></script>
<script src="{{ path_to_root }}mode-rust.js"></script>
<script src="{{ path_to_root }}theme-dawn.js"></script>
<script src="{{ path_to_root }}theme-tomorrow_night.js"></script>
{{/if}}
{{#if search_js}}
<script src="{{ path_to_root }}elasticlunr.min.js"></script>
<script src="{{ path_to_root }}mark.min.js"></script>
<script src="{{ path_to_root }}searcher.js"></script>
{{/if}}
<script src="{{ path_to_root }}clipboard.min.js"></script>
<script src="{{ path_to_root }}highlight.js"></script>
<script src="{{ path_to_root }}book.js"></script>
<!-- Custom JS scripts -->
{{#each additional_js}}
<script src="{{ ../path_to_root }}{{this}}"></script>
{{/each}}
{{#if is_print}}
{{#if mathjax_support}}
<script>
window.addEventListener('load', function() {
MathJax.Hub.Register.StartupHook('End', function() {
window.setTimeout(window.print, 100);
});
});
</script>
{{else}}
<script>
window.addEventListener('load', function() {
window.setTimeout(window.print, 100);
});
</script>
{{/if}}
{{/if}}
</div>
</body>
</html>