summaryrefslogtreecommitdiffstats
path: root/docs/style.css
diff options
context:
space:
mode:
Diffstat (limited to 'docs/style.css')
-rw-r--r--docs/style.css574
1 files changed, 574 insertions, 0 deletions
diff --git a/docs/style.css b/docs/style.css
new file mode 100644
index 0000000..ee0fc7f
--- /dev/null
+++ b/docs/style.css
@@ -0,0 +1,574 @@
+/* SPDX-License-Identifier: LGPL-2.1-or-later */
+
+@font-face {
+ font-family: 'Heebo';
+ src: url('fonts/heebo-regular.woff');
+ font-weight: 400;
+}
+
+@font-face {
+ font-family: 'Heebo';
+ src: url('fonts/heebo-bold.woff');
+ font-weight: 600;
+}
+
+/* Variables */
+:root {
+ --sd-brand-black: hsl(270, 19%, 13%); /* #201A26; */
+ --sd-brand-green: hsl(145, 66%, 51%); /* #30D475; */
+ --sd-brand-white: #fff;
+
+ --sd-black: hsl(270, 7%, 13%);
+ --sd-green: hsl(145, 66%, 43%); /* #26b763 */
+ --sd-gray-extralight: hsl(30, 10%, 96%); /* #f6f5f4 */
+ --sd-gray-light: hsl(30, 10%, 92%);
+ --sd-gray: hsl(30, 10%, 85%);
+ --sd-gray-dark: hsl(257, 23%, 20%);
+ --sd-gray-extradark: hsl(257, 23%, 16%); /* #241f31 */
+ --sd-blue: hsl(200, 66%, 55%);
+
+ --sd-highlight-bg-light: rgba(255, 255, 255, 1);
+ --sd-highlight-bg-dark: rgba(0, 0, 0, .6);
+ --sd-highlight-inline-bg-light: rgba(0, 0, 0, 0.07);
+ --sd-highlight-inline-bg-dark: rgba(255, 255, 255, 0.1);
+
+ --sd-font-weight-normal: 400;
+ --sd-font-weight-bold: 600;
+
+ /* Light mode variables */
+ --sd-foreground-color: var(--sd-gray-extradark);
+ --sd-background-color: var(--sd-gray-extralight);
+ --sd-logo-color: var(--sd-brand-black);
+ --sd-link-color: var(--sd-green);
+ --sd-small-color: var(--sd-gray-dark);
+ --sd-highlight-bg: var(--sd-highlight-bg-light);
+ --sd-highlight-inline-bg: var(--sd-highlight-inline-bg-light);
+ --sd-link-font-weight: var(--sd-font-weight-bold);
+ --sd-table-row-bg: var(--sd-highlight-inline-bg-light);
+ --sd-table-row-hover-bg: var(--sd-gray);
+}
+
+@media (prefers-color-scheme: dark) {
+ :root {
+ color-scheme: dark;
+ --sd-foreground-color: var(--sd-gray);
+ --sd-background-color: var(--sd-black);
+ --sd-logo-color: var(--sd-brand-white);
+ --sd-link-color: var(--sd-brand-green);
+ --sd-small-color: var(--sd-gray);
+ --sd-highlight-bg: var(--sd-highlight-bg-dark);
+ --sd-highlight-inline-bg: var(--sd-highlight-inline-bg-dark);
+ --sd-link-font-weight: var(--sd-font-weight-normal);
+ --sd-table-row-bg: var(--sd-highlight-inline-bg-dark);
+ --sd-table-row-hover-bg: var(--sd-highlight-bg-dark);
+ }
+}
+
+/* Typography */
+* {
+ -moz-box-sizing: border-box;
+ -webkit-box-sizing: border-box;
+ box-sizing: border-box;
+}
+html, body {
+ margin: 0;
+ padding: 0;
+ font-size: 1rem;
+ font-family: "Heebo", sans-serif;
+ font-weight: 400;
+ line-height: 1.6;
+}
+body {
+ color: var(--sd-foreground-color);
+ background-color: var(--sd-background-color);
+}
+h1, h2, h3, h4, h5, h6 {
+ margin: 1rem 0 0.625rem;
+ font-weight: 600;
+ line-height: 1.25;
+}
+h1 {
+ text-align: center;
+ font-size: 1.87rem;
+ font-weight: 400;
+ font-style: normal;
+ margin-bottom: 2rem;
+}
+@media screen and (min-width: 650px) {
+ h1 {
+ font-size: 2.375em;
+ }
+}
+h2 {
+ font-size: 1.25rem;
+ margin-top: 2.5em;
+}
+h3 {
+ font-size: 1.15rem;
+}
+a {
+ font-weight: var(--sd-link-font-weight);
+ text-decoration: none;
+ color: var(--sd-link-color);
+ cursor: pointer;
+}
+a:hover {
+ text-decoration: underline;
+}
+b {
+ font-weight: 600;
+}
+small {
+ color: var(--sd-small-color);
+}
+hr {
+ margin: 3rem auto 4rem;
+ width: 40%;
+ opacity: 40%;
+}
+
+/* Layout */
+.container > * {
+ width: 80%;
+ margin-left: auto;
+ margin-right: auto;
+ max-width: 720px;
+}
+
+.container > table {
+ max-width: 1600px;
+}
+
+.container > h1 {
+ max-width: 530px;
+}
+
+/* Tables */
+table {
+ width: auto !important;
+ border-collapse: separate;
+ border-spacing: 0;
+ margin-top: 2em;
+ margin-bottom: 3em;
+ overflow-x: auto;
+ display: block; /* required for overflow-x auto on tables */
+}
+@media screen and (min-width: 768px) {
+ table {
+ display: table;
+ border-left: 1rem solid transparent;
+ border-right: 1rem solid transparent;
+ }
+}
+
+thead tr,
+tbody:first-child tr:nth-child(odd),
+thead + tbody tr:nth-child(even) {
+ background-color: var(--sd-table-row-bg);
+}
+
+tbody tr:hover {
+ background-color: var(--sd-table-row-hover-bg) !important;
+}
+
+th, td {
+ vertical-align: top;
+ text-align: left;
+ padding: .5rem;
+}
+
+th:first-child, td:first-child {
+ padding-left: 0.75rem;
+}
+
+th:last-child, td:last-child {
+ padding-right: 0.75rem;
+}
+
+/* Custom content */
+.intro-code-block {
+ background-color: var(--sd-brand-black);
+ color: var(--sd-brand-white);
+ font-size: 0.875rem;
+ padding: 1em;
+ overflow-x: auto;
+}
+@media (prefers-color-scheme: dark) {
+ .intro-code-block {
+ background-color: var(--sd-highlight-bg);
+ }
+}
+
+/* Singletons */
+.page-logo {
+ display: block;
+ padding: 5rem 0 3rem;
+ color: var(--sd-logo-color);
+}
+.page-logo > svg {
+ display: block;
+ width: 12.625em;
+ height: auto;
+ margin: 0 auto;
+}
+
+.brand-white {
+ background-color: var(--sd-brand-white);
+}
+
+.brand-green {
+ background-color: var(--sd-brand-green);
+}
+
+.brand-black {
+ background-color: var(--sd-brand-black);
+ color: var(--sd-brand-white);
+}
+
+.color-green {
+ color: var(--sd-brand-green);
+}
+
+.color-blue {
+ color: var(--sd-blue);
+}
+
+.page-link::after {
+ content: " ➜";
+}
+
+
+/* Footer */
+footer {
+ text-align: center;
+ padding: 3em 0 3em;
+ font-size: 1em;
+ margin-top: 4rem;
+}
+
+/* Make tables vertically aligned to the top */
+tbody td {
+ vertical-align: top;
+}
+
+/* Rouge Code Highlight, github style */
+/* Generated with: rougify style github | sed '/background-color: #f8f8f8/d' */
+.highlight table td { padding: 5px; }
+.highlight table pre { margin: 0; }
+
+@media (prefers-color-scheme: light) {
+ .highlight .cm {
+ color: #999988;
+ font-style: italic;
+ }
+ .highlight .cp {
+ color: #999999;
+ font-weight: bold;
+ }
+ .highlight .c1 {
+ color: #999988;
+ font-style: italic;
+ }
+ .highlight .cs {
+ color: #999999;
+ font-weight: bold;
+ font-style: italic;
+ }
+ .highlight .c, .highlight .ch, .highlight .cd, .highlight .cpf {
+ color: #999988;
+ font-style: italic;
+ }
+ .highlight .err {
+ color: #a61717;
+ background-color: #e3d2d2;
+ }
+ .highlight .gd {
+ color: #000000;
+ background-color: #ffdddd;
+ }
+ .highlight .ge {
+ color: #000000;
+ font-style: italic;
+ }
+ .highlight .gr {
+ color: #aa0000;
+ }
+ .highlight .gh {
+ color: #999999;
+ }
+ .highlight .gi {
+ color: #000000;
+ background-color: #ddffdd;
+ }
+ .highlight .go {
+ color: #888888;
+ }
+ .highlight .gp {
+ color: #555555;
+ }
+ .highlight .gs {
+ font-weight: bold;
+ }
+ .highlight .gu {
+ color: #aaaaaa;
+ }
+ .highlight .gt {
+ color: #aa0000;
+ }
+ .highlight .kc {
+ color: #000000;
+ font-weight: bold;
+ }
+ .highlight .kd {
+ color: #000000;
+ font-weight: bold;
+ }
+ .highlight .kn {
+ color: #000000;
+ font-weight: bold;
+ }
+ .highlight .kp {
+ color: #000000;
+ font-weight: bold;
+ }
+ .highlight .kr {
+ color: #000000;
+ font-weight: bold;
+ }
+ .highlight .kt {
+ color: #445588;
+ font-weight: bold;
+ }
+ .highlight .k, .highlight .kv {
+ color: #000000;
+ font-weight: bold;
+ }
+ .highlight .mf {
+ color: #009999;
+ }
+ .highlight .mh {
+ color: #009999;
+ }
+ .highlight .il {
+ color: #009999;
+ }
+ .highlight .mi {
+ color: #009999;
+ }
+ .highlight .mo {
+ color: #009999;
+ }
+ .highlight .m, .highlight .mb, .highlight .mx {
+ color: #009999;
+ }
+ .highlight .sa {
+ color: #000000;
+ font-weight: bold;
+ }
+ .highlight .sb {
+ color: #d14;
+ }
+ .highlight .sc {
+ color: #d14;
+ }
+ .highlight .sd {
+ color: #d14;
+ }
+ .highlight .s2 {
+ color: #d14;
+ }
+ .highlight .se {
+ color: #d14;
+ }
+ .highlight .sh {
+ color: #d14;
+ }
+ .highlight .si {
+ color: #d14;
+ }
+ .highlight .sx {
+ color: #d14;
+ }
+ .highlight .sr {
+ color: #009926;
+ }
+ .highlight .s1 {
+ color: #d14;
+ }
+ .highlight .ss {
+ color: #990073;
+ }
+ .highlight .s, .highlight .dl {
+ color: #d14;
+ }
+ .highlight .na {
+ color: #008080;
+ }
+ .highlight .bp {
+ color: #999999;
+ }
+ .highlight .nb {
+ color: #0086B3;
+ }
+ .highlight .nc {
+ color: #445588;
+ font-weight: bold;
+ }
+ .highlight .no {
+ color: #008080;
+ }
+ .highlight .nd {
+ color: #3c5d5d;
+ font-weight: bold;
+ }
+ .highlight .ni {
+ color: #800080;
+ }
+ .highlight .ne {
+ color: #990000;
+ font-weight: bold;
+ }
+ .highlight .nf, .highlight .fm {
+ color: #990000;
+ font-weight: bold;
+ }
+ .highlight .nl {
+ color: #990000;
+ font-weight: bold;
+ }
+ .highlight .nn {
+ color: #555555;
+ }
+ .highlight .nt {
+ color: #000080;
+ }
+ .highlight .vc {
+ color: #008080;
+ }
+ .highlight .vg {
+ color: #008080;
+ }
+ .highlight .vi {
+ color: #008080;
+ }
+ .highlight .nv, .highlight .vm {
+ color: #008080;
+ }
+ .highlight .ow {
+ color: #000000;
+ font-weight: bold;
+ }
+ .highlight .o {
+ color: #000000;
+ font-weight: bold;
+ }
+ .highlight .w {
+ color: #bbbbbb;
+ }
+}
+
+@media (prefers-color-scheme: dark) {
+ /* rouge "base16.dark" code highlight */
+ /* generated with: rougify style base16.dark | sed '/background-color: #151515/d' */
+ .highlight, .highlight .w {
+ color: #d0d0d0;
+ }
+ .highlight .err {
+ color: #151515;
+ background-color: #ac4142;
+ }
+ .highlight .c, .highlight .ch, .highlight .cd, .highlight .cm, .highlight .cpf, .highlight .c1, .highlight .cs {
+ color: #505050;
+ }
+ .highlight .cp {
+ color: #f4bf75;
+ }
+ .highlight .nt {
+ color: #f4bf75;
+ }
+ .highlight .o, .highlight .ow {
+ color: #d0d0d0;
+ }
+ .highlight .p, .highlight .pi {
+ color: #d0d0d0;
+ }
+ .highlight .gi {
+ color: #90a959;
+ }
+ .highlight .gd {
+ color: #ac4142;
+ }
+ .highlight .gh {
+ color: #6a9fb5;
+ font-weight: bold;
+ }
+ .highlight .k, .highlight .kn, .highlight .kp, .highlight .kr, .highlight .kv {
+ color: #aa759f;
+ }
+ .highlight .kc {
+ color: #d28445;
+ }
+ .highlight .kt {
+ color: #d28445;
+ }
+ .highlight .kd {
+ color: #d28445;
+ }
+ .highlight .s, .highlight .sb, .highlight .sc, .highlight .dl, .highlight .sd, .highlight .s2, .highlight .sh, .highlight .sx, .highlight .s1 {
+ color: #90a959;
+ }
+ .highlight .sa {
+ color: #aa759f;
+ }
+ .highlight .sr {
+ color: #75b5aa;
+ }
+ .highlight .si {
+ color: #8f5536;
+ }
+ .highlight .se {
+ color: #8f5536;
+ }
+ .highlight .nn {
+ color: #f4bf75;
+ }
+ .highlight .nc {
+ color: #f4bf75;
+ }
+ .highlight .no {
+ color: #f4bf75;
+ }
+ .highlight .na {
+ color: #6a9fb5;
+ }
+ .highlight .m, .highlight .mb, .highlight .mf, .highlight .mh, .highlight .mi, .highlight .il, .highlight .mo, .highlight .mx {
+ color: #90a959;
+ }
+ .highlight .ss {
+ color: #90a959;
+ }
+}
+
+/* Code Blocks */
+.highlighter-rouge {
+ padding: 2px 1rem;
+ border-radius: 5px;
+ color: var(--sd-foreground-color);
+ background-color: var(--sd-highlight-bg);
+
+ overflow: auto;
+}
+.highlighter-rouge .highlight .err {
+ background: transparent !important;
+ color: inherit !important;
+}
+
+/* Inline Code */
+code.highlighter-rouge {
+ padding: 2px 6px;
+ background-color: var(--sd-highlight-inline-bg);
+}
+
+a code.highlighter-rouge {
+ color: inherit;
+}
generated by cgit v1.2.3 (git 2.39.1) at 2024-11-05 18:59:33 +0000