diff options
Diffstat (limited to 'assets/css')
-rw-r--r-- | assets/css/_basics.scss | 15 | ||||
-rw-r--r-- | assets/css/_vars.scss | 4 | ||||
-rw-r--r-- | assets/css/components/_post-list.scss | 6 | ||||
-rw-r--r-- | assets/css/scopes/_headlines.scss | 11 |
4 files changed, 20 insertions, 16 deletions
diff --git a/assets/css/_basics.scss b/assets/css/_basics.scss index 573167c..c3c62db 100644 --- a/assets/css/_basics.scss +++ b/assets/css/_basics.scss | |||
@@ -8,7 +8,7 @@ img::selection { | |||
8 | } | 8 | } |
9 | 9 | ||
10 | :focus { | 10 | :focus { |
11 | outline: 3px solid prop(--colors --focus-ring); | 11 | outline: 2px solid prop(--colors --focus-ring); |
12 | outline-offset: 3px; | 12 | outline-offset: 3px; |
13 | } | 13 | } |
14 | 14 | ||
@@ -45,7 +45,8 @@ code { | |||
45 | } | 45 | } |
46 | 46 | ||
47 | code { | 47 | code { |
48 | color: var(--code--fg); | 48 | color: var(--code--fg); |
49 | font-size: 1 / 16 * 15em; | ||
49 | } | 50 | } |
50 | 51 | ||
51 | pre { | 52 | pre { |
@@ -138,10 +139,12 @@ h3, | |||
138 | h4, | 139 | h4, |
139 | h5, | 140 | h5, |
140 | h6 { | 141 | h6 { |
141 | margin: ($line-height * 2rem) 0 0; | 142 | margin: ($line-height * 2rem) 0 0; |
142 | color: var(--heading--fg); | 143 | color: var(--heading--fg); |
143 | font-size: 1em; | 144 | font-size: 1 / 16 * 14em; |
144 | font-weight: 700; | 145 | font-weight: 700; |
146 | letter-spacing: 1px; | ||
147 | text-transform: uppercase; | ||
145 | 148 | ||
146 | & + & { | 149 | & + & { |
147 | margin-top: $line-height * 1rem; | 150 | margin-top: $line-height * 1rem; |
diff --git a/assets/css/_vars.scss b/assets/css/_vars.scss index ab3d9e5..38b4b24 100644 --- a/assets/css/_vars.scss +++ b/assets/css/_vars.scss | |||
@@ -68,8 +68,8 @@ $gray7: hsl(220, 7%, 100%); | |||
68 | --link: ( | 68 | --link: ( |
69 | --idle: var(--colors--fg-lo), | 69 | --idle: var(--colors--fg-lo), |
70 | --colored: ( | 70 | --colored: ( |
71 | --idle: hsl(210, 90%, 72%), //hsl(var(--colors--accent--h), 100%, 66%), // | 71 | --idle: hsl(var(--colors--accent--h), 100%, 66%), //hsl(210, 90%, 72%), // |
72 | --visited: hsl(270, 60%, 75%), //hsl(var(--colors--accent--h), 50%, 66%), // | 72 | --visited: hsl(var(--colors--accent--h), 50%, 66%), //hsl(270, 60%, 75%), // |
73 | ) | 73 | ) |
74 | ), | 74 | ), |
75 | ) | 75 | ) |
diff --git a/assets/css/components/_post-list.scss b/assets/css/components/_post-list.scss index 9d4c956..bc41849 100644 --- a/assets/css/components/_post-list.scss +++ b/assets/css/components/_post-list.scss | |||
@@ -16,10 +16,7 @@ | |||
16 | 16 | ||
17 | @include component(namespace()) { | 17 | @include component(namespace()) { |
18 | @include element('category-header') { | 18 | @include element('category-header') { |
19 | color: prop(--colors --cat --fg); | 19 | color: prop(--colors --cat --fg); |
20 | font-size: 1 / 16 * 14em; | ||
21 | letter-spacing: 1px; | ||
22 | text-transform: uppercase; | ||
23 | 20 | ||
24 | @include next-element('post') { | 21 | @include next-element('post') { |
25 | margin-top: $line-height * .5rem; | 22 | margin-top: $line-height * .5rem; |
@@ -47,7 +44,6 @@ | |||
47 | 44 | ||
48 | @include element('post-title') { | 45 | @include element('post-title') { |
49 | color: prop(--colors --post --idle-fg); | 46 | color: prop(--colors --post --idle-fg); |
50 | font-size: 1 / 16 * 17em; | ||
51 | font-weight: normal; | 47 | font-weight: normal; |
52 | } | 48 | } |
53 | 49 | ||
diff --git a/assets/css/scopes/_headlines.scss b/assets/css/scopes/_headlines.scss index 367e093..dcd8024 100644 --- a/assets/css/scopes/_headlines.scss +++ b/assets/css/scopes/_headlines.scss | |||
@@ -16,7 +16,9 @@ | |||
16 | h6 { | 16 | h6 { |
17 | font-family: $font-fam--large; | 17 | font-family: $font-fam--large; |
18 | font-weight: 600; | 18 | font-weight: 600; |
19 | letter-spacing: normal; | ||
19 | line-height: 1.4; | 20 | line-height: 1.4; |
21 | text-transform: none; | ||
20 | font-feature-settings: 'ss02' 1; | 22 | font-feature-settings: 'ss02' 1; |
21 | } | 23 | } |
22 | 24 | ||
@@ -37,16 +39,19 @@ | |||
37 | 39 | ||
38 | h3 { | 40 | h3 { |
39 | @include iro-responsive-modular-scale(font-size, 1, $responsive-mod-scale); | 41 | @include iro-responsive-modular-scale(font-size, 1, $responsive-mod-scale); |
40 | |||
41 | text-transform: uppercase; | ||
42 | } | 42 | } |
43 | 43 | ||
44 | h4, | 44 | h4, |
45 | h5, | 45 | h5, |
46 | h6 { | 46 | h6 { |
47 | @include iro-responsive-modular-scale(font-size, 0, $responsive-mod-scale); | 47 | @include iro-responsive-modular-scale(font-size, 0, $responsive-mod-scale); |
48 | } | ||
48 | 49 | ||
49 | letter-spacing: .5px; | 50 | h3, |
51 | h4, | ||
52 | h5, | ||
53 | h6 { | ||
54 | letter-spacing: 1px; | ||
50 | text-transform: uppercase; | 55 | text-transform: uppercase; |
51 | } | 56 | } |
52 | 57 | ||