From 0c2af7aac72c74fb2cad8f9e57ccce1e728835e0 Mon Sep 17 00:00:00 2001 From: Martin Michalec Date: Wed, 11 Feb 2026 07:35:07 +0300 Subject: add initial sources --- src/custom.css | 599 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 599 insertions(+) create mode 100644 src/custom.css (limited to 'src/custom.css') diff --git a/src/custom.css b/src/custom.css new file mode 100644 index 0000000..45d33e5 --- /dev/null +++ b/src/custom.css @@ -0,0 +1,599 @@ +@charset "utf-8"; + + +/* Fonts */ + +@font-face { + font-family: "Aporetic Serif Mono"; + font-display: swap; + font-weight: 700; + font-stretch: normal; + font-style: normal; + src: url('/fonts/aporetic-serif-mono-normalbolditalic.woff2') format('woff2'); +} + +@font-face { + font-family: "Aporetic Serif Mono"; + font-display: swap; + font-weight: 700; + font-stretch: normal; + font-style: normal; + src: url('/fonts/aporetic-serif-mono-normalboldupright.woff2') format('woff2'); +} + +@font-face { + font-family: "Aporetic Serif Mono"; + font-display: swap; + font-weight: 400; + font-stretch: normal; + font-style: normal; + src: url('/fonts/aporetic-serif-mono-normalregularitalic.woff2') format('woff2'); +} + +@font-face { + font-family: "Aporetic Serif Mono"; + font-display: swap; + font-weight: 400; + font-stretch: normal; + font-style: normal; + src: url('/fonts/aporetic-serif-mono-normalregularupright.woff2') format('woff2'); +} + +@font-face { + font-family: "Aporetic Serif"; + font-display: swap; + font-weight: 700; + font-stretch: normal; + font-style: normal; + src: url('/fonts/aporetic-serif-normalbolditalic.woff2') format('woff2'); +} + +@font-face { + font-family: "Aporetic Serif"; + font-display: swap; + font-weight: 700; + font-stretch: normal; + font-style: normal; + src: url('/fonts/aporetic-serif-normalboldupright.woff2') format('woff2'); +} + +@font-face { + font-family: "Aporetic Serif"; + font-display: swap; + font-weight: 400; + font-stretch: normal; + font-style: normal; + src: url('/fonts/aporetic-serif-normalregularitalic.woff2') format('woff2'); +} + +@font-face { + font-family: "Aporetic Serif"; + font-display: swap; + font-weight: 400; + font-stretch: normal; + font-style: normal; + src: url('/fonts/aporetic-serif-normalregularupright.woff2') format('woff2'); +} + + +/* Variables */ + +:root { + --font-serif-regular: "Aporetic Serif", serif; + --font-serif-mono: "Aporetic Serif Mono", monospace; + --font-sans-regular: "Aporetic Sans", sans-serif; + --font-sans-mono: "Aporetic Sans Mono", monospace; + + --default-fg: black; + --default-bg: white; + --default-family: var(--font-sans-regular); + --default-size: 14pt; + + --header-family: var(--font-serif-regular); + + --link-fg: #3548cf; + + --body-margin: 0px; + + --divider-color: #9f9f9f; /* window-divider */ + + --content-border: 2px solid var(--divider-color); + --content-padding: 10px; + + --nav-height: 125px; + --toc-nav-vspacing: 20px; + --toc-base-padding: 5px; + --toc-ul-padding-left: 20px; + --toc-local-padding: 5px; + --toc-extra-padding-x: 4px; + + --tbl-border-color: #193668; /* org-table */ + --tbl-border-size: 1px; + + --code-fg: #005f5f; + --code-family: var(--font-serif-mono); + --code-size: var(--default-size); + + --example-family: var(--default-serif-mono); + --example-size: var(--default-size); + + --src-bg: #fbf9e7; + --src-border-color: #7f7f7f; + --src-border: 1px solid var(--src-border-color); + --src-family: var(--default-serif-mono); + + --src-label-fg: var(--src-border-color); + + --src-builtin-fg: #8f0075; + --src-builtin-weight: bold; + + --src-keyword-fg: #531ab6; + --src-keyword-weight: bold; + + --src-variable-name-fg: #005e8b; + + --src-string-fg: #3548cf; + + --src-constant-fg: #0000b0; + + --src-function-name-fg: #721045; + + --src-comment-fg: #595959; + --src-comment-style: italic; + + --src-comment-delimiter-fg: var(--src-comment-fg); + --src-comment-delimiter-style: italic; + + --src-regexp-grouping-backslash-fg: var(--src-function-name-fg); + --src-regexp-grouping-backslash-weight: bold; + + --src-regexp-grouping-construct-fg: #00663f; + --src-regexp-grouping-construct-weight: bold; + + --src-doc-fg: #2a5045; + --src-doc-style: italic; + + --src-type-fg: #005f5f; + --src-type-weight: bold; +} + + +/* Dark overrides */ + +@media (prefers-color-scheme: dark) { + :root { + color-scheme: dark; + + --scrollbar-track-color: #303030; + --scrollbar-thumb-color: #808080; + --scrollbar-thumb-hover-color: #505050; + --scrollbar-corner-color: #404040; + + --default-fg: white; + --default-bg: black; + + --link-fg: #79a8ff; + + --divider-color: #646464; + + --tbl-border-color: #c6daff; + + --src-bg: #1e1e1e; + + --src-builtin-fg: #f78fe7; + --src-keyword-fg: #b6a0ff; + --src-variable-name-fg: #00d3d0; + --src-string-fg: #79a8ff; + --src-constant-fg: #00bcff; + --src-function-name-fg: #feacd0; + + --src-comment-fg: #989898; + + --src-regexp-grouping-construct-fg: #00c06f; + + --src-doc-fg: #9ac8e0; + --src-type-fg: #6ae4b9; + + --code-fg: #6ae4b9; + } +} + + +/* Responsive variables */ + +/* Large screens */ +@media (min-width: 1024px) { + :root { + --side-width: 250px; + --content-width: calc(92% - var(--side-width)); + --nav-base-font-size: 80%; + --nav-padding: 14px 16px; + --toc-base-font-size: 70%; + --toc-ul-font-size: 150%; + --toc-ul-local-font-size: 130%; + --toc-ul-2-font-size: 80%; + --toc-ul-3-font-size: 80%; + --src-size: 14pt; + --rss-padding: 0 0 0 25px; + --rss-size: 25px 25px; + --rss-pos: 50%; + } +} + +/* Medium screens */ +@media (min-width: 600px) and (max-width: 1024px) { + :root { + --side-width: 175px; + --content-width: calc(92% - var(--side-width)); + --nav-base-font-size: 70%; + --nav-padding: 5px 6px; + --toc-base-font-size: 70%; + --toc-ul-font-size: 130%; + --toc-ul-local-font-size: 130%; + --toc-ul-2-font-size: 80%; + --src-size: 14pt; + --rss-padding: 0 0 19px 9px; + --rss-size: 10px 10px; + --rss-pos: 25%; + } +} + +/* Small screens */ +@media (max-width: 600px) { + :root { + --content-width: 100%; + --nav-base-font-size: 80%; + --nav-padding: 5px 6px; + --toc-base-font-size: 80%; + --toc-ul-font-size: 120%; + --toc-ul-local-font-size: 130%; + --toc-ul-2-font-size: 80%; + --src-size: 14pt; + } +} + + +/* Immutable */ + +/* Body */ +body { + color: var(--default-fg); + background-color: var(--default-bg); + font-family: var(--default-family); + font-size: var(--default-size); + + margin: 0; +} + +/* Headers */ +h1, h2, h3, h4, h5, h6 { + font-family: var(--header-family); +} + +/* Scroll bars */ +/* ::-webkit-scrollbar { */ +/* width: 12px; */ +/* height: 12px; */ +/* } */ + +/* ::-webkit-scrollbar-track { */ +/* background: var(--scrollbar-track-color); */ +/* border-radius: 10px; */ +/* } */ + +/* ::-webkit-scrollbar-thumb { */ +/* background: var(--scrollbar-thumb-color); */ +/* border-radius: 10px; */ +/* } */ + +/* ::-webkit-scrollbar-thumb:hover { */ +/* background: var(--scrollbar-thumb-hover-color); */ +/* } */ + +/* ::-webkit-scrollbar-corner { */ +/* background: var(--scrollbar-corner-color); */ +/* } */ + +/* Links */ +a { + color: var(--link-fg); +} + +/* Content */ +#content { + width: var(--content-width); + padding: 0 var(--content-padding); +} + +@media (min-width: 600px) { + #content { + margin-left: calc(var(--side-width) + var(--body-margin) + 2*var(--content-padding)); + margin-right: var(--body-margin); + border-left: var(--content-border); + } +} + +@media (max-width: 600px) { + #content { + margin-left: 0; + margin-right: 0; + } +} + +@media (min-width: 600px) { + nav { + left: var(--content-padding); + position: fixed; + width: var(--side-width); + } + + nav > ul { + padding: 0; + margin: 0; + list-style-type: none; + display: block; + } + + nav > ul > li { + padding: var(--toc-base-padding) 0; + } + + nav > ul > li:not(:last-of-type) { + border-bottom: 1px solid var(--divider-color); + } + + nav > ul > li > ul { + padding: 0; + text-align: center; + overflow-x: auto; + white-space: nowrap; + -ms-overflow-style: none; /* Internet Explorer 10+ */ + scrollbar-width: none; /* Firefox */ + } + nav > ul > li > ul::-webkit-scrollbar { + display: none; /* Safari and Chrome */ + } + + nav > ul > li > ul > li { + display: inline-block; + } +} + +html { +} + +@media (max-width: 600px) { + nav { + border-bottom: 2px solid var(--divider-color); + } + + nav > ul { + padding: 0; + margin: 0 8px; + list-style-type: none; + display: block; + } + + nav > ul > li { + padding: var(--toc-base-padding) 0; + } + + nav > ul > li:not(:last-of-type) { + border-bottom: 1px solid var(--divider-color); + } + + nav > ul > li > ul { + padding: 0; + text-align: center; + overflow-x: auto; + } + + nav > ul > li > ul > li { + display: inline-block; + } +} + +nav > ul > li > span { + display: none; +} + +code { + color: var(--code-fg); + font-family: var(--code-family); + font-size: var(--code-size); +} + +pre.example { + font-family: var(--example-family); + font-size: var(--example-size); +} + +hr { + border: 1px solid var(--divider-color); + /* border-bottom: 1px solid var(--divider-color); */ +} + +.org-src-container { + border: var(--src-border); + background-color: var(--src-bg); + font-family: var(--src-family); + font-size: var(--src-size); + margin: 10px; +} + +.src-label { + top: 0; + left: 0; + color: var(--src-label-fg); + border-bottom: var(--src-border); + padding: 2px; + padding-left: 4px; + display: flex; + justify-content: space-between +} + +pre.src { + max-height: 50ex; + overflow-x: auto; + overflow-y: auto; + line-height: 2.5ex; + margin: 0px; + padding: 4px; +} + +.org-builtin { + color: var(--src-builtin-fg); + weight: var(--src-builtin-weight); +} + +.org-keyword { + color: var(--src-keyword-fg); + weight: var(--src-keyword-weight); +} + +.org-variable-name { + color: var(--src-variable-name-fg); +} + +.org-string { + color: var(--src-string-fg); +} + +.org-constant { + color: var(--src-constant-fg); +} + +.org-comment { + color: var(--src-comment-fg); + font-style: var(--src-comment-style); +} + +.org-comment-delimiter { + color: var(--src-comment-delimiter-fg); + font-style: var(--src-comment-delimiter-style); +} + +.org-function-name { + color: var(--src-function-name-fg); +} + +.org-regexp-grouping-backslash { + color: var(--src-regexp-grouping-backslash-fg); + font-style: var(--src-regexp-grouping-backslash-style); +} + +.org-regexp-grouping-construct { + color: var(--src-regexp-grouping-construct-fg); + font-style: var(--src-regexp-grouping-construct-style); +} + +.org-doc { + color: var(--src-doc-fg); + font-style: var(--src-doc-style); +} + +.org-type { + color: var(--src-type-fg); + weight: var(--src-type-weight); +} + +/* Basic styling (color, font, shadow) common to global and local TOC */ +#table-of-contents, .org-info-js_local-toc { + font-size: var(--toc-base-font-size); +} + +#org-div-home-and-up { + width: var(--side-width); + border-right: var(--toc-border-right); + justify-content: center; +} + +/* Size (global TOC only) */ +#table-of-contents { + width: calc(var(--side-width) - 2*var(--toc-base-padding)); +} + +/* Fixed vertical table of content */ +@media screen and (min-width: 600px) { + #org-div-home-and-up { + position: fixed; + left: var(--content-padding); + overflow: auto; + padding: var(--toc-base-padding); + } + #table-of-contents { + position: fixed; + left: var(--content-padding); + top: var(--nav-height); + bottom: 0; + padding: 0 var(--toc-base-padding); + overflow: auto; + border-top: 2px solid var(--divider-color); + -ms-overflow-style: none; /* Internet Explorer 10+ */ + scrollbar-width: none; /* Firefox */ + } + #table-of-contents::-webkit-scrollbar { + display: none; /* Safari and Chrome */ + } +} + +@media screen and (min-width: 600px) and (max-width: 1024px) { + #table-of-contents > div > ul > li > ul > li > ul { + display: none; + } +} + +@media screen and (max-width: 600px) { + #table-of-contents { + position: relative; + width: 90%; + margin: auto; + } +} + +#table-of-contents ul, .org-info-js_local-toc ul { + list-style-type: none; + margin: 0; + padding-left: var(--toc-ul-padding-left); +} + +#table-of-contents ul { + font-size: var(--toc-ul-font-size); +} + +.org-info-js_local-toc ul { + font-size: var(--toc-ul-local-font-size); +} + +#table-of-contents > div > ul, .org-info-js_local-toc > div > ul { + list-style-type: none; + margin: 0; + padding-left: var(--toc-extra-padding-x); +} + +#table-of-contents > div > ul > li > ul { + font-size: var(--toc-ul-2-font-size); + vertical-align: middle; +} + +#table-of-contents > div > ul > li > ul > li > ul { + font-size: var(--toc-ul-3-font-size); + vertical-align: middle; +} + +ul { + list-style-type: '- '; +} + +table, td, th { + text-align: left; +} + +table { + border-collapse: collapse; + width: 100%; +} + +th, td { + padding: 3px; +} -- cgit v1.3