diff options
| author | Anhgelus Morhtuuzh <william@herges.fr> | 2026-02-04 15:14:25 +0100 |
|---|---|---|
| committer | Anhgelus Morhtuuzh <william@herges.fr> | 2026-02-04 15:14:25 +0100 |
| commit | 2cab73140e45e1788af7810ddecbb251548d3fe6 (patch) | |
| tree | 8bdf75208ac394fb3cd9b3b797ca2f8bead0551a /design/styles.css | |
| parent | 6e809c4e71f8aba442adb058695a60555803ea60 (diff) | |
refactor(design): delete folder
Diffstat (limited to 'design/styles.css')
| -rw-r--r-- | design/styles.css | 258 |
1 files changed, 0 insertions, 258 deletions
diff --git a/design/styles.css b/design/styles.css deleted file mode 100644 index 398605a..0000000 --- a/design/styles.css +++ /dev/null @@ -1,258 +0,0 @@ -:root { - --color-dark: hsl(202, 25%, 9%); - --color-light: #eff7f6; - --color-gray: #bcb3bb; /* quote and legend */ - --color-rose: #f2b5d4; /* link accent */ - --color-light-rose: hsl(330, 55%, 70%, 0.2); /* link accent hover and highlight */ - - --font-size-tiny: 0.85rem; /* quote, legend, code */ - - --width-content: 700px; /* main, article */ - --width-deco: 900px; /* header, footer, large image */ - --height-header: 8rem; /* header, footer, introduction */ - - --margin-base: 1.5rem; - --margin-header: calc(var(--height-header) / 2); - - font-size: 20px; -} - -body { - font-family: Raveo, Inter, sans-serif; - - background: var(--color-dark); - color: var(--color-light); - - padding: 2rem; -} - -body * { - line-height: 1.4em; -} - -main, -article { - max-width: var(--width-content); - margin: 0 auto; -} - -h1, -h2, -h3 { - font-weight: 500; - - margin-bottom: 0.5rem; -} - -h1 { - font-size: 2rem; - font-weight: 600; -} - -h2 { - font-size: 1.66rem; - - margin-top: calc(var(--margin-base) + 1rem); -} - -h3 { - font-size: 1.33rem; - - margin-top: calc(var(--margin-base) + 0.5rem); -} - -p { - margin-bottom: var(--margin-base); -} - -a { - color: var(--color-rose); - text-decoration: underline; - - &:hover { - background: var(--color-light-rose); - } -} - -em, -cite { - font-style: italic; -} - -b { - background: var(--color-light-rose); - /* color: var(--color-dark); */ - font-weight: 500; - - padding: 0.05em 0.1em; -} - -ul, -ol { - margin-top: -0.5rem; - margin-bottom: var(--margin-base - 0.5rem); - margin-left: 1rem; - - list-style-position: outside; -} - -ul { - list-style-type: disc; -} - -ol { - list-style-type: roman; -} - -li { - margin-bottom: 0.25rem; -} - -.quote { - font-size: var(--font-size-tiny); -} - -blockquote { - padding: 0.5rem 2rem; - margin-bottom: 0.25rem; - - color: var(--color-gray); - - border-left: var(--color-rose) solid 0.25em; -} - -figure { - display: flex; - flex-direction: column; - justify-content: center; - gap: 0.5rem; - - text-align: center; - - margin-bottom: var(--margin-base); - - & a, - img { - max-height: max(60vh, 400px); - max-width: 100%; - display: block; - - &.large { - --max-width: var(--width-deco); - --width: min(calc(100vw - 4rem), var(--max-width)); - margin-left: max(-15%, calc((100% - var(--width)) / 2)); - width: var(--max-width); - max-width: var(--width); - max-height: none; - } - } -} - -figcaption { - font-size: var(--font-size-tiny); - - color: var(--color-gray); -} - -code, -pre { - background: rgba(0, 0, 0, 0.4); -} - -code { - padding: 0.05em 0.1em; - - font-family: monospace; - font-size: var(--font-size-tiny); - - color: var(--color-gray); - border: var(--color-light) 1px solid; -} - -pre { - border: var(--color-light) 2px solid; - - margin: 0 -1rem var(--margin-base) -1rem; - padding: 0.5rem 1rem; - - & code { - padding: 0; - - background: none; - border: none; - } -} - -header { - max-width: var(--width-deco); - height: var(--height-header); - - margin: 0 auto var(--margin-header) auto; - padding-bottom: 2rem; - - display: flex; - flex-direction: row; - gap: 2rem; - - border-bottom: var(--color-light) 2px solid; - - @media only screen and (max-width: 600px) { - flex-direction: column; - height: auto; - min-height: var(--height-header); - & img { - width: max(33%, 128px); - margin: 0 auto; - } - } - - & nav { - display: flex; - flex-direction: column; - flex-wrap: wrap; - gap: 0.5rem; - - & a { - display: block; - - min-width: 8rem; - - font-family: monospace; - } - } -} - -footer { - max-width: var(--width-deco); - height: var(--height-header); - - margin: var(--margin-header) auto 0 auto; - padding-top: 2rem; - - border-top: var(--color-light) 2px solid; - - font-size: var(--font-size-tiny); -} - -.introduction { - margin: var(--margin-header) 0; -} - -article article { - margin-bottom: var(--margin-header); - &:last-child { - margin-bottom: 0; - } -} - -.pagination { - display: flex; - flex-direction: row; - justify-content: center; - align-items: center; - gap: var(--margin-base); - - & p { - margin-bottom: 0; - } -} |
