summaryrefslogtreecommitdiffstats
path: root/assets/css/components
diff options
context:
space:
mode:
authorVolpeon <git@volpeon.ink>2021-11-14 16:49:28 +0100
committerVolpeon <git@volpeon.ink>2021-11-14 16:49:28 +0100
commit23deadd4773d2f36bfb1da2c5ceac0fac695c52a (patch)
tree49d6729e873b2f711df80229c6f050b7ebff6bef /assets/css/components
parentImproved semantic structure (diff)
downloadvolpeon.ink-23deadd4773d2f36bfb1da2c5ceac0fac695c52a.tar.gz
volpeon.ink-23deadd4773d2f36bfb1da2c5ceac0fac695c52a.tar.bz2
volpeon.ink-23deadd4773d2f36bfb1da2c5ceac0fac695c52a.zip
Fix small viewports
Diffstat (limited to 'assets/css/components')
-rw-r--r--assets/css/components/_header.scss14
1 files changed, 7 insertions, 7 deletions
diff --git a/assets/css/components/_header.scss b/assets/css/components/_header.scss
index a59c039..c1095b3 100644
--- a/assets/css/components/_header.scss
+++ b/assets/css/components/_header.scss
@@ -14,7 +14,7 @@
14 --dims: ( 14 --dims: (
15 --height: 4rem, 15 --height: 4rem,
16 --icon: 1.5rem, 16 --icon: 1.5rem,
17 --pad-x: calc(0.5 * (var(--header--dims--height) - var(--header--dims--icon))), 17 --pad-x: calc(.5 * (var(--header--dims--height) - var(--header--dims--icon))),
18 ) 18 )
19 )); 19 ));
20 20
@@ -31,11 +31,11 @@
31 31
32 @include element('item') { 32 @include element('item') {
33 padding: 0 prop(--dims --pad-x); 33 padding: 0 prop(--dims --pad-x);
34 line-height: prop(--dims --height); 34 transition: background-color .2s, color .2s, border-left-color .2s;
35 color: prop(--colors --fg);
36 background-color: prop(--colors --bg); 35 background-color: prop(--colors --bg);
36 color: prop(--colors --fg);
37 line-height: prop(--dims --height);
37 text-decoration: none; 38 text-decoration: none;
38 transition: background-color .2s, color .2s, border-left-color .2s;
39 39
40 @include next-twin-element { 40 @include next-twin-element {
41 margin-left: 2px; 41 margin-left: 2px;
@@ -43,9 +43,9 @@
43 43
44 &:hover, 44 &:hover,
45 &:focus { 45 &:focus {
46 color: prop(--colors --hover --fg);
47 background-color: prop(--colors --hover --bg);
48 border-left-color: prop(--colors --hover --bg); 46 border-left-color: prop(--colors --hover --bg);
47 background-color: prop(--colors --hover --bg);
48 color: prop(--colors --hover --fg);
49 } 49 }
50 50
51 @include modifier('icon') { 51 @include modifier('icon') {
@@ -55,8 +55,8 @@
55 } 55 }
56 56
57 @include modifier('active') { 57 @include modifier('active') {
58 font-weight: bold;
59 color: prop(--colors --active --fg); 58 color: prop(--colors --active --fg);
59 font-weight: bold;
60 } 60 }
61 } 61 }
62 62