diff options
Diffstat (limited to '')
| -rw-r--r-- | assets/css/main.css | 146 | ||||
| -rw-r--r-- | assets/css/paper.css | 166 |
2 files changed, 312 insertions, 0 deletions
diff --git a/assets/css/main.css b/assets/css/main.css new file mode 100644 index 0000000..9d07479 --- /dev/null +++ b/assets/css/main.css @@ -0,0 +1,146 @@ +:root { + --border-radius: 4px; + --shadow: 0 2px 8px rgba(0, 0, 0, 0.05); +} + +@media (prefers-color-scheme: dark) { + :root { + --shadow: 0 2px 8px rgba(0, 0, 0, 0.2); + } +} + +nav { + margin-top: 1rem; +} + +nav ul { + padding: 0; + margin: 0; +} + +nav ul li { + list-style: none; + display: inline-block; + border: 0.1px solid var(--link-color); + border-radius: var(--border-radius); +} + +nav ul li a { + padding: 0.5rem 1rem; + text-decoration: none; + display: inline-block; + width: auto; + line-height: 1.5rem; +} + +nav ul li a:hover { + background-color: color-mix(in srgb, var(--link-color) 10%, transparent); +} + +nav ul li a.active { + background-color: color-mix(in srgb, var(--link-color) 10%, transparent); +} + +ul.taxonomy { + display: block; + padding: 0; + margin: 0.5rem 0; +} + +ul.taxonomy li { + list-style: none; + display: inline; +} + +ul.taxonomy li::after { + content: " | "; +} + +ul.taxonomy li:last-child::after { + content: ""; +} + +ul.terms { + display: block; + padding: 0; + margin: 0.5rem 0; +} + +ul.terms li { + list-style: none; + display: inline; +} + +ul.terms li::after { + content: " | "; +} + +ul.terms li:last-child::after { + content: ""; +} + +ul.pagination { + display: block; + padding: 0; + margin: 0.5rem 0; +} + +ul.pagination li { + display: inline; + list-style: none; +} + +ul.pagination li.active a { + background-color: color-mix(in srgb, var(--link-color) 10%, transparent); +} + +ul.pagination li a { + padding: 0.5rem 1rem; + border: 0.1px solid var(--link-color); + border-radius: var(--border-radius); + text-decoration: none; + line-height: 3rem; +} + +ul.pagination li a:hover { + background-color: color-mix(in srgb, var(--link-color) 10%, transparent); +} + +ul.pagination li:first-child a { + margin-left: 0; +} + +pre { + border-radius: var(--border-radius); + border: 0.1px solid var(--border); + padding: 0.5rem; +} + +article { + border-radius: var(--border-radius); + box-shadow: var(--shadow); +} + +img { + border-radius: var(--border-radius); +} + +.menu-icon { + height: 24px; + width: 24px; + border-radius: 0; + margin-bottom: -0.5rem; +} + +a.btn-primary { + display: inline-block; + padding: 0.5rem 1rem; + margin: 1rem 0; + border: 0.1px solid var(--link-color); + border-radius: var(--border-radius); + text-decoration: none; +} + +a.btn-primary:hover { + background-color: color-mix(in srgb, var(--link-color) 10%, transparent); +}
\ No newline at end of file diff --git a/assets/css/paper.css b/assets/css/paper.css new file mode 100644 index 0000000..eb6b982 --- /dev/null +++ b/assets/css/paper.css @@ -0,0 +1,166 @@ +html, +body { + padding: 0px; + margin: 0px; + border: none; +} + +*, +*::before, +*::after { + box-sizing: border-box; +} + +h1, +h2, +h3, +h4, +h5, +h6 { + margin: 0; + /* line-height: 1; */ +} + +:root { + --bg: #ffffff; + --surface: #f8f9fa; + --border: #e3e3e3; + --text: #2e2e2e; + --text-secondary: #6c757d; + --link-color: rgb(40, 117, 251); +} + +@media (prefers-color-scheme: dark) { + :root { + --bg: #1e1e1e; + --surface: #262626; + --border: #2a2a2a; + --text: #e0e0e0; + --text-secondary: #a8a8a8; + --shadow: 0 2px 8px rgba(0, 0, 0, 0.2); + --link-color: rgb(103, 158, 254); + } +} + +@media print { + + *, + *:before, + *:after, + *:first-letter, + p:first-line, + div:first-line, + blockquote:first-line, + li:first-line { + background: transparent !important; + color: #000 !important; + box-shadow: none !important; + text-shadow: none !important; + } + + :root { + --main-color: #000; + --background-color: #fff; + --main-background-color: #fff; + } + + main { + font-size: 12pt !important; + line-height: 1.4 !important; + --background-color: #fff !important; + } + + header { + display: none; + } + + footer { + display: none; + } + + article { + page-break-after: always; + border: 0 !important; + padding: 0 !important; + } + + a[href] { + color: #000; + } +} + +html { + background-color: var(--surface); + display: flex; + justify-content: center; + flex-direction: row; +} + +body { + color: var(--text); + font-family: Arial, + Helvetica, + sans-serif; + line-height: 1.5; + width: 100%; + max-width: 1200px; +} + +a { + color: var(--link-color); +} + +header, +footer { + padding: 0 2rem; +} + +main { + padding: 0 2rem; +} + +article { + background-color: var(--bg); + padding: 1.5em 2em; + margin: 1em 0; + border: 0.1px solid var(--border); +} + + + +p { + orphans: 3; + widows: 4; +} + +figure { + max-width: 800px; +} + + +img { + max-width: 100%; +} + +@media (max-width: 900px) { + main { + font-size: 15px; + line-height: 1.5; + padding: 0 2em; + } +} + +@media (max-width: 480px) { + main { + font-size: 14px; + line-height: 1.4; + padding: 0 1em; + } +} + + +pre, +code { + max-width: 100%; + overflow-x: scroll; +}
\ No newline at end of file |
