diff options
1 files changed, 0 insertions, 542 deletions
| -rw-r--r-- | src/styles.css | 542 |
diff --git a/src/styles.css b/src/styles.css deleted file mode 100644 index 9dc726b..0000000 --- a/src/styles.css +++ /dev/null @@ -1,542 +0,0 @@ -/* - * Format follows the following specs: - * - short rules (length includes all selectors; short means roughtly < 62 chars) are put on one line - * - otherwise in the format - * - * rules { - * thing: value; - * thing: value; - * ... - * } - * - * - below the ending curly brace, on the same identation, there are related stylings - * these include all stylings directly changing that rule and classes that are directly related - * each of these are, as mentioned, indents the same level as that closing brace - * each follows the same rules from above (and can have further more indented related stylings) - * all rules are ordered in this format (where ? is any combinator, and something is just a name) - * - * rule { - * ... - * } - * something ? rule { ... } - * rule ? something { ... } - * rule::something { ... } - * #something { ... } - * .something { ... } - * - * - when a related rule has the big rule and other classes, its preferrable that they're in - * descending order from without class/id to id and then class. example - * - * rule { - * ... - * } - * something ? rule { ... } - * something ? rule, #something { ... } - * something ? rule, .something { ... } - * - * - as you've noticed, multiple blocks that are on one line, below each other, should have their - * opening braces aligned, but only if the distance isn't "too big" (usually > 15-20 characters is too big) - * - * rule { - * ... - * } - * something ? rule { ... } - * something-else ? rule { ... } - * something-else-1 ? rule, something-else-2 ? rule { ... } - * something-else-3 ? rule, something-else-4 ? rule { ... } - * - * - empty lines between related rules, to further separate certain related rules from others, are permittable - * in a class list, putting rules on new lines (starting with the same identation as the first) is also permittable - * - * - properties inside rules should be ordered lexicographically, and properties that start with a dash should be at the bottom - */ - -:root { - --bg-color: white; - --fg-color: black; - - --a-color: #336700; - --a-hover-color: #3ea100; - --accent-line-color: #004080; - --alternating-row-color: #eef0f2; - --bg-selection-color: #338fff; - --blockquote-color: #6a737d; - --blockquote-border-color: #dfe2e5; - --body-bg: #ebe3d2; - --border-color: black; - --code-bg-color: var(--hi-bg); - --em-color: black; - --fg-selection-color: white; - --header-color: #006b8f; - --pre-bg-color: var(--hi-bg); - --strong-color: black; - --table-border-color: black; - --tr-bg-color: white; - - /* https://github.com/morhetz/gruvbox/blob/master/autoload/gruvbox.vim */ - --hi-fg: var(--fg-color); - --hi-bg: #f5f5e2; - --hic-gray: #928374; - --hic-red: #fb4934; - --hic-green: #79740e; - --hic-blue: #076678; - --hic-yellow: #b57614; - --hic-purple: #8f3f71; - --hic-aqua: #427b58; - --hic-orange: #af3a03; - - --hi-comment: var(--hic-gray); - --hi-const: var(--hic-purple); - --hi-string: var(--hic-green); - --hi-char: var(--hic-purple); - --hi-number: var(--hic-purple); - --hi-bool: var(--hic-purple); - --hi-float: var(--hic-purple); - --hi-identifier: var(--hic-blue); - --hi-function: var(--hic-green); - --hi-statement: var(--hic-red); - --hi-conditional: var(--hic-red); - --hi-repeat: var(--hic-red); - --hi-operator: var(--hi-fg); - --hi-keyword: var(--hic-red); /* Label and Exception are keywords */ - --hi-preproc: var(--hic-aqua); - --hi-type: var(--hic-yellow); - --hi-storageclass: var(--hic-orange); - --hi-structure: var(--hic-aqua); - --hi-typedef: var(--hic-aqua); - --hi-ignore: var(--hi-fg); -} - -/* Global */ - -@font-face { - font-family: 'Tabler'; - src: url('/font/tabler-icons-subset.ttf') format('truetype'); -} - -body { - background-color: var(--body-bg); - border-color: var(--border-color); - color: var(--fg-color); - min-height: calc(100vh - 16px); - overflow-wrap: break-word; - - /* Stuff to make sure the font is rendered correctly on Safari - * https://stackoverflow.com/a/56065714/12036073 */ - font-rendering: optimizeLegibility; - font-weight: 400; - -webkit-font-kerning: normal; - -webkit-font-smoothing: antialiased; - } - nav, article { background-color: var(--bg-color); } - body, td, th { font-size: 18px; font-family: 'Tabler', sans-serif; } - * { line-height: 1.3em; } - -img { - box-sizing: border-box; - max-width: 100%; - } - img, hr { border: 1px solid var(--border-color); } - dt img, .svg { box-sizing: border-box; max-height: 1em; } - .pixelated-render { image-rendering: pixelated; } - .oldschool-badge { height: 38px; } - .flag { max-width: 1.3em; } /* Compatibility with Chrome 49.0.2623.112 (for old machines) */ - - .file-type-icon { min-width: 1.3em; vertical-align: middle; } - .borderless, .oldschool-badge, .file-type-icon { border: none; } - - .special-par { - margin-bottom: 0.25em; - position: relative; - padding: 0.5em; - padding-left: calc(32px + 1em); - } - .warn-par { border: 1px dashed #fac848; } - .important-par { border: 1px solid #f46062; } - .special-par-icon { vertical-align: middle; } - .special-par > .special-par-icon { - position: absolute; - left: 0.5em; - top: calc(50% - 16px); - } - - .btn, .h-anchor { - /* Thanks https://stackoverflow.com/a/4407335/12036073 */ - -webkit-touch-callout: none; /* iOS Safari */ - -webkit-user-select: none; /* Safari */ - -khtml-user-select: none; /* Konqueror HTML */ - -moz-user-select: none; /* Old versions of Firefox */ - -ms-user-select: none; /* Internet Explorer/Edge */ - user-select: none; - } - .btn:hover { cursor: pointer; } - .btn:active { transform: scale(0.9); } - - /* image-show.js */ - .clicked-image { - background-color: var(--bg-color); - border: none; - height: 100vh; - left: 0; - max-width: none; - max-height: none; - object-fit: contain; - padding: 1em; - position: fixed; - top: 0; - width: 100vw; - z-index: 2; - } - .body-on-clicked-image { overflow: hidden; } - - -strong { color: var(--strong-color); } -a, a strong { - border-bottom: 1px dashed; - color: var(--a-color); - text-decoration: none; - } - sup a, dt a { border: none; } - a * { color: var(--fg-color); } - a:hover, a strong:hover { color: var(--a-hover-color); } - - -i, em { color: var(--em-color); } - -.noMaxWidth { max-width: initial; } -.no-wrap { - color: inherit; - vertical-align: baseline; - white-space: nowrap; - } - -h1, h2, h3, h4, h5, h6 { - color: var(--header-color); - display: inline-block; - line-height: 1.25em; - border-bottom: 2px solid var(--border-color); - } - h1 { display: block; font-size: 1.7em; margin-block-end: 0.5em; } - h2 { margin-top: 2.5em; } - h3 { margin-top: 2em; } - h1 + *, h1 ~ h1, h2 + a + *, h3 + a + *, h4 + a + *, h5 + a + *, h6 + a + * { - margin-top: 0; - } - .h-anchor { color: var(--fg-color); border: none; } - /* Slightly smaller than browser defaults https://stackoverflow.com/a/70720104/12036073 */ - h2 + .h-anchor { font-size: 1.4em; } - h3 + .h-anchor { font-size: 1.1em; } - -/* The following CSS is a modified version of sindresorhus's github-markdown-css repo: https://github.com/sindresorhus/github-markdown-css */ -code, pre { - background-color: var(--pre-bg-color); - font-family: monospace; - font-size: 85%; -} - pre { - overflow: auto; - padding: 0.9em; - word-break: normal; - word-wrap: normal; - } - code { - margin: 0; - padding: 0 0.4em; - } - pre code { - border: 0; - display: inline-block; - font-size: 100%; - overflow: visible; - padding: 0; - word-wrap: normal; - } - pre > code { - white-space: pre-wrap; - word-break: break-all; - padding-right: 0.9em; - } - table code { - font-size: 0.7em; - white-space: normal; - } - dd code { font-size: 0.8em; } - -table { - border-spacing: 0; - border-collapse: collapse; - margin: 0.6em 0; - overflow: auto; - } - table td, table th { word-break: normal !important; } - table td:not(:first-of-type), table th:not(:first-of-type) { - border-left: 2px dashed var(--table-border-color); - } - table td, table th { padding: 0.5em; } - table th { - font-size: 1.1em; - font-weight: bold; - } - table td:empty { height: 1em; } - - table tr:not(:first-of-type) { - background-color: var(--tr-bg-color); - } - thead tr { - border-bottom: 2px dashed var(--table-border-color); - } - table tr:nth-child(2n), thead tr { - background-color: var(--alternating-row-color); - } - -blockquote { - border-left: .25em solid var(--blockquote-border-color); - color: var(--blockquote-color); - margin: 0; - margin-top: 0; - margin-bottom: 16px; - padding: 0 1em; - } - blockquote > :first-child { margin-top: 0; } - blockquote > :last-child { margin-bottom: 0; } - -dt, dd { - border: 2px solid var(--border-color); - border-bottom: none; - border-top: none; - padding: 0 0.5em; - } - dt { font-size: 1.2em; padding-top: 0.2em; } - dt * { vertical-align: middle; } - dd { - line-height: 1.5em; - margin-bottom: 1em; - margin-left: 0; - padding-bottom: 0.4em; - padding-left: 49px; - } - -/* Very old/unfinished browser compatibility */ - - /* Inside _header we use <span class="br"></span>, instead of <br>, because if your browser - * doesn't support CSS, we want most stuff to be aligned on a single line, rather than preserve - * the "vertical" layout */ -.br { display: block; } -.brt { display: block; height: 0.8em; } - /* Without CSS, certain stuff look bad or confusing, so with this I can add elements which - * add elements for helping with website usage, but which shouldn't be seen otherwise */ -.nocss-aid { display: none; } - -/* lowdown classes and related settings */ - -.footnotes { font-size: 0.9em; margin-top: 3em; } - a[rev="footnote"] { border: none; } - -/* Main elements: content-wrapper, sidebar, article, header, footer */ - -#content-wrapper { - border-right: 3px solid var(--accent-line-color); - display: flex; - flex-direction: row; - min-height: calc(100vh - 16px); - } - #sidebar { - background-color: var(--body-bg); - font-size: 1.2em; - margin-right: 8px; - max-width: 11.2em; - } - #sidebar > * { - border: 3px solid var(--accent-line-color); - box-sizing: border-box; - padding: 1rem 1rem; - width: 100%; - } - #sidebar > :not(:first-child) { margin-top: 8px; } - #sidebar a { border: none; } - - #header { - border-right: none; - font-size: 1.5em; - } - #index { - border-right: none; - border-bottom: none; - } - #settingsWrapper { - border-top: none; - border-bottom: none; - font-size: 1.2em; - line-height: 1em; - } - .setting-btn { - text-align: center; - display: inline-block; - line-height: 1em; - border: 1px solid var(--border-color); - padding: 0.4em; - } - #settingsWrapper > .setting-btn { font-size: 0.5em; } - #footer { - font-size: 0.7em; - overflow-x: hidden; - border-left: none; - border-top: none; - } - #footer > * { white-space: nowrap; } - - /* expand-navbar.js */ - #expandNavbarBtn { float: right; margin-left: 1em; } - .sidebar-hidden { min-height: auto; position: absolute; } - .sidebar-hidden > :not(#header) { display: none; } - .sidebar-hidden + .noMaxWidth { margin-top: 6em; } - - article { - border-top: 3px solid var(--accent-line-color); - box-sizing: border-box; - flex: 1; - max-width: 56em; /* Equivalent to 50em on 19px font-size */ - overflow: auto; - padding: 0 1em; - } - article { - margin-left: auto; - margin-right: auto; - } - #contents-container { float: right; margin-left: 2.5em; } - #contents-container > h2 { margin-top: -1rem; } - #pagenav { - filter: opacity(64%); - font-size: 0.8em; - margin: 0 0 3rem 2rem; - } - #pagenav > * { white-space: nowrap; } - #pagenav + h2, #pagenav + h3, #pagenav + h4 { margin-top: 0; } - /* back-to-top.js */ - #scrollBtn { - background-color: var(--bg-color); - bottom: 1rem; - border: 1px solid; - display: none; - font-size: 1.66rem; - position: fixed; - padding: 0 0.15em; - right: 1rem; - transition-duration: 0.5s; - z-index: 1; - } - -/* Main elements helpers */ - -.arrowed-list { - border-left: 2px solid var(--border-color); - display: grid; - grid-column-start: 1; - grid-column-end: 1; - margin: 0 0 0.5em 0.3em; - padding-left: 0.5em; - row-gap: 0; - } - .arrowed-list > *, .arrowed-list > *:hover { - line-height: 1.2em; - display: block; /* Compatibility with Chrome 49.0.2623.112 (for old machines) */ - } - -/* Special styling */ - -#about-image { - float: right; - margin-right: 1em; - margin-top: 2em; - max-width: 7.6em; - } - -/* Small screen support */ - -@media screen and ((max-width: 610px) or (max-height: 610px)) { - article { - border-top: none; - max-width: calc(100vw - 16px - 3px); - } - table td, table th { word-break: break-all; } - - #about-image { max-width: 4.38em; } - - #content-wrapper { flex-direction: column; } - #sidebar { - max-width: initial; - margin: 0; - } - #sidebar > * { border-right: none; } - .sidebar-hidden { position: initial; } - .sidebar-hidden > :not(#header) { display: none; } - .sidebar-hidden + .noMaxWidth { margin-top: 0; } - /* page-width.js */ - #changeWidthBtn { display: none; } -} - -/* Printing support */ - -@media print { - h2 + a img, h3 + a img, h4 + a img, h5 + a img, h6 + a img, - nav, #scrollBtn { - display: none !important; - } - - body { margin: 0; } - body, article { - background-color: white; - border: none !important; - } - - pre, code { white-space: pre-wrap !important; } - .slide, .absolute-slide { transform: none !important; margin: 0; } -} - -/* presentation.js */ -.nodisplay { display: none; } - -/* File tables */ -.file-wrapper { margin: 0.5em 0; } - .file-wrapper > summary { list-style: none; } - .file-wrapper > summary::before { content: '\FF0B'; } - .file-wrapper[open] > summary::before { content: '\FF0D'; } - .file-wrapper > summary:hover { cursor: pointer; } - - .file-wrapper > .file-list { margin-left: 1.5em; } - .file-list { - border-collapse: collapse; - table-layout: auto; - width: auto; - } - .file-list td, .file-list tr { - border: none !important; - padding: 0.2em 0.4em !important; - } - .file-list tr > td:first-child { - padding: 0.2em 0 0.2em 0.2em !important; - } - -/* Syntax highlighting */ - -.HI-comment { color: var(--hi-comment); } -.HI-const { color: var(--hi-const); } -.HI-string { color: var(--hi-string); } -.HI-char { color: var(--hi-char); } -.HI-number { color: var(--hi-number); } -.HI-bool { color: var(--hi-bool); } -.HI-float { color: var(--hi-float); } -.HI-identifier { color: var(--hi-identifier); } -.HI-function { color: var(--hi-function); } -.HI-statement { color: var(--hi-statement); } -.HI-conditional { color: var(--hi-conditional); } -.HI-repeat { color: var(--hi-repeat); } -.HI-operator { color: var(--hi-operator); } -.HI-keyword { color: var(--hi-keyword); /* Label and Exception are keywords */ } -.HI-preproc { color: var(--hi-preproc); } -.HI-type { color: var(--hi-type); } -.HI-storageclass { color: var(--hi-storageclass); } -.HI-structure { color: var(--hi-structure); } -.HI-typedef { color: var(--hi-typedef); } -.HI-ignore { color: var(--hi-ignore); } -.HI-comment * { color: inherit; } /* If text inside a comment is matched, don't show it */ |