Merge remote-tracking branch 'upstream/main'

This commit is contained in:
phil 2025-02-08 14:27:32 +01:00
commit 43fff7a68f
49 changed files with 4366 additions and 5094 deletions

View file

@ -1,13 +0,0 @@
{
"env": {
"browser": true,
"es2017": true
},
"extends": ["plugin:prettier/recommended"],
"parser": "@babel/eslint-parser",
"parserOptions": {
"sourceType": "module",
"requireConfigFile": false
},
"plugins": ["prettier"]
}

View file

@ -8,7 +8,7 @@ ci:
- http://localhost/404.html
- http://localhost/usage/getting-started/
settings:
chromeFlags: "--no-sandbox"
chromeFlags: "--no-sandbox --headless --disable-dev-shm-usage"
onlyCategories: ["performance", "accessibility", "best-practices", "seo"]
skipAudits:
[

View file

@ -1,3 +1,4 @@
https://github.com/thegeeklab/.+/edit/main/.*
https://unsplash.com.*
https://www.color-hex.com.*
https://geekdocs.de/

1
.nvmrc Normal file
View file

@ -0,0 +1 @@
lts/*

View file

@ -44,7 +44,7 @@ steps:
- event: [pull_request]
- name: build
image: quay.io/thegeeklab/hugo:0.124.1
image: quay.io/thegeeklab/hugo:0.143
commands:
- hugo --panicOnWarning -s exampleSite/

View file

@ -13,12 +13,12 @@ steps:
settings:
homeserver:
from_secret: matrix_homeserver
password:
from_secret: matrix_password
roomid:
from_secret: matrix_roomid
username:
from_secret: matrix_username
room_id:
from_secret: matrix_room_id
user_id:
from_secret: matrix_user_id
access_token:
from_secret: matrix_access_token
when:
- status: [success, failure]

View file

@ -16,6 +16,7 @@ steps:
- name: assets
image: docker.io/library/node:lts
depends_on: [eslint]
commands:
- npm install --quiet --no-progress
- npm run build
@ -23,14 +24,15 @@ steps:
FORCE_COLOR: "true"
- name: testbuild
image: quay.io/thegeeklab/hugo:0.124.1
image: quay.io/thegeeklab/hugo:0.143
depends_on: [assets]
commands:
- mkdir -p exampleSite/themes/ && ln -s $(pwd)/ exampleSite/themes/${CI_REPO_NAME}
- hugo --panicOnWarning -s exampleSite/ -b http://localhost:8000/
- name: html-validation
image: docker.io/library/node:lts
group: test
depends_on: [testbuild]
commands:
- npm install --quiet --no-progress
- npm run lint:html
@ -39,13 +41,13 @@ steps:
- name: link-validation
image: docker.io/lycheeverse/lychee
group: test
depends_on: [testbuild]
commands:
- lychee --no-progress --format detailed exampleSite/content/ README.md
- name: page-validation
image: quay.io/thegeeklab/lhci:0.13
group: test
image: quay.io/thegeeklab/lhci:0.14
depends_on: [testbuild]
commands:
- lhci autorun
environment:

View file

@ -1,7 +1,7 @@
# Geekdoc
[![Build Status](https://ci.thegeeklab.de/api/badges/thegeeklab/hugo-geekdoc/status.svg)](https://ci.thegeeklab.de/repos/thegeeklab/hugo-geekdoc)
[![Hugo Version](https://img.shields.io/badge/hugo-0.112-blue.svg)](https://gohugo.io)
[![Hugo Version](https://img.shields.io/badge/hugo-0.124-blue.svg)](https://gohugo.io)
[![GitHub release](https://img.shields.io/github/v/release/thegeeklab/hugo-geekdoc)](https://github.com/thegeeklab/hugo-geekdoc/releases/latest)
[![GitHub contributors](https://img.shields.io/github/contributors/thegeeklab/hugo-geekdoc)](https://github.com/thegeeklab/hugo-geekdoc/graphs/contributors)
[![License: MIT](https://img.shields.io/github/license/thegeeklab/hugo-geekdoc)](https://github.com/thegeeklab/hugo-geekdoc/blob/main/LICENSE)

22
eslint.config.js Normal file
View file

@ -0,0 +1,22 @@
import eslint from "@eslint/js";
import globals from "globals";
import babelParser from "@babel/eslint-parser";
import eslintPluginPrettierRecommended from "eslint-plugin-prettier/recommended";
export default [
eslint.configs.recommended,
{
languageOptions: {
globals: {
...globals.browser,
},
parser: babelParser,
ecmaVersion: 2022,
sourceType: "module",
parserOptions: {
requireConfigFile: false,
},
},
},
eslintPluginPrettierRecommended,
];

View file

@ -41,4 +41,5 @@ outputs:
security:
exec:
allow:
- "^git$"
- "^asciidoctor$"

View file

@ -11,6 +11,7 @@ geekdocTagsToMenu: true
geekdocRepo: https://github.com/thegeeklab/hugo-geekdoc
geekdocEditPath: edit/main/exampleSite
geekdocPageLastmod: false
geekdocSearch: true
geekdocSearchShowParent: true

View file

@ -9,7 +9,7 @@ geekdocAnchor: false
<!-- markdownlint-disable MD033 -->
<span class="badge-placeholder">[![Build Status](https://ci.thegeeklab.de/api/badges/thegeeklab/hugo-geekdoc/status.svg)](https://ci.thegeeklab.de/repos/thegeeklab/hugo-geekdoc)</span>
<span class="badge-placeholder">[![Hugo Version](https://img.shields.io/badge/hugo-0.112-blue.svg)](https://gohugo.io)</span>
<span class="badge-placeholder">[![Hugo Version](https://img.shields.io/badge/hugo-0.124-blue.svg)](https://gohugo.io)</span>
<span class="badge-placeholder">[![GitHub release](https://img.shields.io/github/v/release/thegeeklab/hugo-geekdoc)](https://github.com/thegeeklab/hugo-geekdoc/releases/latest)</span>
<span class="badge-placeholder">[![GitHub contributors](https://img.shields.io/github/contributors/thegeeklab/hugo-geekdoc)](https://github.com/thegeeklab/hugo-geekdoc/graphs/contributors)</span>
<span class="badge-placeholder">[![License: MIT](https://img.shields.io/github/license/thegeeklab/hugo-geekdoc)](https://github.com/thegeeklab/hugo-geekdoc/blob/main/LICENSE)</span>

View file

@ -58,4 +58,33 @@ If you want to add more Favicon formats you have to [overwrite](https://gohugo.i
<meta name="theme-color" content="#efefef">
```
## Fonts
To use a custom font, it needs to be specified first. While there are many ways to do this, we recommend to use `@font-face` as it supports local as well as remote fonts. If you want to serve the fonts from your own server, you have to place them in the `static/fonts` folder of your project.
The font registration is done in the `custom.css` file. There are also a few custom CSS properties available to simplify the usage of custom fonts.
**Example:**
<!-- prettier-ignore -->
```css
@font-face {
font-family: "DancingScript";
src:
url("fonts/DancingScript.woff2") format("woff2"),
url("fonts/DancingScript.woff") format("woff");
font-weight: normal;
font-style: normal;
font-display: swap;
}
:root {
--code-max-height: 60rem;
--header-font-family: "DancingScript";
--body-font-family: "DancingScript";
--code-font-family: "DancingScript";
}
```
Happy customizing!

View file

@ -28,31 +28,31 @@ Dolor sit, sumo unique argument um no. Gracie nominal id xiv. Romanesque acclima
{{< hint type=note >}}
**Markdown content**\
Dolor sit, sumo unique argument um no. Gracie nominal id xiv. Romanesque acclimates investiture.
Dolor sit, sumo unique `argument um no`. Gracie nominal id xiv. Romanesque acclimates investiture.
Ornateness bland it ex enc, est yeti am bongo detract re.
{{< /hint >}}
{{< hint type=tip >}}
**Markdown content**\
Dolor sit, sumo unique argument um no. Gracie nominal id xiv. Romanesque acclimates investiture.
Dolor sit, sumo unique `argument um no`. Gracie nominal id xiv. Romanesque acclimates investiture.
Ornateness bland it ex enc, est yeti am bongo detract re.
{{< /hint >}}
{{< hint type=important >}}
**Markdown content**\
Dolor sit, sumo unique argument um no. Gracie nominal id xiv. Romanesque acclimates investiture.
Dolor sit, sumo unique `argument um no`. Gracie nominal id xiv. Romanesque acclimates investiture.
Ornateness bland it ex enc, est yeti am bongo detract re.
{{< /hint >}}
{{< hint type=caution >}}
**Markdown content**\
Dolor sit, sumo unique argument um no. Gracie nominal id xiv. Romanesque acclimates investiture.
Dolor sit, sumo unique `argument um no`. Gracie nominal id xiv. Romanesque acclimates investiture.
Ornateness bland it ex enc, est yeti am bongo detract re.
{{< /hint >}}
{{< hint type=warning >}}
**Markdown content**\
Dolor sit, sumo unique argument um no. Gracie nominal id xiv. Romanesque acclimates investiture.
Dolor sit, sumo unique `argument um no`. Gracie nominal id xiv. Romanesque acclimates investiture.
Ornateness bland it ex enc, est yeti am bongo detract re.
Romanesque acclimates investiture.

View file

@ -70,6 +70,10 @@ enableRobotsTXT = true
# You can also specify this parameter per page in front matter.
geekdocEditPath = "edit/main/exampleSite"
# (Optional, default false) Show last modification date of the page in the header.
# Keep in mind that last modification date works best if `enableGitInfo` is set to true.
geekdocPageLastmod = true
# (Optional, default true) Enables search function with flexsearch.
# Index is built on the fly and might slow down your website.
geekdocSearch = false
@ -196,6 +200,10 @@ params:
# You can also specify this parameter per page in front matter.
geekdocEditPath: edit/main/exampleSite
# (Optional, default false) Show last modification date of the page in the header.
# Keep in mind that last modification date works best if `enableGitInfo` is set to true.
geekdocPageLastmod: true
# (Optional, default true) Enables search function with flexsearch.
# Index is built on the fly and might slow down your website.
geekdocSearch: false
@ -294,6 +302,9 @@ geekdocRepo = "https://github.com/thegeeklab/hugo-geekdoc"
# the parent directory of the 'content' folder.
geekdocEditPath = "edit/main/exampleSite"
# Show last modification date of the page in the header.
geekdocPageLastmod = true
# Used for 'Edit page' link, set to '.File.Path' by default.
# Can be overwritten by a path relative to 'geekdocEditPath'
geekdocFilePath =
@ -354,6 +365,9 @@ geekdocRepo: "https://github.com/thegeeklab/hugo-geekdoc"
# the parent directory of the 'content' folder.
geekdocEditPath: "edit/main/exampleSite"
# Show last modification date of the page in the header.
geekdocPageLastmod: true
# Used for 'Edit page' link, set to '.File.Path' by default.
# Can be overwritten by a path relative to 'geekdocEditPath'
geekdocFilePath:

View file

@ -2,6 +2,10 @@
:root {
--code-max-height: 60rem;
--header-font-family: "DancingScript";
--body-font-family: "DancingScript";
--code-font-family: "DancingScript";
}
/* Light mode theming */
@ -152,3 +156,13 @@
--footer-link-color-visited: #ffcc5c;
}
}
@font-face {
font-family: "DancingScript";
src:
url("fonts/DancingScript.woff2") format("woff2"),
url("fonts/DancingScript.woff") format("woff");
font-weight: normal;
font-style: normal;
font-display: swap;
}

53
i18n/da.yaml Normal file
View file

@ -0,0 +1,53 @@
---
edit_page: Rediger side
nav_navigation: Navigation
nav_tags: Tags
nav_more: Mere
nav_top: Til toppen
form_placeholder_search: Søg
error_page_title: Faret vild? Bare rolig
error_message_title: Lost?
error_message_code: Fejl 404
error_message_text: >
Det du leder efter kan ikke findes. Bare rolig, du kan komme tilbage til
<a class="gdoc-error__link" href="{{ . }}">forsiden</a>.
button_toggle_dark: Skift Dark/Light/Auto mode
button_nav_open: Åben navigation
button_nav_close: Luk navigation
button_menu_open: Åben menubar
button_menu_close: Luk menubar
button_homepage: Tilbage til forsiden
title_anchor_prefix: "Link til:"
posts_read_more: Læs fulde indlæg
posts_read_time:
one: "Et minut at gennemlæse"
other: "{{ . }} minutter at gennemlæse"
posts_update_prefix: Opdateret den
posts_count:
one: "Et indlæg"
other: "{{ . }} indlæg"
posts_tagged_with: Alle indslag tagget med '{{ . }}'
footer_build_with: >
Bygget med <a href="https://gohugo.io/" class="gdoc-footer__link">Hugo</a> og
<svg class="gdoc-icon gdoc_heart"><use xlink:href="#gdoc_heart"></use></svg>
footer_legal_notice: Forretningsbetingelser
footer_privacy_policy: Privatlivspolitik
footer_content_license_prefix: >
Indhold licenseret under
language_switch_no_tranlation_prefix: "Indlæg ikke oversat:"
propertylist_required: påkrævet
propertylist_optional: valgfri
propertylist_default: udgangspunkt
pagination_page_prev: forrige
pagination_page_next: næste
pagination_page_state: "{{ .PageNumber }}/{{ .TotalPages }}"

53
i18n/oc.yaml Normal file
View file

@ -0,0 +1,53 @@
---
edit_page: Modificar la pagina
nav_navigation: Navegacion
nav_tags: Etiquetas
nav_more: Mai
nav_top: Tornar ennaut
form_placeholder_search: Cercar
error_page_title: Perdut ? Cap de problèma
error_message_title: Perdut ?
error_message_code: Error 404
error_message_text: >
Sembla que cercatz quicòm que se pòt pas trobat. Vosn fagatz pas vos podèm
tornar a la <a class="gdoc-error__link" href="{{ . }}">pagina dacuèlh</a>.
button_toggle_dark: Alternar lo mòde escur/clar/auto
button_nav_open: Dobrir la navegacion
button_nav_close: Tampar la navegacion
button_menu_open: Dobrir la barra de menú
button_menu_close: Tampar la barra de menú
button_homepage: Tornar a la pagina dacuèlh
title_anchor_prefix: "Ancorar a:"
posts_read_more: Legir la publicacion complèta
posts_read_time:
one: "Una minuta de lectura"
other: "{{ . }} minutas de lectura"
posts_update_prefix: Actualizada lo
posts_count:
one: "Una publicacion"
other: "{{ . }} publicacions"
posts_tagged_with: Totas las publicacions amb '{{ . }}'
footer_build_with: >
Construch amb <a href="https://gohugo.io/" class="gdoc-footer__link">Hugo</a> e
<svg class="gdoc-icon gdoc_heart"><use xlink:href="#gdoc_heart"></use></svg>
footer_legal_notice: Mencions legalas
footer_privacy_policy: politica de confidencialitat
footer_content_license_prefix: >
Contengut sota licéncia
language_switch_no_tranlation_prefix: "Pagina non traducha :"
propertylist_required: requerit
propertylist_optional: opcional
propertylist_default: per defaut
pagination_page_prev: prec.
pagination_page_next: seg.
pagination_page_state: "{{ .PageNumber }}/{{ .TotalPages }}"

View file

@ -6,6 +6,7 @@
class="gdoc-markdown gdoc-markdown__align--{{ default "left" (.Page.Params.geekdocAlign | lower) }}"
>
<h1>{{ partial "utils/title" . }}</h1>
{{ partial "page-metadata" . }}
{{ partial "utils/content" . }}
</article>
{{ end }}

View file

@ -1,4 +1,4 @@
{{ if .Site.IsMultiLingual }}
{{ if hugo.IsMultilingual }}
<span class="gdoc-language">
<ul class="gdoc-language__selector" role="button" aria-pressed="false" tabindex="0">
<li>

View file

@ -63,6 +63,6 @@
{{- end }}
{{- /* Facebook Page Admin ID for Domain Insights */}}
{{- with .Site.Social.facebook_admin }}
{{- with .Site.Params.facebook_admin }}
<meta property="fb:admins" content="{{ . }}" />
{{- end }}

View file

@ -10,6 +10,6 @@
{{- with partial "utils/description" . }}
<meta name="twitter:description" content="{{ . | plainify | htmlUnescape | chomp }}" />
{{- end }}
{{- with .Site.Social.twitter -}}
{{- with .Site.Params.twitter -}}
<meta name="twitter:site" content="@{{ . }}" />
{{- end }}

View file

@ -0,0 +1,13 @@
{{- $showPageLastmod := (or (default false .Page.Params.geekdocPageLastmod) (default false .Site.Params.geekdocPageLastmod)) -}}
{{- if $showPageLastmod -}}
<span class="flex align-center no-wrap">
<svg class="gdoc-icon gdoc_date"><use xlink:href="#gdoc_date"></use></svg>
<time datetime="{{ .Lastmod.Format "2006-01-02T15:04:05Z07:00" | safeHTML }}">
{{ if .Lastmod.After (.Date.AddDate 0 0 1) }}
{{ i18n "posts_update_prefix" }}
{{ end }}
{{ .Lastmod.Format "Jan 2, 2006" }}
</time>
</span>
{{- end -}}

View file

@ -0,0 +1 @@
<script src="https://gist.github.com/{{ index .Params 0 }}/{{ index .Params 1 }}.js{{if len .Params | eq 3 }}?file={{ index .Params 2 }}{{end}}"></script>

8275
package-lock.json generated

File diff suppressed because it is too large Load diff

View file

@ -3,6 +3,7 @@
"version": "1.0.0",
"description": "Hugo theme made for documentation",
"main": "index.js",
"type": "module",
"scripts": {
"build": "run-s prep:clean prep:make svg build:webpack",
"build:webpack": "webpack --mode=production",
@ -30,40 +31,40 @@
"author": "Robert Kaussow",
"license": "MIT",
"engines": {
"node": ">=18 <=20"
"node": ">=18 <=22"
},
"dependencies": {
"@cfworker/json-schema": "1.12.8",
"@cfworker/json-schema": "4.1.1",
"clipboard": "2.0.11",
"flexsearch": "0.7.43",
"katex": "0.16.10",
"katex": "0.16.21",
"lodash": "4.17.21",
"mermaid": "10.9.0",
"store2": "2.14.3",
"uuid": "9.0.1"
"mermaid": "11.4.1",
"store2": "2.14.4",
"uuid": "11.0.5"
},
"devDependencies": {
"@babel/eslint-parser": "7.24.1",
"@eloquent/git-version-webpack-plugin": "5.0.1",
"autoprefixer": "10.4.19",
"@babel/eslint-parser": "7.26.5",
"autoprefixer": "10.4.20",
"copy-webpack-plugin": "12.0.2",
"css-loader": "7.1.1",
"eslint": "8.57.0",
"eslint-config-prettier": "9.1.0",
"eslint-plugin-prettier": "5.1.3",
"css-loader": "7.1.2",
"eslint": "9.19.0",
"eslint-config-prettier": "10.0.1",
"eslint-plugin-prettier": "5.2.3",
"favicons": "7.2.0",
"favicons-webpack-plugin": "6.0.1",
"html-validate": "8.18.1",
"npm-run-all2": "6.1.2",
"globals": "15.14.0",
"html-validate": "9.2.0",
"npm-run-all2": "7.0.2",
"postcss-loader": "8.1.1",
"prettier": "3.2.5",
"sass": "1.75.0",
"sass-loader": "14.2.0",
"prettier": "3.4.2",
"sass": "1.83.4",
"sass-loader": "16.0.4",
"shx": "0.3.4",
"svg-sprite": "2.0.4",
"svgtofont": "4.2.0",
"webpack": "5.91.0",
"webpack-cli": "5.1.4",
"svgtofont": "6.2.0",
"webpack": "5.97.1",
"webpack-cli": "6.0.1",
"webpack-manifest-plugin": "5.0.0",
"webpack-remove-empty-scripts": "1.0.4"
},

View file

@ -4,7 +4,7 @@ import { TOGGLE_COLOR_THEMES, THEME, COLOR_THEME_AUTO } from "./config.js"
applyTheme()
})()
document.addEventListener("DOMContentLoaded", (event) => {
document.addEventListener("DOMContentLoaded", () => {
const colorThemeToggle = document.getElementById("gdoc-color-theme")
colorThemeToggle.onclick = function () {

View file

@ -1,6 +1,6 @@
import Clipboard from "clipboard"
document.addEventListener("DOMContentLoaded", function (event) {
document.addEventListener("DOMContentLoaded", function () {
let clipboard = new Clipboard(".clip")
clipboard.on("success", function (e) {

View file

@ -4,7 +4,7 @@ import { COLOR_THEME_DARK, THEME, COLOR_THEME_AUTO } from "./config.js"
import mermaid from "mermaid"
document.addEventListener("DOMContentLoaded", function (event) {
document.addEventListener("DOMContentLoaded", function () {
let lstore = Storage.namespace(THEME)
let currentMode = lstore.get("color-theme") || COLOR_THEME_AUTO
let darkModeQuery = window.matchMedia("(prefers-color-scheme: dark)")

View file

@ -1,9 +1,9 @@
import groupBy from "lodash/groupBy"
import truncate from "lodash/truncate"
import Document from "flexsearch/dist/module/document"
import groupBy from "lodash/groupBy.js"
import truncate from "lodash/truncate.js"
import Document from "flexsearch/dist/module/document.js"
import { Validator } from "@cfworker/json-schema"
document.addEventListener("DOMContentLoaded", function (event) {
document.addEventListener("DOMContentLoaded", function () {
const input = document.querySelector("#gdoc-search-input")
const results = document.querySelector("#gdoc-search-results")
const basePath = urlPath(input ? input.dataset.siteBaseUrl : "")

View file

@ -1,17 +1,22 @@
@use "sass:color";
@use "defaults";
.admonitionblock {
@each $name, $color in $hint-colors {
@each $name, $color in defaults.$hint-colors {
&.#{$name} {
border-left-color: $color;
background-color: scale-color($color, $lightness: 95%, $saturation: -30%);
color: $body-font-color;
background-color: color.scale($color, $lightness: 95%, $saturation: -30%);
color: defaults.$body-font-color;
}
}
margin: $padding-16 0;
padding: 0;
& {
margin: defaults.$padding-16 0;
padding: 0;
border-left: $border-4 solid var(--accent-color);
border-radius: $border-radius;
border-left: defaults.$border-4 solid var(--accent-color);
border-radius: defaults.$border-radius;
}
table {
margin: 0 !important;
@ -22,8 +27,11 @@
}
td {
display: block;
padding: defaults.$padding-4 defaults.$padding-16 !important;
&:first-child {
background-color: scale-color($gray-600, $alpha: -95%);
background-color: color.scale(defaults.$gray-600, $alpha: -95%);
font-weight: bold;
&.icon {
@ -35,27 +43,24 @@
i.fa::after {
content: attr(title);
font-style: normal;
padding-left: $padding-24;
padding-left: defaults.$padding-24;
}
i.fa {
color: $black;
color: defaults.$black;
background-size: auto 90%;
background-repeat: no-repeat;
filter: invert(30%);
margin-left: -5px;
}
@each $name, $icon in $hint-icons {
@each $name, $icon in defaults.$hint-icons {
i.fa.icon-#{$name} {
background-image: url(img/geekdoc-stack.svg##{$icon});
}
}
}
}
display: block;
padding: $padding-4 $padding-16 !important;
}
}
}

View file

@ -1,36 +1,47 @@
:root,
:root[color-theme="light"] {
@use "sass:meta";
@use "sass:map";
@use "color_mode";
@use "defaults";
:root {
--code-max-height: none;
@include color_theme_light;
@include code_theme_light;
--header-font-family: #{meta.inspect(defaults.$header-font-family)};
--body-font-family: #{meta.inspect(defaults.$body-font-family)};
--code-font-family: #{meta.inspect(defaults.$code-font-family)};
}
:root,
:root[color-theme="light"] {
@include color_mode.color_theme_light;
@include color_mode.code_theme_light;
}
@media (prefers-color-scheme: light) {
:root {
@include color_theme_light;
@include code_theme_light;
@include color_mode.color_theme_light;
@include color_mode.code_theme_light;
}
}
:root[color-theme="dark"] {
@include color_theme_dark;
@include code_theme_dark;
@include color_mode.color_theme_dark;
@include color_mode.code_theme_dark;
}
:root[code-theme="dark"] {
@include code_theme_dark;
@include color_mode.code_theme_dark;
}
@media (prefers-color-scheme: dark) {
:root {
@include color_theme_dark;
@include code_theme_dark;
@include color_mode.color_theme_dark;
@include color_mode.code_theme_dark;
}
}
html {
font-size: $font-size-base;
font-size: defaults.$font-size-base;
letter-spacing: 0.33px;
scroll-behavior: smooth;
@ -81,7 +92,7 @@ html {
html,
body {
min-width: $body-min-width;
min-width: defaults.$body-min-width;
overflow-x: hidden;
}
@ -102,7 +113,7 @@ h3,
h4,
h5,
h6 {
font-weight: $body-font-weight;
font-weight: defaults.$body-font-weight;
display: flex;
align-items: center;
}
@ -110,7 +121,7 @@ h6 {
h4,
h5,
h6 {
font-size: $font-size-16 !important;
font-size: defaults.$font-size-16 !important;
}
a {
@ -154,8 +165,8 @@ img {
color: var(--body-font-color);
background: var(--accent-color-gray);
font-weight: $body-font-weight;
font-weight: defaults.$body-font-weight;
}
.wrapper.home {
@ -164,15 +175,15 @@ img {
.container {
width: 100%;
max-width: $container-max-width;
max-width: defaults.$container-max-width;
margin: 0 auto;
padding: $padding-20;
padding: defaults.$padding-20;
}
svg.gdoc-icon {
display: inline-block;
width: $font-size-20;
height: $font-size-20;
width: defaults.$font-size-20;
height: defaults.$font-size-20;
vertical-align: middle;
stroke-width: 0;
stroke: currentColor;
@ -195,19 +206,19 @@ svg.gdoc-icon {
}
svg.gdoc-icon {
width: $font-size-32;
height: $font-size-32;
width: defaults.$font-size-32;
height: defaults.$font-size-32;
}
}
.gdoc-brand {
font-size: $font-size-32;
line-height: $font-size-32;
font-size: defaults.$font-size-32;
line-height: defaults.$font-size-32;
&__img {
margin-right: $padding-16;
width: $padding-32;
height: $padding-32;
margin-right: defaults.$padding-16;
width: defaults.$padding-32;
height: defaults.$padding-32;
}
}
@ -216,7 +227,7 @@ svg.gdoc-icon {
display: flex;
> span {
margin-left: $padding-8;
margin-left: defaults.$padding-8;
}
}
@ -235,15 +246,15 @@ svg.gdoc-icon {
font-size: $font-size-14;
nav {
width: $menu-width;
padding: $padding-16 $padding-32 $padding-16 0;
width: defaults.$menu-width;
padding: defaults.$padding-16 defaults.$padding-32 defaults.$padding-16 0;
> ul > li > * {
font-weight: normal;
}
section {
margin-top: $padding-32;
margin-top: defaults.$padding-32;
}
}
@ -266,7 +277,7 @@ svg.gdoc-icon {
}
&__list {
padding-left: $padding-16;
padding-left: defaults.$padding-16;
margin: 0;
padding: 0;
list-style: none;
@ -274,11 +285,11 @@ svg.gdoc-icon {
border-bottom: 1px solid $gray-300;
ul {
padding-left: $padding-16;
padding-left: defaults.$padding-16;
}
li {
margin: $padding-12 0;
margin: defaults.$padding-12 0;
border-top: 1px solid $gray-300;
padding-top: 10px;
padding-bottom: 10px;
@ -298,7 +309,7 @@ svg.gdoc-icon {
}
svg.gdoc-icon {
margin-right: $padding-4;
margin-right: defaults.$padding-4;
}
}
@ -309,8 +320,8 @@ svg.gdoc-icon {
cursor: pointer;
svg.gdoc-icon.toggle {
width: $font-size-16;
height: $font-size-16;
width: defaults.$font-size-16;
height: defaults.$font-size-16;
}
}
@ -364,22 +375,22 @@ svg.gdoc-icon {
.gdoc-search__list,
.gdoc-language__list {
background: var(--body-background);
border-radius: $border-radius;
border-radius: defaults.$border-radius;
box-shadow:
0 1px 3px 0 var(--accent-color-dark),
0 1px 2px 0 var(--accent-color);
position: absolute;
margin: 0;
padding: $padding-8 $padding-4 !important;
padding: defaults.$padding-8 defaults.$padding-4 !important;
list-style: none;
top: calc(100% + #{$padding-8});
top: calc(100% + #{defaults.$padding-8});
z-index: 2;
}
.gdoc-page {
min-width: calc($body-min-width - $padding-32);
min-width: calc(defaults.$body-min-width - defaults.$padding-32);
flex-grow: 1;
padding: $padding-16 $padding-32;
padding: defaults.$padding-16 $padding-32;
box-shadow: 1px 1px 4px $shadow-1;
background: var(--body-background);
@ -395,7 +406,7 @@ svg.gdoc-icon {
&__header,
&__footer {
margin-bottom: $padding-24;
margin-bottom: defaults.$padding-24;
svg.gdoc-icon {
color: var(--control-icons);
@ -409,8 +420,8 @@ svg.gdoc-icon {
&__header {
background: var(--accent-color-lite);
padding: $padding-8 $padding-16;
border-radius: $border-radius;
padding: defaults.$padding-8 defaults.$padding-16;
border-radius: defaults.$border-radius;
}
&__nav {
@ -449,7 +460,7 @@ svg.gdoc-icon {
}
&__footer {
margin-top: $padding-32;
margin-top: defaults.$padding-32;
a:hover {
text-decoration: none;
@ -459,8 +470,8 @@ svg.gdoc-icon {
.gdoc-post {
word-wrap: break-word;
border-top: 1px dashed $gray-600;
padding: $padding-32 0;
border-top: 1px dashed defaults.$gray-600;
padding: defaults.$padding-32 0;
&:first-of-type {
padding-top: 0;
@ -493,7 +504,7 @@ svg.gdoc-icon {
}
&__readmore {
margin: $padding-32 0;
margin: defaults.$padding-32 0;
a,
a:hover,
@ -509,22 +520,22 @@ svg.gdoc-icon {
}
> span {
margin: $padding-4 0;
margin: defaults.$padding-4 0;
&:not(:last-child) {
margin-right: $padding-8;
margin-right: defaults.$padding-8;
}
}
svg.gdoc-icon {
font-size: $font-size-20;
font-size: defaults.$font-size-20;
}
.gdoc-button {
margin: 0 $padding-2 0 0;
margin: 0 defaults.$padding-2 0 0;
}
&--head {
margin-bottom: $padding-32;
margin-bottom: defaults.$padding-32;
}
}
@ -539,19 +550,19 @@ svg.gdoc-icon {
&__codecopy {
visibility: hidden;
position: absolute;
top: $padding-8;
right: $padding-8;
top: defaults.$padding-8;
right: defaults.$padding-8;
border: $border-2 solid var(--code-copy-border-color);
border-radius: $border-radius;
border: defaults.$border-2 solid var(--code-copy-border-color);
border-radius: defaults.$border-radius;
background: var(--code-copy-background);
width: $padding-32;
height: $padding-32;
width: defaults.$padding-32;
height: defaults.$padding-32;
svg.gdoc-icon {
top: 0;
width: $font-size-20;
height: $font-size-20;
width: defaults.$font-size-20;
height: defaults.$font-size-20;
color: var(--code-copy-font-color);
}
@ -586,10 +597,10 @@ svg.gdoc-icon {
}
&__item {
line-height: $padding-32;
line-height: defaults.$padding-32;
&--row {
margin-right: $padding-16;
margin-right: defaults.$padding-16;
}
}
@ -608,10 +619,10 @@ svg.gdoc-icon {
svg.gdoc-icon {
position: absolute;
left: $padding-8;
left: defaults.$padding-8;
color: var(--control-icons);
width: $font-size-20;
height: $font-size-20;
width: defaults.$font-size-20;
height: defaults.$font-size-20;
}
&::after {
@ -622,14 +633,14 @@ svg.gdoc-icon {
&__input {
width: 100%;
padding: $padding-8;
padding-left: $padding-32;
padding: defaults.$padding-8;
padding-left: defaults.$padding-32;
transition:
border-color 0.15s ease-in-out,
box-shadow 0.15s ease-in-out;
border: 1px solid transparent;
border-radius: $border-radius;
border-radius: defaults.$border-radius;
background: var(--accent-color-lite);
color: var(--body-font-color);
@ -655,26 +666,26 @@ svg.gdoc-icon {
}
> li + li {
margin-top: $padding-4;
margin-top: defaults.$padding-4;
}
svg.gdoc-icon {
margin-right: $padding-4;
margin-right: defaults.$padding-4;
}
}
&__section {
display: flex;
flex-direction: column;
padding: $padding-4 !important;
padding: defaults.$padding-4 !important;
}
&__entry {
display: flex;
flex-direction: column;
color: var(--body-font-color);
padding: $padding-4 !important;
border-radius: $border-radius;
padding: defaults.$padding-4 !important;
border-radius: defaults.$border-radius;
&:hover,
&.is-active {
@ -692,7 +703,7 @@ svg.gdoc-icon {
}
&--description {
font-size: $font-size-14;
font-size: defaults.$font-size-14;
font-style: italic;
}
}
@ -731,7 +742,7 @@ svg.gdoc-icon {
}
.gdoc-paging {
padding: $padding-16 0;
padding: defaults.$padding-16 0;
&__item {
flex: 1 1 0;
@ -743,7 +754,7 @@ svg.gdoc-icon {
a:hover,
a:visited:hover {
background: var(--link-color);
color: $gray-100;
color: defaults.$gray-100;
}
&--next {
@ -757,13 +768,13 @@ svg.gdoc-icon {
}
.gdoc-error {
padding: $padding-96 $padding-16;
padding: defaults.$padding-96 defaults.$padding-16;
margin: 0 auto;
max-width: 45em;
svg.gdoc-icon {
width: $font-size-128;
height: $font-size-128;
width: defaults.$font-size-128;
height: defaults.$font-size-128;
color: var(--body-font-color);
}
@ -774,15 +785,15 @@ svg.gdoc-icon {
}
&__message {
padding-left: $padding-64;
padding-left: defaults.$padding-64;
}
&__line {
padding: $padding-8 0;
padding: defaults.$padding-8 0;
}
&__title {
font-size: $font-size-64;
font-size: defaults.$font-size-64;
}
&__code {
@ -791,10 +802,10 @@ svg.gdoc-icon {
}
.gdoc-toc {
margin: $padding-16 0;
margin: defaults.$padding-16 0;
li {
margin: $padding-4 0;
margin: defaults.$padding-4 0;
}
// Classes to hide nested levels of ToC/Menu

View file

@ -1,3 +1,5 @@
@use "defaults";
@mixin chroma_base {
.chroma {
color: var(--code-font-color);
@ -18,8 +20,8 @@
/* LineTable */
.chroma .lntable {
border: $border-1 solid var(--code-accent-color);
border-radius: $border-radius;
border: defaults.$border-1 solid var(--code-accent-color);
border-radius: defaults.$border-radius;
border-spacing: 0;
padding: 0;
margin: 0;
@ -37,7 +39,7 @@
.chroma .lntable td:first-child {
code {
background-color: var(--code-accent-color-lite);
border-right: $border-1 solid var(--code-accent-color);
border-right: defaults.$border-1 solid var(--code-accent-color);
padding-left: 0;
padding-right: 0;
border-radius: 0;
@ -45,6 +47,6 @@
}
.chroma .lntable td:nth-child(2) {
width: 100%;
margin-left: $padding-32;
margin-left: defaults.$padding-32;
}
}

View file

@ -1,7 +1,9 @@
@use "chroma_base";
@mixin chroma_dark {
/* Theme: Dracula */
/* Background */
@include chroma_base;
@include chroma_base.chroma_base;
/* Other */
.chroma .x {

View file

@ -1,7 +1,9 @@
@use "chroma_base";
@mixin chroma_github {
/* Theme: GitHub */
/* Background */
@include chroma_base;
@include chroma_base.chroma_base;
/* Other */
.chroma .x {

View file

@ -1,32 +1,38 @@
@use "sass:color";
@use "sass:map";
@use "chroma_dark";
@use "chroma_light";
@use "defaults";
@mixin color_theme_light {
--header-background: #{$main-color};
--header-font-color: #{$white};
--header-background: #{defaults.$main-color};
--header-font-color: #{defaults.$white};
--body-background: #{$body-background};
--body-font-color: #{$body-font-color};
--body-background: #{defaults.$body-background};
--body-font-color: #{defaults.$body-font-color};
--mark-color: #{$mark-color};
--mark-color: #{defaults.$mark-color};
--button-background: #{lighten($main-color, 2)};
--button-border-color: #{$main-color};
--button-background: #{color.scale(defaults.$main-color, $lightness: 15%)};
--button-border-color: #{defaults.$main-color};
--link-color: #{$link-color};
--link-color-visited: #{$link-color-visited};
--link-color: #{defaults.$link-color};
--link-color-visited: #{defaults.$link-color-visited};
--hint-link-color: #{$link-color};
--hint-link-color-visited: #{$link-color-visited};
--hint-link-color: #{defaults.$link-color};
--hint-link-color-visited: #{defaults.$link-color-visited};
--accent-color-dark: #{$gray-400};
--accent-color-dark: #{defaults.$gray-400};
--accent-color-gray: #{$gray-450};
--accent-color: #{$gray-200};
--accent-color-lite: #{$gray-100};
--accent-color: #{defaults.$gray-200};
--accent-color-lite: #{defaults.$gray-100};
--control-icons: #{lighten($body-font-color, 50)};
--control-icons: #{color.scale(defaults.$body-font-color, $lightness: 40%)};
--footer-background: #{$second-color};
--footer-font-color: #{$white};
--footer-link-color: #{$link-color-footer};
--footer-link-color-visited: #{$link-color-footer};
--footer-background: #{defaults.$second-color};
--footer-font-color: #{defaults.$white};
--footer-link-color: #{defaults.$link-color-footer};
--footer-link-color-visited: #{defaults.$link-color-footer};
.dark-mode-dim .gdoc-markdown {
img {
@ -54,40 +60,40 @@
.gdoc-hint__title,
.admonitionblock table td:first-child {
background-color: scale-color($gray-600, $alpha: -95%);
background-color: color.scale(defaults.$gray-600, $alpha: -95%);
}
}
}
@mixin color_theme_dark {
--header-background: #{$main-color};
--header-font-color: #{$white};
--header-background: #{defaults.$main-color};
--header-font-color: #{defaults.$white};
--body-background: #{$body-background-dark};
--body-font-color: #{lighten($body-background-dark, 60)};
--body-background: #{defaults.$body-background-dark};
--body-font-color: #{color.scale(defaults.$body-background-dark, $lightness: 70%)};
--mark-color: #{$mark-color};
--mark-color: #{defaults.$mark-color};
--button-background: #{lighten($main-color, 2)};
--button-border-color: #{$main-color};
--button-background: #{color.scale(defaults.$main-color, $lightness: 15%)};
--button-border-color: #{defaults.$main-color};
--link-color: #{$link-color-dark};
--link-color-visited: #{$link-color-visited-dark};
--link-color: #{defaults.$link-color-dark};
--link-color-visited: #{defaults.$link-color-visited-dark};
--hint-link-color: #{$link-color};
--hint-link-color-visited: #{$link-color-visited};
--hint-link-color: #{defaults.$link-color};
--hint-link-color-visited: #{defaults.$link-color-visited};
--accent-color-dark: #{darken($body-background-dark, 8)};
--accent-color-dark: #{color.scale(defaults.$body-background-dark, $lightness: -60%)};
--accent-color-gray: #{darken($body-background-dark, 8)};
--accent-color: #{darken($body-background-dark, 4)};
--accent-color-lite: #{darken($body-background-dark, 2)};
--accent-color: #{color.scale(defaults.$body-background-dark, $lightness: -30%)};
--accent-color-lite: #{color.scale(defaults.$body-background-dark, $lightness: -15%)};
--control-icons: #{lighten($body-font-color, 50)};
--control-icons: #{color.scale(defaults.$body-font-color, $lightness: 40%)};
--footer-background: #{$second-color};
--footer-font-color: #{$white};
--footer-link-color: #{$link-color-footer};
--footer-link-color-visited: #{$link-color-footer};
--footer-background: #{defaults.$second-color};
--footer-font-color: #{defaults.$white};
--footer-link-color: #{defaults.$link-color-footer};
--footer-link-color-visited: #{defaults.$link-color-footer};
.dark-mode-dim {
.gdoc-markdown img {
@ -115,35 +121,39 @@
.gdoc-hint__title,
.admonitionblock table td:first-child {
background-color: scale-color($gray-600, $alpha: -85%);
background-color: color.scale(defaults.$gray-600, $alpha: -85%);
}
}
}
@mixin code_theme_dark {
@include chroma_dark;
@include chroma_dark.chroma_dark;
--code-background: #{$code-background-dark};
--code-accent-color: #{darken($code-background-dark, 4)};
--code-accent-color-lite: #{darken($code-background-dark, 2)};
--code-font-color: #{$code-font-color-dark};
& {
--code-background: #{defaults.$code-background-dark};
--code-accent-color: #{color.scale(defaults.$code-background-dark, $lightness: -30%)};
--code-accent-color-lite: #{color.scale(defaults.$code-background-dark, $lightness: -15%)};
--code-font-color: #{defaults.$code-font-color-dark};
--code-copy-background: #{$code-background-dark};
--code-copy-font-color: #{darken($code-font-color-dark, 15)};
--code-copy-border-color: #{darken($code-font-color-dark, 20)};
--code-copy-success-color: #{scale-color(map.get($hint-colors, "ok"), $alpha: -55%)};
--code-copy-background: #{defaults.$code-background-dark};
--code-copy-font-color: #{color.scale(defaults.$code-font-color-dark, $lightness: -15%)};
--code-copy-border-color: #{color.scale(defaults.$code-font-color-dark, $lightness: -20%)};
--code-copy-success-color: #{color.scale(map.get(defaults.$hint-colors, "ok"), $alpha: -55%)};
}
}
@mixin code_theme_light {
@include chroma_github;
@include chroma_light.chroma_github;
--code-background: #{$code-background};
--code-accent-color: #{darken($code-background, 6)};
--code-accent-color-lite: #{darken($code-background, 2)};
--code-font-color: #{$code-font-color};
& {
--code-background: #{defaults.$code-background};
--code-accent-color: #{color.scale(defaults.$code-background, $lightness: -45%)};
--code-accent-color-lite: #{color.scale(defaults.$code-background, $lightness: -15%)};
--code-font-color: #{defaults.$code-font-color};
--code-copy-background: #{$code-background};
--code-copy-font-color: #{lighten($code-font-color, 15)};
--code-copy-border-color: #{lighten($code-font-color, 20)};
--code-copy-success-color: #{map.get($hint-colors, "ok")};
--code-copy-background: #{defaults.$code-background};
--code-copy-font-color: #{color.scale(defaults.$code-font-color, $lightness: 20%)};
--code-copy-border-color: #{color.scale(defaults.$code-font-color, $lightness: 40%)};
--code-copy-success-color: #{map.get(defaults.$hint-colors, "ok")};
}
}

View file

@ -1,3 +1,5 @@
@use "sass:color";
// Used in layout
$padding-2: 0.125rem !default;
$padding-4: 0.25rem !default;
@ -47,10 +49,12 @@ $link-color-visited: rgba(119, 73, 191, 1) !default;
$link-color-footer: rgba(246, 107, 14, 1) !default;
$body-background: white !default;
$body-font-family: "Liberation Sans", sans-serif !default;
$body-font-color: $gray-800 !default;
$body-font-weight: normal !default;
$body-min-width: 20rem !default;
$code-font-family: "Liberation Mono", monospace !default;
$code-font-color: rgba(70, 70, 70, 1) !default;
$code-font-color-dark: rgba(185, 185, 185, 1) !default;
@ -60,15 +64,16 @@ $main-color: rgba(32, 83, 117, 1) !default;
$second-color: rgba(17, 43, 60, 1) !default;
$mark-color: rgba(255, 171, 0, 1) !default;
$body-background-dark: mix(invert($body-background, 75%), $second-color) !default;
$body-background-dark: color.mix(color.invert($body-background, 75%), $second-color) !default;
$body-font-color-dark: $gray-100 !default;
$link-color-dark: rgba(110, 168, 212, 1) !default;
$link-color-visited-dark: rgba(186, 142, 240) !default;
$code-background: $gray-100 !default;
$code-background-dark: darken($body-background-dark, 3) !default;
$code-background-dark: color.scale($body-background-dark, $lightness: -15%) !default;
$header-font-family: "Metropolis", sans-serif !default;
$header-height: 3.5rem !default;
$menu-width: 18rem !default;

View file

@ -1,6 +1,7 @@
@font-face {
font-family: "Liberation Sans";
src: url("fonts/LiberationSans-Bold.woff2") format("woff2"),
src:
url("fonts/LiberationSans-Bold.woff2") format("woff2"),
url("fonts/LiberationSans-Bold.woff") format("woff");
font-weight: bold;
font-style: normal;
@ -9,7 +10,8 @@
@font-face {
font-family: "Liberation Sans";
src: url("fonts/LiberationSans-BoldItalic.woff2") format("woff2"),
src:
url("fonts/LiberationSans-BoldItalic.woff2") format("woff2"),
url("fonts/LiberationSans-BoldItalic.woff") format("woff");
font-weight: bold;
font-style: italic;
@ -18,7 +20,8 @@
@font-face {
font-family: "Liberation Sans";
src: url("fonts/LiberationSans-Italic.woff2") format("woff2"),
src:
url("fonts/LiberationSans-Italic.woff2") format("woff2"),
url("fonts/LiberationSans-Italic.woff") format("woff");
font-weight: normal;
font-style: italic;
@ -27,7 +30,8 @@
@font-face {
font-family: "Liberation Sans";
src: url("fonts/LiberationSans.woff2") format("woff2"),
src:
url("fonts/LiberationSans.woff2") format("woff2"),
url("fonts/LiberationSans.woff") format("woff");
font-weight: normal;
font-style: normal;
@ -36,7 +40,8 @@
@font-face {
font-family: "Liberation Mono";
src: url("fonts/LiberationMono.woff2") format("woff2"),
src:
url("fonts/LiberationMono.woff2") format("woff2"),
url("fonts/LiberationMono.woff") format("woff");
font-weight: normal;
font-style: normal;
@ -45,7 +50,9 @@
@font-face {
font-family: "Metropolis";
src: url("fonts/Metropolis.woff2") format("woff2"), url("fonts/Metropolis.woff") format("woff");
src:
url("fonts/Metropolis.woff2") format("woff2"),
url("fonts/Metropolis.woff") format("woff");
font-weight: normal;
font-style: normal;
font-display: swap;
@ -53,7 +60,8 @@
@font-face {
font-family: "GeekdocIcons";
src: url("fonts/GeekdocIcons.woff2") format("woff2"),
src:
url("fonts/GeekdocIcons.woff2") format("woff2"),
url("fonts/GeekdocIcons.woff") format("woff");
font-weight: normal;
font-style: normal;
@ -61,14 +69,14 @@
}
body {
font-family: "Liberation Sans", sans-serif;
font-family: var(--body-font-family);
}
code,
.gdoc-error__title {
font-family: "Liberation Mono", monospace;
font-family: var(--code-font-family);
}
.gdoc-header {
font-family: "Metropolis", sans-serif;
font-family: var(--header-font-family);
}

View file

@ -1,3 +1,5 @@
@use "defaults";
.gdoc-markdown {
line-height: 1.6rem;
@ -10,8 +12,8 @@
font-weight: 600;
> code {
border-top: $border-4 solid var(--accent-color);
font-size: $font-size-12 !important;
border-top: defaults.$border-4 solid var(--accent-color);
font-size: defaults.$font-size-12 !important;
}
}
@ -19,7 +21,7 @@
h5,
h6 {
> code {
font-size: $font-size-14 !important;
font-size: defaults.$font-size-14 !important;
}
}
@ -32,7 +34,7 @@
a,
&__link {
text-decoration: underline;
border-bottom: $border-1 solid transparent;
border-bottom: defaults.$border-1 solid transparent;
line-height: normal;
&:hover {
@ -42,14 +44,14 @@
&__link--raw {
text-decoration: none !important;
color: $body-font-color !important;
color: defaults.$body-font-color !important;
&:hover {
text-decoration: none !important;
}
&:visited {
color: $body-font-color !important;
color: defaults.$body-font-color !important;
}
}
@ -72,11 +74,11 @@
}
&__figure {
padding: $padding-4;
margin: $padding-16 0;
padding: defaults.$padding-4;
margin: defaults.$padding-16 0;
display: table;
border-top-left-radius: $border-radius;
border-top-right-radius: $border-radius;
border-top-left-radius: defaults.$border-radius;
border-top-right-radius: defaults.$border-radius;
&--round,
&--round img {
@ -86,10 +88,10 @@
figcaption {
display: table-caption;
caption-side: bottom;
padding: 0 $padding-4 $padding-4;
padding: 0 defaults.$padding-4 defaults.$padding-4;
text-align: center;
border-bottom-left-radius: $border-radius;
border-bottom-right-radius: $border-radius;
border-bottom-left-radius: defaults.$border-radius;
border-bottom-right-radius: defaults.$border-radius;
}
img {
@ -100,37 +102,37 @@
img {
max-width: 100%;
border-radius: $border-radius;
border-radius: defaults.$border-radius;
}
blockquote {
margin: $padding-16 0;
padding: $padding-8 $padding-16 $padding-8 ($padding-16 - $padding-4); //to keep total left space 16dp
margin: defaults.$padding-16 0;
padding: defaults.$padding-8 defaults.$padding-16 defaults.$padding-8 (defaults.$padding-16 - defaults.$padding-4); //to keep total left space 16dp
border-left: $border-4 solid var(--accent-color);
border-radius: $border-radius;
border-left: defaults.$border-4 solid var(--accent-color);
border-radius: defaults.$border-radius;
}
table:not(.lntable):not(.highlight) {
display: table;
border-spacing: 0;
border-collapse: collapse;
margin-top: $padding-16;
margin-bottom: $padding-16;
margin-top: defaults.$padding-16;
margin-bottom: defaults.$padding-16;
width: 100%;
text-align: left;
thead {
border-bottom: $border-4 solid var(--accent-color);
border-bottom: defaults.$border-4 solid var(--accent-color);
}
tr th,
tr td {
padding: $padding-8 $padding-16;
padding: defaults.$padding-8 defaults.$padding-16;
}
tr {
border-bottom: $border-2 solid var(--accent-color);
border-bottom: defaults.$border-2 solid var(--accent-color);
}
tr:nth-child(2n) {
@ -139,43 +141,43 @@
}
hr {
height: $border-2;
height: defaults.$border-2;
border: none;
background: var(--accent-color);
}
ul,
ol {
padding-left: $padding-32;
padding-left: defaults.$padding-32;
}
dl {
dt {
font-weight: bolder;
margin-top: $padding-16;
margin-top: defaults.$padding-16;
}
dd {
margin-left: $padding-32;
margin-left: defaults.$padding-32;
}
}
code {
padding: $padding-4 $padding-8;
padding: defaults.$padding-4 defaults.$padding-8;
}
pre,
code {
background-color: var(--code-background);
border-radius: $border-radius;
border-radius: defaults.$border-radius;
color: var(--code-font-color);
font-size: $font-size-14;
line-height: $padding-16;
font-size: defaults.$font-size-14;
line-height: defaults.$padding-16;
}
pre code {
display: block;
padding: $padding-16;
padding: defaults.$padding-16;
width: 100%;
}
@ -184,6 +186,7 @@
}
&__align {
text-align: left;
&--left {
h1,
h2,
@ -193,10 +196,10 @@
h6 {
justify-content: flex-start;
}
text-align: left;
}
&--center {
text-align: center;
h1,
h2,
h3,
@ -205,10 +208,10 @@
h6 {
justify-content: center;
}
text-align: center;
}
&--right {
text-align: right;
h1,
h2,
h3,
@ -217,7 +220,6 @@
h6 {
justify-content: flex-end;
}
text-align: right;
}
}
}

View file

@ -1,7 +1,9 @@
@media screen and (max-width: $sm-breakpoint) {
@use "defaults";
@media screen and (max-width: defaults.$sm-breakpoint) {
.gdoc-nav {
margin-left: -$menu-width;
font-size: $font-size-base;
margin-left: -(defaults.$menu-width);
font-size: defaults.$font-size-base;
&__control {
display: inline-block;
@ -10,14 +12,14 @@
.gdoc-header {
svg.gdoc-icon {
width: $font-size-24;
height: $font-size-24;
width: defaults.$font-size-24;
height: defaults.$font-size-24;
}
}
.gdoc-brand {
font-size: $font-size-24;
line-height: $font-size-24;
font-size: defaults.$font-size-24;
line-height: defaults.$font-size-24;
&__img {
display: none;
@ -36,23 +38,23 @@
}
.gdoc-error {
padding: $padding-96 $padding-16;
padding: defaults.$padding-96 defaults.$padding-16;
svg.gdoc-icon {
width: $font-size-96;
height: $font-size-96;
width: defaults.$font-size-96;
height: defaults.$font-size-96;
}
&__message {
padding-left: $padding-32;
padding-left: defaults.$padding-32;
}
&__line {
padding: $padding-4 0;
padding: defaults.$padding-4 0;
}
&__title {
font-size: $font-size-32;
font-size: defaults.$font-size-32;
}
}
@ -65,7 +67,7 @@
flex-direction: column;
&.gdoc-columns {
margin: $padding-32 0;
margin: defaults.$padding-32 0;
}
.gdoc-columns__content {
@ -77,7 +79,7 @@
#menu-control:checked ~ main {
.gdoc-nav nav,
.gdoc-page {
transform: translateX($menu-width);
transform: translateX(defaults.$menu-width);
}
.gdoc-page {

View file

@ -1,3 +1,5 @@
@use "defaults";
@media print {
.gdoc-nav,
.gdoc-footer .container span:not(:first-child),
@ -7,7 +9,7 @@
}
.gdoc-footer {
border-top: $border-1 solid $gray-300;
border-top: defaults.$border-1 solid defaults.$gray-300;
}
.gdoc-markdown pre {
@ -16,8 +18,8 @@
}
.chroma code {
border: $border-1 solid $gray-300;
padding: $padding-8 !important;
border: defaults.$border-1 solid defaults.$gray-300;
padding: defaults.$padding-8 !important;
font-weight: normal !important;
}

View file

@ -1,21 +1,24 @@
@use "sass:color";
@use "defaults";
// {{< expand "Label" "icon" >}}
.gdoc-expand {
margin: $padding-16 0;
margin: defaults.$padding-16 0;
border: $border-1 solid var(--accent-color);
border-radius: $border-radius;
border: defaults.$border-1 solid var(--accent-color);
border-radius: defaults.$border-radius;
overflow: hidden;
&__head {
background: var(--accent-color-lite);
padding: $padding-8 $padding-16;
padding: defaults.$padding-8 defaults.$padding-16;
cursor: pointer;
}
&__content {
display: none;
padding: 0 $padding-16;
padding: 0 defaults.$padding-16;
}
&__control:checked + &__content {
@ -29,10 +32,10 @@
// {{< tabs >}}
.gdoc-tabs {
margin: $padding-16 0;
margin: defaults.$padding-16 0;
border: $border-1 solid var(--accent-color);
border-radius: $border-radius;
border: defaults.$border-1 solid var(--accent-color);
border-radius: defaults.$border-radius;
overflow: hidden;
@ -41,21 +44,21 @@
&__label {
display: inline-block;
padding: $padding-8 $padding-16;
border-bottom: $border-1 transparent;
padding: defaults.$padding-8 defaults.$padding-16;
border-bottom: defaults.$border-1 transparent;
cursor: pointer;
}
&__content {
order: 999; //Move content blocks to the end
width: 100%;
border-top: $border-1 solid var(--accent-color-lite);
padding: 0 $padding-16;
border-top: defaults.$border-1 solid var(--accent-color-lite);
padding: 0 defaults.$padding-16;
display: none;
}
&__control:checked + &__label {
border-bottom: $border-2 solid var(--link-color);
border-bottom: defaults.$border-2 solid var(--link-color);
}
&__control:checked + &__label + &__content {
display: block;
@ -68,7 +71,7 @@
// {{< columns >}}
.gdoc-columns {
margin: $padding-16 0;
margin: defaults.$padding-16 0;
&--regular > :first-child {
flex: 1;
@ -76,17 +79,17 @@
&--small > :first-child {
flex: 0.35;
min-width: $body-min-width * 0.35;
min-width: defaults.$body-min-width * 0.35;
}
&--large > :first-child {
flex: 1.65;
min-width: $body-min-width * 1.65;
min-width: defaults.$body-min-width * 1.65;
}
&__content {
flex: 1 1;
min-width: $body-min-width * 0.66;
min-width: defaults.$body-min-width * 0.66;
box-shadow: 0 15px 60px var(--accent-color);
padding: $padding-32;
border-radius: 12px;
@ -104,12 +107,12 @@
// {{< button >}}
.gdoc-button {
$root: &;
margin: $padding-16 0;
margin: defaults.$padding-16 0;
display: inline-block;
background: var(--accent-color-lite);
border: $border-1 solid var(--accent-color);
border-radius: $border-radius;
border: defaults.$border-1 solid var(--accent-color);
border-radius: defaults.$border-radius;
cursor: pointer;
&__link {
@ -121,72 +124,78 @@
&:hover {
background: var(--button-background);
border-color: var(--button-border-color);
color: $gray-100;
color: defaults.$gray-100;
}
&--regular {
font-size: $font-size-base;
font-size: defaults.$font-size-base;
#{$root}__link {
padding: $padding-4 $padding-8;
padding: defaults.$padding-4 defaults.$padding-8;
}
}
&--large {
font-size: $font-size-20;
font-size: defaults.$font-size-20;
#{$root}__link {
padding: $padding-8 $padding-16;
padding: defaults.$padding-8 defaults.$padding-16;
}
}
}
// {{< hint >}}
.gdoc-hint {
@each $name, $color in $hint-colors {
@each $name, $color in defaults.$hint-colors {
&.#{$name} {
border-left-color: $color;
background-color: scale-color($color, $lightness: 95%, $saturation: -30%);
color: $body-font-color;
background-color: color.scale($color, $lightness: 95%, $saturation: -30%);
color: defaults.$body-font-color;
padding: 0;
code,
pre {
background-color: color.scale($color, $lightness: 80%, $saturation: -75%);
color: defaults.$code-font-color;
}
}
}
&__title {
padding: $padding-4 $padding-16;
background-color: scale-color($gray-600, $alpha: -95%);
padding: defaults.$padding-4 defaults.$padding-16;
background-color: color.scale(defaults.$gray-600, $alpha: -95%);
font-weight: bold;
color: scale-color($body-font-color, $alpha: -15%);
color: color.scale(defaults.$body-font-color, $alpha: -15%);
i.fa::after {
content: attr(title);
font-style: normal;
padding-left: $padding-24;
padding-left: defaults.$padding-24;
}
i.fa {
color: $black;
color: defaults.$black;
background-size: auto 90%;
background-repeat: no-repeat;
filter: invert(30%);
margin-left: -5px;
}
@each $name, $icon in $hint-icons {
@each $name, $icon in defaults.$hint-icons {
i.fa.#{$name} {
background-image: url(img/geekdoc-stack.svg##{$icon});
}
}
.gdoc-icon {
width: $font-size-24;
height: $font-size-24;
width: defaults.$font-size-24;
height: defaults.$font-size-24;
margin-left: -5px;
}
}
&__text {
padding: $padding-4 $padding-16;
padding: defaults.$padding-4 defaults.$padding-16;
}
.gdoc-page__anchor {
@ -196,12 +205,12 @@
// {{< mermaid >}}
.gdoc-mermaid {
font-family: "Liberation Sans", sans-serif;
font-family: var(--body-font-family);
// Fix height of mermaid SVG elements (see https://github.com/mermaid-js/mermaid/issues/2481)
> svg {
height: 100%;
padding: $padding-8;
padding: defaults.$padding-8;
}
}
@ -211,47 +220,47 @@
&__default {
padding: 0;
margin: 0;
font-family: "Liberation Mono", monospace;
font-family: var(--code-font-family);
}
&__meta {
gap: 0.5em;
line-height: normal;
margin-bottom: $padding-4;
margin-bottom: defaults.$padding-4;
&:hover .gdoc-page__anchor svg.gdoc-icon {
color: var(--control-icons);
}
}
@each $name, $color in $hint-colors {
@each $name, $color in defaults.$hint-colors {
&__tag.#{$name} {
border-color: scale-color($color, $lightness: 90%, $saturation: -30%);
background-color: scale-color($color, $lightness: 95%, $saturation: -30%);
border-color: color.scale($color, $lightness: 90%, $saturation: -30%);
background-color: color.scale($color, $lightness: 95%, $saturation: -30%);
}
}
&__tag {
font-size: $font-size-14;
font-size: defaults.$font-size-14;
font-weight: normal;
background-color: $gray-100;
border: $border-1 solid $gray-200;
border-radius: $border-radius;
padding: $padding-2 $padding-4;
color: $body-font-color;
background-color: defaults.$gray-100;
border: defaults.$border-1 solid defaults.$gray-200;
border-radius: defaults.$border-radius;
padding: defaults.$padding-2 defaults.$padding-4;
color: defaults.$body-font-color;
}
&__default {
font-size: $font-size-14;
font-size: defaults.$font-size-14;
}
}
// {{% progress %}}
.gdoc-progress {
margin-bottom: $padding-16;
margin-bottom: defaults.$padding-16;
&__label {
padding: $padding-4 0;
padding: defaults.$padding-4 0;
&--name {
font-weight: bold;
@ -261,7 +270,7 @@
&__wrap {
background-color: var(--accent-color-lite);
border-radius: 1em;
box-shadow: inset 0 0 0 $border-1 var(--accent-color);
box-shadow: inset 0 0 0 defaults.$border-1 var(--accent-color);
}
&__bar {
@ -278,6 +287,6 @@
transparent
);
background-size: 2.5em 2.5em;
background-color: $main-color !important;
background-color: defaults.$main-color !important;
}
}

View file

@ -1,3 +1,5 @@
@use "defaults";
.flex {
display: flex;
}
@ -24,14 +26,14 @@
.flex-grid {
flex-direction: column;
border: $border-1 solid var(--accent-color);
border-radius: $border-radius;
border: defaults.$border-1 solid var(--accent-color);
border-radius: defaults.$border-radius;
background: var(--accent-color-lite);
}
.flex-gap {
flex-wrap: wrap;
gap: $padding-16;
gap: defaults.$padding-16;
}
.justify-start {
@ -83,7 +85,7 @@
.table-wrap {
overflow: auto;
margin: $padding-16 0;
margin: defaults.$padding-16 0;
> table {
margin: 0 !important;

View file

@ -1,16 +1,8 @@
@use "sass:map";
@use "_normalize";
@use "_utils";
@use "_fonts";
@use "_base";
@import "_defaults";
@import "_color_mode";
@import "_chroma_base";
@import "_chroma_light";
@import "_chroma_dark";
@import "_normalize";
@import "_utils";
@import "_fonts";
@import "_base";
@import "_markdown";
@import "_asciidoc";
@import "_shortcodes";
@use "_markdown";
@use "_asciidoc";
@use "_shortcodes";

View file

@ -1,3 +1,4 @@
@import "_defaults";
@use "sass:color";
@import "_mobile";
@use "_defaults";
@use "_mobile";

View file

@ -1,3 +1,4 @@
@import "_defaults";
@use "sass:color";
@import "_print";
@use "_defaults";
@use "_print";

View file

@ -5,7 +5,7 @@ description = "Hugo theme made for documentation"
homepage = "https://geekdocs.de/"
demosite = "https://geekdocs.de/"
tags = ["docs", "documentation", "responsive", "simple"]
min_version = "0.112.0"
min_version = "0.124"
[author]
name = "Robert Kaussow"

View file

@ -1,13 +1,15 @@
const path = require("path")
const glob = require("glob")
import path from "path"
import { glob } from "glob"
import { fileURLToPath } from "url"
const { WebpackManifestPlugin } = require("webpack-manifest-plugin")
const GitVersionPlugin = require("@eloquent/git-version-webpack-plugin")
const FaviconsWebpackPlugin = require("favicons-webpack-plugin")
const RemoveEmptyScriptsPlugin = require("webpack-remove-empty-scripts")
const CopyPlugin = require("copy-webpack-plugin")
const SRIPlugin = require("./webpack.plugins")
import { WebpackManifestPlugin } from "webpack-manifest-plugin"
import FaviconsWebpackPlugin from "favicons-webpack-plugin"
import RemoveEmptyScriptsPlugin from "webpack-remove-empty-scripts"
import CopyPlugin from "copy-webpack-plugin"
import { SRIPlugin, GitVersionPlugin } from "./webpack.plugins.js"
const __filename = fileURLToPath(import.meta.url)
const __dirname = path.dirname(__filename)
const nodeModulesPath = path.resolve(__dirname, "node_modules")
var config = {
@ -105,12 +107,12 @@ var config = {
}),
new GitVersionPlugin({
path: "../VERSION"
outputFile: "../VERSION"
})
]
}
module.exports = (env, argv) => {
export default (argv) => {
if (argv.mode === "development") {
config.devtool = "eval-cheap-source-map"
}
@ -142,12 +144,9 @@ module.exports = (env, argv) => {
{
loader: "sass-loader",
options: {
sourceMap: argv.mode === "development" ? true : false,
sassOptions: {
// FIXME: https://github.com/webpack-contrib/sass-loader/issues/962#issuecomment-1002675051
sourceMap: argv.mode === "development" ? true : false,
sourceMapEmbed: argv.mode === "development" ? true : false,
outputStyle: argv.mode === "development" ? "expanded" : "compressed",
includePaths: [nodeModulesPath]
outputStyle: argv.mode === "development" ? "expanded" : "compressed"
}
}
}

View file

@ -1,7 +1,11 @@
const fs = require("fs")
const crypto = require("crypto")
const path = require("path")
const { validate } = require("schema-utils")
import fs from "fs"
import crypto from "crypto"
import path from "path"
import { validate } from "schema-utils"
import { access as accessCps } from "fs"
import { execFile as execFileCps } from "child_process"
import { promisify } from "util"
class SRIPlugin {
static defaultOptions = {
@ -10,48 +14,134 @@ class SRIPlugin {
}
constructor(options = {}) {
const schema = {
type: "object",
properties: {
outputFile: {
type: "string"
},
algorithm: {
type: "string"
}
}
}
this.options = { ...SRIPlugin.defaultOptions, ...options }
validate(schema, options, {
name: "SRI Plugin",
baseDataPath: "options"
})
validate(
{
type: "object",
properties: {
sourceFile: { type: "string" },
outputFile: { type: "string" },
algorithm: { type: "string" }
}
},
options,
{
name: "SRI Plugin",
baseDataPath: "options"
}
)
}
apply(compiler) {
compiler.hooks.done.tap("SRIPlugin", (manifest) => {
let data = JSON.parse(fs.readFileSync(this.options.sourceFile, "utf8"))
let outputFile = this.options.outputFile ? this.options.outputFile : this.options.sourceFile
compiler.hooks.done.tap("SRIPlugin", () => {
const data = JSON.parse(fs.readFileSync(this.options.sourceFile, "utf8"))
const outputFile = this.options.outputFile || this.options.sourceFile
const { algorithm } = this.options
const checksum = (str, algorithm = this.options.algorithm, encoding = "base64") =>
crypto.createHash(algorithm).update(str, "utf8").digest(encoding)
const fileSum = (file, algorithm) => checksum(fs.readFileSync(file), algorithm)
const calculateSRI = (file, algorithm = this.options.algorithm) =>
`${algorithm}-${fileSum(path.join(".", "static", file), algorithm)}`
const calculateSRI = (file) => {
const fileContent = fs.readFileSync(path.join(".", "static", file))
const hash = crypto.createHash(algorithm).update(fileContent).digest("base64")
return `${algorithm}-${hash}`
}
Object.keys(data).forEach((key) => {
let element = data[key]
element.integrity = calculateSRI(element.src)
data[key].integrity = calculateSRI(data[key].src)
})
fs.writeFileSync(outputFile, JSON.stringify(data, null, 2), {
encoding: "utf8",
flag: "w"
})
fs.writeFileSync(outputFile, JSON.stringify(data, null, 2), { encoding: "utf8", flag: "w" })
})
}
}
module.exports = SRIPlugin
class GitVersionPlugin {
static defaultOptions = {
outputFile: "VERSION"
}
constructor(options = {}) {
this.options = { ...GitVersionPlugin.defaultOptions, ...options }
validate(
{
type: "object",
properties: {
outputFile: { type: "string" }
}
},
options,
{
baseDataPath: "options",
name: "GitVersion Plugin"
}
)
}
apply(compiler) {
const { webpack, hooks, context } = compiler
const { Compilation } = webpack
hooks.beforeCompile.tapPromise("GitVersionPlugin", async () => {
const access = promisify(accessCps)
try {
await access(".git")
this.dependsOnGit = true
} catch {
this.dependsOnGit = false
}
})
hooks.compilation.tap("GitVersionPlugin", (compilation) => {
if (this.dependsOnGit) {
compilation.fileDependencies.add(path.join(context, ".git/logs/HEAD"))
compilation.contextDependencies.add(path.join(context, ".git/refs/tags"))
}
compilation.hooks.processAssets.tapPromise(
{
name: "GitVersionPlugin",
stage: Compilation.PROCESS_ASSETS_STAGE_ADDITIONAL
},
async (assets) => {
try {
const v = await this.version()
assets[this.options.outputFile] = {
source: () => `${v}\n`,
size: () => v.length + 1
}
} catch {
assets[this.options.outputFile] = {
source: () => "",
size: () => 0
}
}
}
)
})
}
async version() {
const execFile = promisify(execFileCps)
try {
const { stdout: describe } = await execFile("git", ["describe", "--long", "--tags"])
const [, tag, offset] = describe.trim().match(/^(.*)-(\d+)-g[0-9a-f]+$/)
return parseInt(offset) === 0 ? tag : this.getBranchAndHash()
} catch {
return this.getBranchAndHash()
}
}
async getBranchAndHash() {
const execFile = promisify(execFileCps)
const [{ stdout: branch }, { stdout: hash }] = await Promise.all([
execFile("git", ["rev-parse", "--abbrev-ref", "HEAD"]),
execFile("git", ["rev-parse", "HEAD"])
])
return `${branch.trim()}@${hash.substring(0, 7)}`
}
}
export { SRIPlugin, GitVersionPlugin }