{{ .Title }}
28 |{{ .Params.lead | safeHTML }}
29 | {{ if ne .Params.toc false -}} 30 | 33 | {{ end -}} 34 | {{ .Content }} 35 | 43 | {{ partial "main/docs-navigation.html" . }} 44 | 51 |
3 |
10 | {{ end }}
--------------------------------------------------------------------------------
/assets/js/katex.js:
--------------------------------------------------------------------------------
1 | document.addEventListener('DOMContentLoaded', function() {
2 | renderMathInElement(document.body, {
3 | delimiters: [
4 | {left: '$$', right: '$$', display: true},
5 | {left: '$', right: '$', display: false},
6 | {left: '\\(', right: '\\)', display: false},
7 | {left: '\\[', right: '\\]', display: true},
8 | ],
9 | });
10 | });
11 |
--------------------------------------------------------------------------------
/layouts/shortcodes/email.html:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/layouts/shortcodes/mermaid.html:
--------------------------------------------------------------------------------
1 | {{ if .Page.Params.mermaid -}}
2 |
4 |
5 |
8 |
9 | Page not found :(
6 |The page you are looking for doesn't exist or has been moved.
7 |
3 | {{ $data := replaceRE "(^\\s+```)" "" .Inner -}}
4 | {{ replaceRE "(```\\s+$)" "" $data -}}
5 |
6 | {{ else -}}
7 | {{ errorf "Failed to process mermaid shortcode: %s. Set mermaid to true in page front matter." .Position }}
8 | {{ end -}}
9 |
--------------------------------------------------------------------------------
/assets/scss/components/_forms.scss:
--------------------------------------------------------------------------------
1 | /** Search form */
2 | .search-form {
3 | @extend .form-inline !optional;
4 | }
5 |
6 | .search-form label {
7 | @extend .form-group;
8 |
9 | font-weight: normal;
10 | }
11 |
12 | .search-form .search-field {
13 | @extend .form-control;
14 | }
15 |
16 | .search-form .search-submit {
17 | @extend .btn;
18 | @extend .btn-secondary;
19 | }
20 |
--------------------------------------------------------------------------------
/babel.config.js:
--------------------------------------------------------------------------------
1 | module.exports = {
2 | presets: [
3 | [
4 | '@babel/preset-env',
5 | {
6 | targets: {
7 | browsers: [
8 | // Best practice: https://github.com/babel/babel/issues/7789
9 | '>=1%',
10 | 'not ie 11',
11 | 'not op_mini all'
12 | ]
13 | }
14 | }
15 | ]
16 | ]
17 | };
--------------------------------------------------------------------------------
/content/en/book/introduction/about_author.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: "关于作者"
3 | description: ""
4 | lead: ""
5 | date: 2022-06-17T14:58:10+08:00
6 | lastmod: 2022-06-17T14:58:10+08:00
7 | draft: false
8 | images: []
9 | menu:
10 | book:
11 | parent: ""
12 | weight: 20
13 | toc: true
14 | ---
15 |
16 | - Twitter: [https://twitter.com/tisoga](https://twitter.com/tisoga)
17 | - 前互联网大厂程序员，拥有多年的 Web 2 开发经验
--------------------------------------------------------------------------------
/assets/scss/layouts/_footer.scss:
--------------------------------------------------------------------------------
1 | .footer {
2 | border-top: 1px solid $gray-200;
3 | padding-top: 1.125rem;
4 | padding-bottom: 1.125rem;
5 | }
6 |
7 | .footer ul {
8 | margin-bottom: 0;
9 | }
10 |
11 | .footer li {
12 | font-size: $font-size-sm;
13 | margin-bottom: 0;
14 | }
15 |
16 | @include media-breakpoint-up(md) {
17 | .footer li {
18 | font-size: $font-size-base;
19 | }
20 | }
21 |
--------------------------------------------------------------------------------
/layouts/_default/list.html:
--------------------------------------------------------------------------------
1 | {{ define "main" }}
2 |
3 |
13 | {{ end }}
--------------------------------------------------------------------------------
/layouts/blog/single.html:
--------------------------------------------------------------------------------
1 | {{ define "main" }}
2 |
4 | {{ range .Paginator.Pages }}
5 |
6 |
9 | {{ end }}
10 | {{ template "_internal/pagination.html" . }}
11 |
12 | {{ .Title }}
7 | {{ .Description }} 8 |
3 |
14 | {{ end }}
--------------------------------------------------------------------------------
/layouts/partials/head/script-header.html:
--------------------------------------------------------------------------------
1 | {{ if .Site.Params.options.darkMode -}}
2 | {{ $darkModeInit := resources.Get "js/darkmode-init.js" | js.Build | minify -}}
3 |
4 | {{ end -}}
5 | {{- if and (.Site.Params.alert) (.Site.Params.alertDismissable) -}}
6 | {{ $alertInit := resources.Get "js/alert-init.js" | js.Build | minify -}}
7 |
8 | {{- end -}}
--------------------------------------------------------------------------------
/layouts/partials/head/favicons.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
--------------------------------------------------------------------------------
/assets/js/mermaid.js:
--------------------------------------------------------------------------------
1 | import mermaid from 'mermaid';
2 |
3 | var config = {
4 | theme: 'default',
5 | fontFamily: '"Jost", -apple-system, blinkmacsystemfont, "Segoe UI", roboto, "Helvetica Neue", arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";',
6 | };
7 |
8 | document.addEventListener('DOMContentLoaded', () => {
9 | mermaid.initialize(config);
10 | mermaid.init(undefined, '.language-mermaid');
11 | });
12 |
--------------------------------------------------------------------------------
/layouts/shortcodes/video.html:
--------------------------------------------------------------------------------
1 |
4 |
5 |
12 |
13 |
6 |
9 | {{ .Title }}
7 | {{ partial "main/blog-meta.html" . }} 8 |{{ .Params.lead | safeHTML }}
10 | {{ .Content }} 11 |
2 |
3 | {{ with .Get "webm-src" -}}
4 |
5 | {{ end -}}
6 | {{ with .Get "mp4-src" -}}
7 |
8 | {{ end -}}
9 | Sorry, your browser doesn't support embedded videos.
10 |
11 |
12 |
--------------------------------------------------------------------------------
/assets/js/scroll-lock.js:
--------------------------------------------------------------------------------
1 | // Adds scroll position lock for default docs sidebar
2 |
3 | if (document.querySelector('#sidebar-default') !== null) {
4 | let sidebar = document.getElementById('sidebar-default');
5 |
6 | let pos = sessionStorage.getItem('sidebar-scroll');
7 | if (pos !== null) {
8 | sidebar.scrollTop = parseInt(pos, 10);
9 | }
10 |
11 | window.addEventListener('beforeunload', () => {
12 | sessionStorage.setItem('sidebar-scroll', sidebar.scrollTop);
13 | });
14 | }
15 |
--------------------------------------------------------------------------------
/layouts/partials/main/blog-meta.html:
--------------------------------------------------------------------------------
1 | {{ $last := sub (len .Params.contributors) 1 }}
2 | Posted {{ .PublishDate.Format "January 2, 2006" }} by {{ if .Params.contributors -}}{{ range $index, $contributor := .Params.contributors }}{{ if gt $index 0 }}{{ if eq $index $last }} and {{ else }}, {{ end }}{{ end }}{{ . }}{{ end -}}{{ end -}} ‐ {{ .ReadingTime -}} min read
3 | -------------------------------------------------------------------------------- /layouts/shortcodes/alert.html: -------------------------------------------------------------------------------- 1 |
2 |
3 | {{ with .Get "text"}}
4 |
13 |
--------------------------------------------------------------------------------
/layouts/partials/header/alert.html:
--------------------------------------------------------------------------------
1 | {{ if .Site.Params.alertDismissable -}}
2 | {{ . | safeHTML }}
5 | {{ else }}
6 | {{ with .Inner}}
7 | {{ . | markdownify}}
8 | {{ else }}
9 | {{ errorf "No valid text variable or Inner content given"}}
10 | {{ end }}
11 | {{ end}}
12 |
3 | {{ .Site.Params.alertText | safeHTML }}
4 |
5 |
6 | {{ else -}}
7 |
8 | {{ .Site.Params.alertText | safeHTML }}
9 |
10 | {{ end -}}
--------------------------------------------------------------------------------
/assets/js/alert.js:
--------------------------------------------------------------------------------
1 | var announcement = document.getElementById('announcement');
2 |
3 | if (announcement !== null) {
4 |
5 | var id = announcement.dataset.id;
6 |
7 | Object.keys(localStorage).forEach(function(key) {
8 | if (/^global-alert-/.test(key)) {
9 | if (key !== id ) {
10 | localStorage.removeItem(key);
11 | document.documentElement.removeAttribute('data-global-alert');
12 | }
13 | }
14 | });
15 |
16 | announcement.addEventListener('closed.bs.alert', () => {
17 | localStorage.setItem(id, 'closed');
18 | });
19 |
20 | }
--------------------------------------------------------------------------------
/layouts/index.redirects:
--------------------------------------------------------------------------------
1 | {{- range $p := .Site.Pages -}}
2 | {{- range .Aliases }}
3 | {{ . }} {{ $p.RelPermalink -}}
4 | {{- end }}
5 | {{- end -}}
6 |
7 | # /docs/1.0/prologue/ /docs/1.0/prologue/introduction/
8 | # /docs/1.0/help/ /docs/1.0/help/how-to-update/
9 | # /docs/1.0/ /docs/1.0/prologue/introduction/
10 | # /docs/ /docs/1.0/prologue/introduction/
11 | #
12 | # /docs/0.1/* https://v0-1-0--doks-versioning-poc.netlify.app/docs/0.1/:splat 200
13 | # /docs/0.2/* https://v0-2-0--doks-versioning-poc.netlify.app/docs/0.2/:splat 200
14 |
--------------------------------------------------------------------------------
/assets/scss/layouts/_posts.scss:
--------------------------------------------------------------------------------
1 | .home .card,
2 | .contributors.list .card,
3 | .blog.list .card {
4 | margin-top: 2rem;
5 | margin-bottom: 2rem;
6 | transition: transform 0.3s;
7 | }
8 |
9 | .home .card:hover,
10 | .contributors.list .card:hover,
11 | .blog.list .card:hover {
12 | transform: scale(1.025);
13 | }
14 |
15 | .home .card-body,
16 | .contributors.list .card-body,
17 | .blog.list .card-body {
18 | padding: 0 2rem 1rem;
19 | }
20 |
21 | .blog-header {
22 | text-align: center;
23 | margin-bottom: 2rem;
24 | }
25 |
26 | .blog-footer {
27 | text-align: center;
28 | }
29 |
--------------------------------------------------------------------------------
/assets/js/darkmode-init.js:
--------------------------------------------------------------------------------
1 | const globalDark = window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches;
2 | const localMode = localStorage.getItem('theme');
3 |
4 | if (globalDark && (localMode === null)) {
5 |
6 | localStorage.setItem('theme', 'dark');
7 | document.documentElement.setAttribute('data-dark-mode', '');
8 |
9 | }
10 |
11 | if (globalDark && (localMode === 'dark')) {
12 |
13 | document.documentElement.setAttribute('data-dark-mode', '');
14 |
15 | }
16 |
17 | if (localMode === 'dark') {
18 |
19 | document.documentElement.setAttribute('data-dark-mode', '');
20 |
21 | }
22 |
--------------------------------------------------------------------------------
/layouts/partials/head/head.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 | {{ block "head/resource-hints" . }}{{ partial "head/resource-hints.html" . }}{{ end }}
6 | {{ block "head/script-header" . }}{{ partial "head/script-header.html" . }}{{ end }}
7 | {{ block "head/stylesheet" . }}{{ partial "head/stylesheet.html" . }}{{ end }}
8 | {{ block "head/seo" . }}{{ partial "head/seo.html" . }}{{ end }}
9 | {{ block "head/favicons" . }}{{ partial "head/favicons.html" . }}{{ end }}
10 |
--------------------------------------------------------------------------------
/assets/scss/components/_comments.scss:
--------------------------------------------------------------------------------
1 | .comment-list {
2 | @extend .list-unstyled;
3 | }
4 |
5 | .comment-list ol {
6 | list-style: none;
7 | }
8 |
9 | .comment-form p {
10 | @extend .form-group !optional;
11 | }
12 |
13 | .comment-form input[type="text"],
14 | .comment-form input[type="email"],
15 | .comment-form input[type="url"],
16 | .comment-form textarea {
17 | @extend .form-control;
18 | }
19 |
20 | .comment-form input[type="submit"] {
21 | @extend .btn;
22 | @extend .btn-secondary;
23 | }
24 |
25 | blockquote {
26 | margin-bottom: 1rem;
27 | font-size: 1.25rem;
28 | border-left: 3px solid $gray-300;
29 | padding-left: 1rem;
30 | }
31 |
--------------------------------------------------------------------------------
/layouts/partials/sidebar/docs-menu.html:
--------------------------------------------------------------------------------
1 | {{ if and .Site.Params.menu.section.auto .Site.Params.menu.section.collapsibleSidebar -}}
2 | {{ partial "sidebar/auto-collapsible-menu.html" . -}}
3 | {{ else if and .Site.Params.menu.section.auto (not .Site.Params.menu.section.collapsibleSidebar) -}}
4 | {{ partial "sidebar/auto-default-menu.html" . -}}
5 | {{ else if and (not .Site.Params.menu.section.auto) .Site.Params.menu.section.collapsibleSidebar -}}
6 | {{ partial "sidebar/manual-collapsible-menu.html" . -}}
7 | {{ else if and (not .Site.Params.menu.section.auto) (not .Site.Params.menu.section.collapsibleSidebar) -}}
8 | {{ partial "sidebar/manual-default-menu.html" . -}}
9 | {{ end -}}
--------------------------------------------------------------------------------
/config/_default/markup.toml:
--------------------------------------------------------------------------------
1 | defaultMarkdownHandler = "goldmark"
2 |
3 | [goldmark]
4 | [goldmark.extensions]
5 | linkify = false
6 | [goldmark.parser]
7 | autoHeadingID = true
8 | autoHeadingIDType = "github"
9 | [goldmark.parser.attribute]
10 | block = true
11 | title = true
12 | [goldmark.renderer]
13 | unsafe = true
14 |
15 | [highlight]
16 | codeFences = false
17 | guessSyntax = false
18 | hl_Lines = ""
19 | lineNoStart = 1
20 | lineNos = false
21 | lineNumbersInTable = true
22 | noClasses = false
23 | style = "dracula"
24 | tabWidth = 4
25 |
26 | [tableOfContents]
27 | endLevel = 3
28 | ordered = false
29 | startLevel = 2
30 |
--------------------------------------------------------------------------------
/layouts/partials/head/resource-hints.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | {{ if .Site.Params.options.kaTex -}}
5 |
6 |
7 | {{ end -}}
--------------------------------------------------------------------------------
/theme.toml:
--------------------------------------------------------------------------------
1 | name = "Doks"
2 | license = "MIT"
3 | licenselink = "https://github.com/h-enk/doks/blob/master/LICENSE"
4 | description = "Hugo theme helping you build modern documentation websites that are secure, fast, and SEO-ready — by default."
5 |
6 | homepage = "https://github.com/h-enk/doks"
7 | demosite = "https://doks.netlify.app"
8 |
9 | tags = ["landing page", "documentation", "blog", "minimal", "modern", "customizable", "search", "dark mode", "bootstrap"]
10 | features = ["security aware", "fast by default", "seo-ready", "development tools", "bootstrap framework", "netlify-ready", "full text search", "page layouts", "dark mode"]
11 |
12 | [author]
13 | name = "Henk Verlinde"
14 | homepage = "https://henkverlinde.com"
15 |
--------------------------------------------------------------------------------
/.eslintrc.json:
--------------------------------------------------------------------------------
1 | {
2 | "env": {
3 | "browser": true,
4 | "commonjs": true,
5 | "es6": true,
6 | "node": true
7 | },
8 | "extends": "eslint:recommended",
9 | "globals": {
10 | "Atomics": "readonly",
11 | "SharedArrayBuffer": "readonly"
12 | },
13 | "parserOptions": {
14 | "ecmaVersion": 2018,
15 | "sourceType": "module"
16 | },
17 | "rules": {
18 | "no-console": 0,
19 | "quotes": ["error", "single"],
20 | "comma-dangle": [
21 | "error",
22 | {
23 | "arrays": "always-multiline",
24 | "objects": "always-multiline",
25 | "imports": "always-multiline",
26 | "exports": "always-multiline",
27 | "functions": "ignore"
28 | }
29 | ]
30 | }
31 | }
--------------------------------------------------------------------------------
/layouts/partials/footer/footer.html:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/layouts/partials/main/docs-navigation.html:
--------------------------------------------------------------------------------
1 | {{ if or .Prev .Next -}}
2 |
24 | {{ end -}}
--------------------------------------------------------------------------------
/layouts/contributors/list.html:
--------------------------------------------------------------------------------
1 | {{ define "main" }}
2 |
3 |
23 | {{ end }}
--------------------------------------------------------------------------------
/layouts/partials/head/stylesheet.html:
--------------------------------------------------------------------------------
1 | {{ if eq (hugo.Environment) "development" -}}
2 | {{ $options := (dict "targetPath" "main.css" "enableSourceMap" true "includePaths" (slice "node_modules")) -}}
3 | {{ $css := resources.Get "scss/app.scss" | toCSS $options -}}
4 |
5 | {{ else -}}
6 | {{ $options := (dict "targetPath" "main.css" "outputStyle" "compressed" "includePaths" (slice "node_modules")) -}}
7 | {{ $css := resources.Get "scss/app.scss" | toCSS $options | postCSS (dict "config" "config/postcss.config.js") -}}
8 | {{ $secureCSS := $css | resources.Fingerprint "sha512" -}}
9 |
10 | {{ end -}}
11 |
--------------------------------------------------------------------------------
/layouts/blog/list.html:
--------------------------------------------------------------------------------
1 | {{ define "main" }}
2 |
4 |
5 |
21 |
22 | {{ .Title }}
6 |{{ .Content }}
7 |
8 | {{ range .Data.Pages -}}
9 |
20 |
10 |
18 | {{ end -}}
19 |
11 |
17 | {{ .Params.title }}
12 | {{ if eq .Section "blog" -}} 13 |{{ .Params.lead | safeHTML }}
14 | {{ partial "main/blog-meta.html" . -}} 15 | {{ end -}} 16 |
3 |
24 | {{ end }}
--------------------------------------------------------------------------------
/layouts/partials/main/last-modified.html:
--------------------------------------------------------------------------------
1 | {{ if and .GitInfo .Site.Params.docsRepo -}}
2 | {{- $date := partial "main/date" (dict "Date" .GitInfo.AuthorDate.Local "Format" .Site.Params.BookDateFormat) -}}
3 | {{- $commitPath := default "commit" .Site.Params.BookCommitPath -}}
4 |
10 | {{ end -}}
--------------------------------------------------------------------------------
/layouts/book/list.html:
--------------------------------------------------------------------------------
1 | {{ define "main" }}
2 |
4 |
5 |
22 |
23 | {{ .Title }}
6 |{{ .Content }}
7 |
8 | {{ $paginator := .Paginate (.Data.Pages) -}}
9 | {{ range $paginator.Pages -}}
10 |
21 |
11 |
17 | {{ end -}}
18 | {{ $.Scratch.Set "paginator" true }}
19 | {{ template "_internal/pagination.html" . }}
20 |
12 |
16 | {{ .Params.title }}
13 |{{ .Params.lead | safeHTML }}
14 | {{ partial "main/blog-meta.html" . -}} 15 |
3 |
22 | {{ end }}
--------------------------------------------------------------------------------
/layouts/docs/list.html:
--------------------------------------------------------------------------------
1 | {{ define "main" }}
2 |
4 |
5 |
20 |
21 | {{ if eq .CurrentSection .FirstSection }}{{ .Section | humanize }}{{ else }}{{ .Title }}{{ end }}
6 |{{ .Content }}
7 |
8 | {{ $currentSection := .CurrentSection }}
9 | {{ range where .Site.RegularPages.ByTitle "Section" .Section }}
10 | {{ if in (.RelPermalink | string) $currentSection.RelPermalink }}
11 |
19 |
12 |
16 | {{ end }}
17 | {{ end }}
18 |
13 | {{ .Params.title | title }} →
14 |
15 |
3 |
22 | {{ end }}
--------------------------------------------------------------------------------
/assets/scss/components/_images.scss:
--------------------------------------------------------------------------------
1 | figure {
2 | margin: 2rem 0;
3 | }
4 |
5 | .figure-caption {
6 | margin: 0.25rem 0 0.75rem;
7 | }
8 |
9 | figure.wide {
10 | margin: 2rem -1.5rem;
11 | }
12 |
13 | figure.wide .figure-caption {
14 | margin: 0.25rem 1.5rem 0.75rem;
15 | }
16 |
17 | @include media-breakpoint-up(md) {
18 | figure.wide {
19 | margin: 2rem -2.5rem;
20 | }
21 |
22 | figure.wide .figure-caption {
23 | margin: 0.25rem 2.5rem 0.75rem;
24 | }
25 | }
26 |
27 | @include media-breakpoint-up(lg) {
28 | figure.wide {
29 | margin: 2rem -5rem;
30 | }
31 |
32 | figure.wide .figure-caption {
33 | margin: 0.25rem 5rem 0.75rem;
34 | }
35 | }
36 |
37 | .blur-up {
38 | filter: blur(5px);
39 | }
40 |
41 | .blur-up.lazyloaded {
42 | filter: unset;
43 | }
44 |
45 | .img-simple {
46 | margin-top: 0.375rem;
47 | margin-bottom: 1.25rem;
48 | }
49 |
--------------------------------------------------------------------------------
/layouts/index.headers:
--------------------------------------------------------------------------------
1 | /*
2 | Strict-Transport-Security: max-age=31536000; includeSubDomains; preload
3 | X-Content-Type-Options: nosniff
4 | X-XSS-Protection: 1; mode=block
5 | Content-Security-Policy: default-src 'self'; frame-ancestors https://jamstackthemes.dev; manifest-src 'self' https://*.netlify.app; connect-src 'self' https://*.netlify.app; font-src 'self' https://*.netlify.app; img-src 'self' https://*.netlify.app data:; script-src 'self' https://*.netlify.app 'sha512-RBYr6Ld4w1yVqaACrgrBLQfPgGhj/1jyacA74WxJ1KM6KVcSWymwrdDwb3HDcdpwiNJ5yssot1He0U9vXoQVlg==' 'sha256-aWZ3y/RxbBYKHXH0z8+8ljrHG1mSBvyzSfxSMjBSaXk=' 'sha256-vOgyKS2vkH4n5TxBJpeh9SgzrE6LVGsAeOAvEST6oCc='; style-src 'self' https://*.netlify.app 'unsafe-inline'
6 | X-Frame-Options: SAMEORIGIN
7 | Referrer-Policy: strict-origin
8 | Feature-Policy: geolocation 'self'
9 | Cache-Control: public, max-age=31536000
10 | Access-Control-Allow-Origin: *
--------------------------------------------------------------------------------
/static/doks.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/static/logo-doks.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/assets/js/clipboard.js:
--------------------------------------------------------------------------------
1 | import Clipboard from 'clipboard';
2 |
3 | var pre = document.getElementsByTagName('pre');
4 |
5 | for (var i = 0; i < pre.length; ++ i)
6 | {
7 | var element = pre[i];
8 | var mermaid = element.getElementsByClassName('language-mermaid')[0];
9 |
10 | if (mermaid == null) {
11 | element.insertAdjacentHTML('afterbegin', '');
12 | }
13 | }
14 |
15 | var clipboard = new Clipboard('.btn-copy', {
16 |
17 | target: function(trigger) {
18 | return trigger.nextElementSibling;
19 | },
20 |
21 | });
22 |
23 | clipboard.on('success', function(e) {
24 |
25 | /*
26 | console.info('Action:', e.action);
27 | console.info('Text:', e.text);
28 | console.info('Trigger:', e.trigger);
29 | */
30 |
31 | e.clearSelection();
32 | });
33 |
34 | clipboard.on('error', function(e) {
35 | console.error('Action:', e.action);
36 | console.error('Trigger:', e.trigger);
37 | });
38 |
--------------------------------------------------------------------------------
/assets/js/highlight.js:
--------------------------------------------------------------------------------
1 | import hljs from 'highlight.js/lib/core';
2 |
3 | import javascript from 'highlight.js/lib/languages/javascript';
4 | import json from 'highlight.js/lib/languages/json';
5 | import bash from 'highlight.js/lib/languages/bash';
6 | import xml from 'highlight.js/lib/languages/xml';
7 | import ini from 'highlight.js/lib/languages/ini';
8 | import yaml from 'highlight.js/lib/languages/yaml';
9 | import markdown from 'highlight.js/lib/languages/markdown';
10 |
11 | hljs.registerLanguage('javascript', javascript);
12 | hljs.registerLanguage('json', json);
13 | hljs.registerLanguage('bash', bash);
14 | hljs.registerLanguage('html', xml);
15 | hljs.registerLanguage('ini', ini);
16 | hljs.registerLanguage('toml', ini);
17 | hljs.registerLanguage('yaml', yaml);
18 | hljs.registerLanguage('md', markdown);
19 |
20 | document.addEventListener('DOMContentLoaded', () => {
21 | document.querySelectorAll('pre code:not(.language-mermaid)').forEach((block) => {
22 | hljs.highlightElement(block);
23 | });
24 | });
25 |
--------------------------------------------------------------------------------
/assets/scss/app.scss:
--------------------------------------------------------------------------------
1 | /** Import Bootstrap functions */
2 | @import "bootstrap/scss/functions";
3 |
4 | /** Import theme variables */
5 | @import "common/variables";
6 |
7 | /** Import Bootstrap */
8 | @import "bootstrap/scss/bootstrap";
9 |
10 | /** Import highlight.js */
11 | // @import "highlight.js/scss/github-dark-dimmed";
12 |
13 | /** Import KaTeX */
14 | @import "katex/dist/katex";
15 |
16 | /** Import theme styles */
17 | @import "common/fonts";
18 | @import "common/global";
19 | @import "common/dark";
20 | @import "components/alerts";
21 | @import "components/buttons";
22 | @import "components/code";
23 | @import "components/details";
24 | @import "components/syntax";
25 | @import "components/comments";
26 | @import "components/forms";
27 | @import "components/images";
28 | @import "components/mermaid";
29 | @import "components/search";
30 | @import "components/tables";
31 | @import "layouts/footer";
32 | @import "layouts/header";
33 | @import "layouts/pages";
34 | @import "layouts/posts";
35 | @import "layouts/sidebar";
36 |
--------------------------------------------------------------------------------
/assets/js/darkmode.js:
--------------------------------------------------------------------------------
1 | const mode = document.getElementById('mode');
2 |
3 | if (mode !== null) {
4 |
5 | window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', event => {
6 |
7 | if (event.matches) {
8 |
9 | localStorage.setItem('theme', 'dark');
10 | document.documentElement.setAttribute('data-dark-mode', '');
11 |
12 | } else {
13 |
14 | localStorage.setItem('theme', 'light');
15 | document.documentElement.removeAttribute('data-dark-mode');
16 |
17 | }
18 |
19 | })
20 |
21 | mode.addEventListener('click', () => {
22 |
23 | document.documentElement.toggleAttribute('data-dark-mode');
24 | localStorage.setItem('theme', document.documentElement.hasAttribute('data-dark-mode') ? 'dark' : 'light');
25 |
26 | });
27 |
28 | if (localStorage.getItem('theme') === 'dark') {
29 |
30 | document.documentElement.setAttribute('data-dark-mode', '');
31 |
32 | } else {
33 |
34 | document.documentElement.removeAttribute('data-dark-mode');
35 |
36 | }
37 |
38 | }
39 |
--------------------------------------------------------------------------------
/config/_default/languages.toml:
--------------------------------------------------------------------------------
1 | [en]
2 | languageName = "English"
3 | contentDir = "content/en"
4 | weight = 10
5 | [en.params]
6 | languageISO = "EN"
7 |
8 | [de]
9 | languageName = "German"
10 | contentDir = "content/de"
11 | weight = 15
12 | [de.params]
13 | languageISO = "DE"
14 |
15 | [nl]
16 | languageName = "Nederlands"
17 | contentDir = "content/nl"
18 | weight = 20
19 | [nl.params]
20 | languageISO = "NL"
21 | titleAddition = "Modern documentatie-thema"
22 | description = "Doks is een Hugo-thema waarmee je moderne documentatie-websites kunt bouwen die veilig, snel en klaar voor SEO zijn — standaard."
23 | titleHome = "Doks thema"
24 | footer = "Mogelijk gemaakt door Netlify, Hugo, en Doks"
25 | alertText = "Introductie van het Doks-kinderthema, verschillende DX + UX-updates en meer! Bekijk Doks v0.2"
26 |
--------------------------------------------------------------------------------
/layouts/_default/baseof.html:
--------------------------------------------------------------------------------
1 |
2 |
3 | {{ partial "head/head.html" . }}
4 | {{ if eq .Kind "home" -}}
5 | {{ .Scratch.Set "class" "home" -}}
6 | {{ else if eq .Kind "404" -}}
7 | {{ .Scratch.Set "class" "error404" -}}
8 | {{ else if eq .Kind "page" -}}
9 | {{ .Scratch.Set "class" .Type -}}
10 | {{ .Scratch.Add "class" " single" -}}
11 | {{ else -}}
12 | {{ .Scratch.Set "class" .Type -}}
13 | {{ .Scratch.Add "class" " list" -}}
14 | {{ end -}}
15 |
16 | {{ partial "header/header.html" . }}
17 |
22 | {{ block "sidebar-prefooter" . }}{{ end }}
23 | {{ block "sidebar-footer" . }}{{ end }}
24 | {{ partial "footer/footer.html" . }}
25 | {{ partial "footer/script-footer.html" . }}
26 |
27 |
--------------------------------------------------------------------------------
/layouts/sitemap.xml:
--------------------------------------------------------------------------------
1 | {{ printf "" | safeHTML }}
2 |
4 |
5 |
20 |
21 | {{ if eq .CurrentSection .FirstSection }}{{ .Section | humanize }}{{ else }}{{ .Title }}{{ end }}
6 |{{ .Content }}
7 |
8 | {{ $currentSection := .CurrentSection }}
9 | {{ range where .Site.RegularPages.ByTitle "Section" .Section }}
10 | {{ if in (.RelPermalink | string) $currentSection.RelPermalink }}
11 |
19 |
12 |
16 | {{ end }}
17 | {{ end }}
18 |
13 | {{ .Params.title | title }} →
14 |
15 | {{ .Title }}
4 |{{ .Params.lead | safeHTML }}
5 | {{ .Content }} 6 |
7 | {{ range $release := sort (index $.Site.Data "docs-versions") "group" "desc" -}}
8 |
26 |
9 |
24 | {{ end -}}
25 | {{ $release.group }}
10 |{{ $release.description }}
11 | {{ $versions := sort $release.versions "v" "desc" -}} 12 | {{ range $i, $version := $versions -}} 13 | {{ $len := len $versions -}} 14 | {{ if (eq $i 0) }}{{ end }}
15 |
16 | {{ $version.v }}
17 | {{ if (eq $version.v $.Site.Params.docsVersion) -}}
18 | Latest
19 | {{ end -}}
20 |
21 | {{ if (eq (add $i 1) $len) }}
{{ end }}
22 | {{ end -}}
23 | {{ .Title }}
8 |-
9 | {{ range .Pages }}
10 | {{ if .IsNode }}
11 | {{ $active := in $currentPage.RelPermalink .RelPermalink }}
12 |
- {{ .Name }} 22 | {{ end }} 23 |
- {{ .Name }} 27 | {{ end }} 28 | {{ end }} 29 |
- {{ .Name }} 33 | {{ end }} 34 | {{ end }} 35 |
{{ .Title }}
13 |-
14 | {{ range .Pages }}
15 | {{ if .IsNode }}
16 | {{ $active := in $currentPage.RelPermalink .RelPermalink }}
17 |
{{ .Title }}
18 |-
19 | {{ range .Pages }}
20 | {{ $active := in $currentPage.RelPermalink .RelPermalink }}
21 |
3 |
8 | {{ if ne .Params.toc false -}}
9 |
12 | {{ end -}}
13 | {{ if .Params.toc -}}
14 |
15 | {{ else -}}
16 |
17 | {{ end -}}
18 | {{ if .Site.Params.options.breadCrumb -}}
19 |
20 |
26 | {{ end }}
27 |
52 |
53 | {{ end }}
54 |
--------------------------------------------------------------------------------
/layouts/docs/single.html:
--------------------------------------------------------------------------------
1 | {{ define "main" }}
2 |
3 |
8 | {{ if ne .Params.toc false -}}
9 |
12 | {{ end -}}
13 | {{ if .Params.toc -}}
14 |
15 | {{ else -}}
16 |
17 | {{ end -}}
18 | {{ if .Site.Params.options.breadCrumb -}}
19 |
20 |
26 | {{ end }}
27 |
52 |
53 | {{ end }}
54 |
--------------------------------------------------------------------------------
/layouts/_default/section.sitemap.xml:
--------------------------------------------------------------------------------
1 | {{ printf "" | safeHTML -}}
2 | {{ .Title }}
28 |{{ .Params.lead | safeHTML }}
29 | {{ if ne .Params.toc false -}} 30 | 33 | {{ end -}} 34 | {{ .Content }} 35 | 43 | {{ partial "main/docs-navigation.html" . }} 44 | 51 |{{ .Name }}
6 | {{ if .HasChildren -}} 7 |-
8 | {{ range .Children -}}
9 | {{ if .HasChildren -}}
10 |
- {{ .Name }} 22 | {{ end -}} 23 |
- {{ .Name }} 29 | {{ end -}} 30 | {{ end -}} 31 |
- {{ .Name }} 37 | {{ end -}} 38 | {{ end -}} 39 |
{{ .Name }}
11 | {{ if .HasChildren -}} 12 |-
13 | {{ range .Children -}}
14 | {{ if .HasChildren -}}
15 |
{{ .Name }}
16 | {{ if .HasChildren -}} 17 |-
18 | {{ range .Children -}}
19 | {{- $active := or ($currentPage.IsMenuCurrent $section .) ($currentPage.HasMenuCurrent $section .) -}}
20 | {{- $active = or $active (eq $currentPage.Section .Identifier) -}}
21 |
36 |
87 |
37 |
59 |
38 |
43 | 密码学基础 🔐
39 |40 | 介绍构成区块链底层的密码学基础知识，哈希算法、对称加密与非对称加密、数字签名等。 41 |
42 |
44 |
49 | ️区块链基础 🧩
45 |46 | 介绍区块链相关的基础知识，区块链特点、区块链存储结构、点对点网络、钱包原理、共识算法等。 47 |
48 |
50 |
58 | 51 | 以太坊与 Solidity ⚡️ 52 |
53 |54 | 介绍以 Ethereum 为基础的智能合约开发，Remix、Truffle、Ganache 55 | 等开发工具，Solidity 编程语言，智能合约 的相关概念、部署与发布。 56 |
57 |
60 |
86 |
61 |
68 | NFT & DeFi 💰
62 |63 | 介绍基于智能合约的两个最热门的方向，NFT 和 DeFi，解读 ERC721 和 64 | ERC1155 等协议， 分析 DEX Uniswap 65 | 的实现方式，并从零构建一个去中心化的交易所。 66 |
67 |
69 |
78 | 70 | 多链生态 🚀 71 |
72 |73 | 介绍除 Ethereum 之外的其他几个热门公链，如 Cosmos、BSC 74 | 等，以及涉及到的跨链 技术，各种跨链桥的实现，解读 LayerZero、CCIP 75 | 等跨链协议，并从零构建一个 ERC20 的跨链桥。 76 |
77 |
79 |
85 | 最佳实践 🛠
80 |81 | 介绍 Web 3 开发中的相关最佳实践，基础设施 Infura、Alchemy、The Graph 等的使用， 82 | DAPP 项目的整体架构等。 83 |
84 |
91 |
93 | {{- .Content -}}
92 |
7 | {{ end -}}
8 |
9 |
10 |
11 |
12 |
108 |
109 |
110 | {{ if eq .Site.Params.options.flexSearch false }}
111 |
112 | {{ end -}}
113 |
114 | {{ if eq .Section "docs" -}}
115 |
148 |
149 |
156 |
157 | {{ else if ne .CurrentSection .FirstSection -}}
158 |
167 |
168 |
175 | {{ end -}}
176 |
--------------------------------------------------------------------------------
/assets/scss/common/_dark.scss:
--------------------------------------------------------------------------------
1 | /** Theme variables */
2 |
3 | // Source: https://material.io/design/color/dark-theme.html
4 |
5 | $body-bg-dark: $gray-900;
6 | $body-overlay-dark: darken($body-bg-dark, 2.5%);
7 |
8 | /*
9 | $border-dark: darken($body-bg-dark, 2.5%);
10 | */
11 | $border-dark: $gray-800;
12 | $body-color-dark: $gray-300;
13 | $dots-dark: darken($body-color-dark, 50%);
14 |
15 | $link-color-dark: $blue-300;
16 | $button-color-dark: $link-color-dark;
17 | $focus-color-dark: lighten($link-color-dark, 2.5%);
18 |
19 | $navbar-dark-color: $body-color-dark;
20 | $navbar-dark-hover-color: $link-color-dark;
21 | $navbar-dark-active-color: $link-color-dark;
22 |
23 | /** Theme styles */
24 |
25 | [data-dark-mode] body {
26 | background: $body-bg-dark;
27 | color: $body-color-dark;
28 | }
29 |
30 | [data-dark-mode] body a {
31 | color: $link-color-dark;
32 | }
33 |
34 | [data-dark-mode] body a.text-body {
35 | color: $body-color-dark !important;
36 | }
37 |
38 | [data-dark-mode] body .btn-primary {
39 | @include button-variant($button-color-dark, $button-color-dark);
40 |
41 | color: $body-bg-dark !important;
42 | }
43 |
44 | [data-dark-mode] body .btn-outline-primary {
45 | @include button-outline-variant($button-color-dark, $button-color-dark);
46 |
47 | color: $link-color-dark;
48 | }
49 |
50 | [data-dark-mode] body .btn-outline-primary:hover {
51 | color: $body-bg-dark;
52 | }
53 |
54 | [data-dark-mode] body .btn-doks-light {
55 | color: $navbar-dark-color;
56 | }
57 |
58 | [data-dark-mode] body .show > .btn-doks-light,
59 | [data-dark-mode] body .btn-doks-light:hover,
60 | [data-dark-mode] body .btn-doks-light:active {
61 | color: $link-color-dark;
62 | }
63 |
64 | [data-dark-mode] body .btn-menu svg {
65 | color: $body-color-dark;
66 | }
67 |
68 | [data-dark-mode] body .doks-sidebar-toggle {
69 | color: $navbar-dark-color;
70 | }
71 |
72 | [data-dark-mode] body .btn-menu:hover,
73 | [data-dark-mode] body .btn-doks-light:hover,
74 | [data-dark-mode] body .doks-sidebar-toggle:hover {
75 | background: $body-overlay-dark;
76 | }
77 |
78 | /*
79 | [data-dark-mode] body .dropdown-menu {
80 | @extend .dropdown-menu-dark;
81 | }
82 | */
83 |
84 | [data-dark-mode] body .navbar,
85 | [data-dark-mode] body .doks-subnavbar {
86 | background-color: rgba(33, 37, 41, 0.95);
87 | border-bottom: 1px solid $border-dark;
88 | }
89 |
90 | [data-dark-mode] body.home .navbar {
91 | border-bottom: 0;
92 | }
93 |
94 | [data-dark-mode] body .offcanvas-header {
95 | border-bottom: 1px solid $gray-800;
96 | }
97 |
98 | [data-dark-mode] body .offcanvas .nav-link {
99 | color: $body-color-dark;
100 | }
101 |
102 | [data-dark-mode] body .offcanvas .nav-link:hover,
103 | [data-dark-mode] body .offcanvas .nav-link:focus {
104 | color: $link-color-dark;
105 | }
106 |
107 | [data-dark-mode] body .offcanvas .nav-link.active {
108 | color: $link-color-dark;
109 | }
110 |
111 | [data-dark-mode] body .navbar-light .navbar-brand {
112 | color: $navbar-dark-color !important;
113 | }
114 |
115 | [data-dark-mode] body .navbar-light .navbar-nav .nav-link {
116 | color: $navbar-dark-color;
117 | }
118 |
119 | [data-dark-mode] body .navbar-light .navbar-nav .nav-link:hover,
120 | [data-dark-mode] body .navbar-light .navbar-nav .nav-link:focus {
121 | color: $navbar-dark-hover-color;
122 | }
123 |
124 | [data-dark-mode] body .navbar-light .navbar-nav .nav-link.disabled {
125 | color: $navbar-dark-disabled-color;
126 | }
127 |
128 | [data-dark-mode] body .navbar-light .navbar-nav .show > .nav-link,
129 | [data-dark-mode] body .navbar-light .navbar-nav .active > .nav-link,
130 | [data-dark-mode] body .navbar-light .navbar-nav .nav-link.show,
131 | [data-dark-mode] body .navbar-light .navbar-nav .nav-link.active {
132 | color: $navbar-dark-active-color;
133 | }
134 |
135 | [data-dark-mode] body .navbar-light .navbar-text {
136 | color: $navbar-dark-color;
137 | }
138 |
139 | [data-dark-mode] body .alert-primary a {
140 | color: $body-bg-dark;
141 | }
142 |
143 | [data-dark-mode] body .alert-doks {
144 | background: $body-overlay-dark;
145 | color: $body-color-dark;
146 | }
147 |
148 | [data-dark-mode] body .alert-doks a {
149 | color: $link-color-dark;
150 | }
151 |
152 | [data-dark-mode] body .page-links a {
153 | color: $body-color-dark;
154 | }
155 |
156 | [data-dark-mode] body .btn-toggle-nav a {
157 | color: $body-color-dark;
158 | }
159 |
160 | [data-dark-mode] body .showcase-meta a {
161 | color: $body-color-dark;
162 | }
163 |
164 | [data-dark-mode] body .showcase-meta a:hover,
165 | [data-dark-mode] body .showcase-meta a:focus {
166 | color: $link-color-dark;
167 | }
168 |
169 | [data-dark-mode] body .docs-link:hover,
170 | [data-dark-mode] body .docs-link.active,
171 | [data-dark-mode] body .page-links a:hover {
172 | text-decoration: none;
173 | color: $link-color-dark;
174 | }
175 |
176 | [data-dark-mode] body .btn-toggle {
177 | color: $body-color-dark;
178 | background-color: transparent;
179 | border: 0;
180 | }
181 |
182 | [data-dark-mode] body .btn-toggle:hover,
183 | [data-dark-mode] body .btn-toggle:focus {
184 | color: $body-color-dark;
185 | }
186 |
187 | [data-dark-mode] body .btn-toggle::before {
188 | width: 1.25em;
189 | line-height: 0;
190 | content: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='rgba%28222, 226, 230, 0.75%29' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M5 14l6-6-6-6'/%3e%3c/svg%3e");
191 | transition: transform 0.35s ease;
192 | transform-origin: 0.5em 50%;
193 | margin-bottom: 0.125rem;
194 | }
195 |
196 | [data-dark-mode] body .btn-toggle[aria-expanded="true"] {
197 | color: $body-color-dark;
198 | }
199 |
200 | [data-dark-mode] body .btn-toggle[aria-expanded="true"]::before {
201 | transform: rotate(90deg);
202 | }
203 |
204 | [data-dark-mode] body .btn-toggle-nav a:hover,
205 | [data-dark-mode] body .btn-toggle-nav a:focus {
206 | color: $link-color-dark;
207 | }
208 |
209 | [data-dark-mode] body .btn-toggle-nav a.active {
210 | color: $link-color-dark;
211 | }
212 |
213 | [data-dark-mode] body .navbar-light .navbar-text a {
214 | color: $navbar-dark-active-color;
215 | }
216 |
217 | [data-dark-mode] body .docs-links h3.sidebar-link a,
218 | [data-dark-mode] body .page-links h3.sidebar-link a {
219 | color: $body-color-dark;
220 | }
221 |
222 | [data-dark-mode] body .navbar-light .navbar-text a:hover,
223 | [data-dark-mode] body .navbar-light .navbar-text a:focus {
224 | color: $navbar-dark-active-color;
225 | }
226 |
227 | [data-dark-mode] body .navbar .btn-link {
228 | color: $navbar-dark-color;
229 | }
230 |
231 | [data-dark-mode] body .content .btn-link {
232 | color: $link-color-dark;
233 | }
234 |
235 | [data-dark-mode] body .content .btn-link:hover {
236 | color: $link-color-dark;
237 | }
238 |
239 | [data-dark-mode] body .content img[src^="https://latex.codecogs.com/svg.latex"] {
240 | filter: invert(1);
241 | }
242 |
243 | [data-dark-mode] body .navbar .btn-link:hover {
244 | color: $navbar-dark-hover-color;
245 | }
246 |
247 | [data-dark-mode] body .navbar .btn-link:active {
248 | color: $navbar-dark-active-color;
249 | }
250 |
251 | [data-dark-mode] body .form-control.is-search {
252 | background: $body-overlay-dark;
253 | border: 1px solid transparent;
254 | color: $gray-300;
255 |
256 | /*
257 | background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%236c757d' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-search'%3E%3Ccircle cx='11' cy='11' r='8'%3E%3C/circle%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'%3E%3C/line%3E%3C/svg%3E");
258 | background-repeat: no-repeat;
259 | background-position: right calc(0.375em + 0.1875rem) center;
260 | background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem);
261 | */
262 | }
263 |
264 | [data-dark-mode] body .form-control.is-search:focus {
265 | border: 1px solid $link-color-dark;
266 | }
267 |
268 | [data-dark-mode] body .doks-search::after {
269 | color: $gray-300;
270 | border: 1px solid $gray-700;
271 | }
272 |
273 | [data-dark-mode] body .text-dark {
274 | color: $body-color-dark !important;
275 | }
276 |
277 | /*
278 | [data-dark-mode] body .navbar-form::after {
279 | color: $gray-600;
280 | border: 1px solid $gray-800;
281 | }
282 | */
283 |
284 | [data-dark-mode] body .form-control {
285 | color: $gray-300;
286 | }
287 |
288 | [data-dark-mode] body .form-control::placeholder {
289 | color: $gray-400;
290 | opacity: 1;
291 | }
292 |
293 | [data-dark-mode] body .border-top {
294 | border-top: 1px solid $border-dark !important;
295 | }
296 |
297 | @include media-breakpoint-up(lg) {
298 | [data-dark-mode] body .docs-sidebar {
299 | order: 0;
300 | border-right: 1px solid $border-dark;
301 | }
302 | }
303 |
304 | [data-dark-mode] body .docs-navigation {
305 | border-top: 1px solid $border-dark;
306 | }
307 |
308 | [data-dark-mode] body pre code::-webkit-scrollbar-thumb {
309 | background: $gray-400;
310 | }
311 |
312 | [data-dark-mode] body code:not(.hljs) {
313 | background: $body-overlay-dark;
314 | color: $body-color-dark;
315 | }
316 |
317 | [data-dark-mode] body pre code:hover {
318 | scrollbar-width: thin;
319 | scrollbar-color: $border-dark transparent;
320 | }
321 |
322 | [data-dark-mode] body pre code::-webkit-scrollbar-thumb:hover {
323 | background: $gray-500;
324 | }
325 |
326 | [data-dark-mode] body blockquote {
327 | border-left: 3px solid $border-dark;
328 | }
329 |
330 | [data-dark-mode] body .footer {
331 | border-top: 1px solid $border-dark;
332 | }
333 |
334 | [data-dark-mode] body .docs-links,
335 | [data-dark-mode] body .docs-toc {
336 | scrollbar-width: thin;
337 | scrollbar-color: $body-bg-dark $body-bg-dark;
338 | }
339 |
340 | [data-dark-mode] body .docs-links::-webkit-scrollbar,
341 | [data-dark-mode] body .docs-toc::-webkit-scrollbar {
342 | width: 5px;
343 | }
344 |
345 | [data-dark-mode] body .docs-links::-webkit-scrollbar-track,
346 | [data-dark-mode] body .docs-toc::-webkit-scrollbar-track {
347 | background: $body-bg-dark;
348 | }
349 |
350 | [data-dark-mode] body .docs-links::-webkit-scrollbar-thumb,
351 | [data-dark-mode] body .docs-toc::-webkit-scrollbar-thumb {
352 | background: $body-bg-dark;
353 | }
354 |
355 | [data-dark-mode] body .docs-links:hover,
356 | [data-dark-mode] body .docs-toc:hover {
357 | scrollbar-width: thin;
358 | scrollbar-color: $border-dark $body-bg-dark;
359 | }
360 |
361 | [data-dark-mode] body .docs-links:hover::-webkit-scrollbar-thumb,
362 | [data-dark-mode] body .docs-toc:hover::-webkit-scrollbar-thumb {
363 | background: $border-dark;
364 | }
365 |
366 | [data-dark-mode] body .docs-links::-webkit-scrollbar-thumb:hover,
367 | [data-dark-mode] body .docs-toc::-webkit-scrollbar-thumb:hover {
368 | background: $border-dark;
369 | }
370 |
371 | [data-dark-mode] body .docs-links h3:not(:first-child) {
372 | border-top: 1px solid $border-dark;
373 | }
374 |
375 | [data-dark-mode] body a.docs-link {
376 | color: $body-color-dark;
377 | }
378 |
379 | [data-dark-mode] body .page-links li:not(:first-child) {
380 | border-top: 1px dashed $border-dark;
381 | }
382 |
383 | [data-dark-mode] body .card {
384 | background: $body-bg-dark;
385 | border: 1px solid $border-dark;
386 | }
387 |
388 | [data-dark-mode] body .card.bg-light {
389 | background: $body-overlay-dark !important;
390 | }
391 |
392 | [data-dark-mode] body .navbar .menu-icon .navicon {
393 | background: $navbar-dark-color;
394 | }
395 |
396 | [data-dark-mode] body .navbar .menu-icon .navicon::before,
397 | [data-dark-mode] body .navbar .menu-icon .navicon::after {
398 | background: $navbar-dark-color;
399 | }
400 |
401 | [data-dark-mode] body .logo-light {
402 | display: none !important;
403 | }
404 |
405 | [data-dark-mode] body .logo-dark {
406 | display: inline-block !important;
407 | }
408 |
409 | [data-dark-mode] body .bg-light {
410 | background: darken($body-bg-dark, 1.5%) !important;
411 | }
412 |
413 | [data-dark-mode] body .bg-dots {
414 | background-image: radial-gradient($dots-dark 15%, transparent 15%);
415 | }
416 |
417 | [data-dark-mode] body .text-muted {
418 | color: darken($body-color-dark, 7.5%) !important;
419 | }
420 |
421 | [data-dark-mode] body .alert-primary {
422 | background: $link-color-dark;
423 | color: $body-bg-dark;
424 | }
425 |
426 | [data-dark-mode] body .figure-caption {
427 | color: $body-color-dark;
428 | }
429 |
430 | [data-dark-mode] body table {
431 | @extend .table-dark;
432 | }
433 |
434 | [data-dark-mode] body .copy-status::after {
435 | content: "Copy";
436 | display: block;
437 | color: $body-color-dark;
438 | }
439 |
440 | [data-dark-mode] body .copy-status:hover::after {
441 | content: "Copy";
442 | display: block;
443 | color: $link-color-dark;
444 | }
445 |
446 | [data-dark-mode] body .copy-status:focus::after,
447 | [data-dark-mode] body .copy-status:active::after {
448 | content: "Copied";
449 | display: block;
450 | color: $link-color-dark;
451 | }
452 |
453 | /*
454 | [data-dark-mode] body .dropdown-toggle:focus,
455 | [data-dark-mode] body .doks-sidebar-toggle:focus {
456 | box-shadow: 0 0 0 0.2rem $focus-color-dark;
457 | }
458 | */
459 |
460 | [data-dark-mode] body .offcanvas {
461 | background-color: $body-bg-dark;
462 | }
463 |
464 | [data-dark-mode] body .btn-close {
465 | background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9IiNkZWUyZTYiIHN0cm9rZS13aWR0aD0iMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBjbGFzcz0iZmVhdGhlciBmZWF0aGVyLXgiPjxsaW5lIHgxPSIxOCIgeTE9IjYiIHgyPSI2IiB5Mj0iMTgiPjwvbGluZT48bGluZSB4MT0iNiIgeTE9IjYiIHgyPSIxOCIgeTI9IjE4Ij48L2xpbmU+PC9zdmc+");
466 | background-size: 1.5rem;
467 | }
468 |
469 | @include media-breakpoint-up(md) {
470 | [data-dark-mode] body .alert-dismissible .btn-close {
471 | background-size: 1.25rem;
472 | }
473 | }
474 |
475 | /*
476 | [data-dark-mode] body .btn-close:focus {
477 | box-shadow: 0 0 0 0.2rem $focus-color-dark;
478 | }
479 | */
480 |
481 | [data-dark-mode] .dropdown-item {
482 | color: $body-bg-dark;
483 | }
484 |
485 | [data-dark-mode] body hr.text-black-50 {
486 | color: $gray-600 !important;
487 | }
488 |
489 | [data-dark-mode] body .email-form .form-control {
490 | background: $body-overlay-dark;
491 | border: 1px solid transparent;
492 | }
493 |
494 | [data-dark-mode] body .email-form .form-control:focus {
495 | border: 1px solid $link-color-dark;
496 | }
497 |
498 | [data-dark-mode] .page-link {
499 | color: $link-color-dark;
500 | background-color: transparent;
501 | border: $pagination-border-width solid $border-dark;
502 |
503 | &:hover {
504 | color: $body-bg-dark;
505 | background-color: $body-color-dark;
506 | border-color: $body-color-dark;
507 | }
508 |
509 | &:focus {
510 | color: $body-bg-dark;
511 | background-color: $body-color-dark;
512 | }
513 | }
514 |
515 | [data-dark-mode] .page-item {
516 | &.active .page-link {
517 | color: $body-bg-dark;
518 |
519 | @include gradient-bg($link-color-dark);
520 |
521 | border-color: $link-color-dark;
522 | }
523 |
524 | &.disabled .page-link {
525 | color: $pagination-disabled-color;
526 | background-color: $body-overlay-dark;
527 | border-color: $border-dark;
528 | }
529 | }
530 |
531 | [data-dark-mode] .dropdown-menu {
532 | background: $body-overlay-dark;
533 | }
534 |
535 | [data-dark-mode] .dropdown-menu .dropdown-item {
536 | color: $body-color-dark;
537 | }
538 |
539 | [data-dark-mode] .dropdown-menu .dropdown-item:hover {
540 | color: $link-color-dark;
541 | background: $body-bg-dark;
542 | }
543 |
544 | [data-dark-mode] .dropdown-menu .dropdown-item.active,
545 | [data-dark-mode] .dropdown-menu .dropdown-item:focus {
546 | color: $link-color-dark;
547 | background: $body-bg-dark;
548 | }
549 |
550 | [data-dark-mode] .doks-navbar .dropdown-item.current,
551 | [data-dark-mode] .doks-subnavbar .dropdown-item.current {
552 | background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%23dee2e6' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e");
553 | background-repeat: no-repeat;
554 | background-position: right 1rem top 0.6rem;
555 | background-size: 0.75rem 0.75rem;
556 | }
557 |
558 | [data-dark-mode] details {
559 | border: 1px solid $border-dark;
560 | }
561 |
562 | [data-dark-mode] summary:hover {
563 | background: $body-overlay-dark;
564 | }
565 |
566 | [data-dark-mode] details[open] > summary {
567 | border-bottom: 1px solid $border-dark;
568 | }
569 |
570 | [data-dark-mode] details summary::before {
571 | content: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='rgba%28222, 226, 230, 0.75%29' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M5 14l6-6-6-6'/%3e%3c/svg%3e");
572 | }
573 |
--------------------------------------------------------------------------------