diff options
| author | jamie <git@skilet.ro> | 2025-10-23 11:43:03 +0100 |
|---|---|---|
| committer | jamie <git@skilet.ro> | 2025-10-23 13:15:12 +0100 |
| commit | 3b76863b673e14bbb20d2fb81de727c72259b25e (patch) | |
| tree | 8d579704310153581c6a6029de9667906cf7de0f /assets/css/default.scss | |
| parent | 9cc4a262486332f42b228710f24dfe4dea3947e1 (diff) | |
refactor: neaten up source tree
Diffstat (limited to '')
| -rw-r--r-- | src/assets/css/default.scss (renamed from assets/css/default.scss) | 68 |
1 files changed, 35 insertions, 33 deletions
diff --git a/assets/css/default.scss b/src/assets/css/default.scss index 26d0937..8509dfb 100644 --- a/assets/css/default.scss +++ b/src/assets/css/default.scss @@ -38,7 +38,7 @@ $mobile: 980px; * { padding: 0; margin: 0; - transition: .1s ease-in-out; + transition: 0.1s ease-in-out; font-family: "Atkinson Hyperlegible Next", sans-serif; font-optical-sizing: auto; text-transform: lowercase; @@ -59,19 +59,20 @@ body { overflow-x: hidden; color: $clr-fg; background-color: black; - background: url("/assets/images/noise.png"), + background: + url("/assets/images/noise.png"), radial-gradient(circle at center, $clr-bg, transparent), - radial-gradient(circle at bottom left, #27577D, transparent), - radial-gradient(circle at top right, #952EA4 0%, transparent), - radial-gradient(circle at center right, #6949A5 0%, transparent), - radial-gradient(circle at top center, #336BA0 0%, transparent); + radial-gradient(circle at bottom left, #27577d, transparent), + radial-gradient(circle at top right, #952ea4 0%, transparent), + radial-gradient(circle at center right, #6949a5 0%, transparent), + radial-gradient(circle at top center, #336ba0 0%, transparent); background-attachment: fixed; } // LAYOUT WRAPPER // --------------------------------------------------------------------------- -body>* { +body > * { // every top-level section display: flex; flex-direction: column; @@ -80,17 +81,17 @@ body>* { max-width: $max-width; padding: 1.5rem 2.5rem; background: $clr-bg; - outline: .2rem solid $clr-bg; - outline-offset: .2rem; + outline: 0.2rem solid $clr-bg; + outline-offset: 0.2rem; } @include phone-only { body { padding: 0; - gap: .2rem; + gap: 0.2rem; } - body>* { + body > * { outline: 0; } } @@ -161,7 +162,7 @@ h4, h5, h6 { @include std-block; - padding-top: .5rem; + padding-top: 0.5rem; font-size: 1.75rem; } @@ -171,11 +172,11 @@ h6 { $hashes: ""; @for $_ from 1 through $i { - $hashes: $hashes + "#" + $hashes: $hashes + "#"; } content: "#{$hashes} "; - color: oklch(82.67% .087 #{280 + ($i - 1) * 40}); + color: oklch(82.67% 0.087 #{280 + ($i - 1) * 40}); } } @@ -185,20 +186,20 @@ h6 { ul { display: flex; flex-direction: column; - gap: .5rem; + gap: 0.5rem; list-style: none; li::before { content: "~"; - padding: 0 .25rem 0 .5rem; - color: oklch(82.67% .087 180); + padding: 0 0.25rem 0 0.5rem; + color: oklch(82.67% 0.087 180); } } // rainbow list items @for $i from 1 through 15 { - ul li:nth-child(n+#{$i})::before { - color: oklch(82.67% .087 #{100 + ($i - 1) * 80}); + ul li:nth-child(n + #{$i})::before { + color: oklch(82.67% 0.087 #{100 + ($i - 1) * 80}); } } @@ -209,12 +210,12 @@ a { color: $clr-primary; &:hover { - filter: brightness(.75); + filter: brightness(0.75); } } hr { - $c: oklch(from $clr-fg .45 c h); + $c: oklch(from $clr-fg 0.45 c h); background: $c; border-color: $c; } @@ -224,19 +225,19 @@ img { } address { - opacity: .5; + opacity: 0.5; text-align: right; margin-top: -2.1lh; - margin-bottom: .5rem; + margin-bottom: 0.5rem; } footer { gap: 0; - >* { + > * { text-align: center; font-size: 1rem; - opacity: .5; + opacity: 0.5; } } @@ -244,22 +245,23 @@ footer { // --------------------------------------------------------------------------- div.sourceCode { - padding: .2rem; + padding: 0.2rem; overflow: hidden; font-family: "Atkinson Hyperlegible Mono", monospace; background-color: black; - background: url("/images/noise.png"), + background: + url("/images/noise.png"), radial-gradient(circle at center, $clr-bg, transparent), - radial-gradient(circle at bottom left, #27577D, transparent), - radial-gradient(circle at top right, #952EA4 0%, transparent), - radial-gradient(circle at center right, #6949A5 0%, transparent), - radial-gradient(circle at top center, #336BA0 0%, transparent); + radial-gradient(circle at bottom left, #27577d, transparent), + radial-gradient(circle at top right, #952ea4 0%, transparent), + radial-gradient(circle at center right, #6949a5 0%, transparent), + radial-gradient(circle at top center, #336ba0 0%, transparent); background-attachment: scroll; outline: 0.2rem solid $clr-bg; outline-offset: 0.2rem; - >* { + > * { background: $clr-bg; background-attachment: fixed; padding: 1.2rem; @@ -271,4 +273,4 @@ div.sourceCode { text-transform: none; font-size: 1.05rem; } -}
\ No newline at end of file +} |
