diff options
Diffstat (limited to 'assets/css/scopes')
-rw-r--r-- | assets/css/scopes/_body.scss | 29 |
1 files changed, 25 insertions, 4 deletions
diff --git a/assets/css/scopes/_body.scss b/assets/css/scopes/_body.scss index faf1ef0..9598290 100644 --- a/assets/css/scopes/_body.scss +++ b/assets/css/scopes/_body.scss | |||
@@ -1,8 +1,14 @@ | |||
1 | @include namespace('body') { | 1 | @include namespace('body') { |
2 | @include store(( | 2 | @include store(( |
3 | --colors: ( | 3 | --colors: ( |
4 | --emph-fg: prop(--colors --accent --color, $global: true), | 4 | --emph: ( |
5 | --emph-bg: prop(--colors --bg-hi, $global: true) | 5 | --fg: prop(--colors --accent --color, $global: true), |
6 | --bg: prop(--colors --bg-hi, $global: true), | ||
7 | ), | ||
8 | --meta: ( | ||
9 | --fg: prop(--colors --fg-hi, $global: true), | ||
10 | --bg: prop(--colors --bg-hi, $global: true), | ||
11 | ) | ||
6 | ) | 12 | ) |
7 | )); | 13 | )); |
8 | 14 | ||
@@ -62,12 +68,27 @@ | |||
62 | background-image: linear-gradient( | 68 | background-image: linear-gradient( |
63 | to top, | 69 | to top, |
64 | transparent .15em, | 70 | transparent .15em, |
65 | #{prop(--colors --emph-bg)} .15em, | 71 | #{prop(--colors --emph --bg)} .15em, |
66 | #{prop(--colors --emph-bg)} .6em, | 72 | #{prop(--colors --emph --bg)} .6em, |
67 | transparent .6em | 73 | transparent .6em |
68 | ); | 74 | ); |
69 | } | 75 | } |
70 | 76 | ||
77 | @include element('meta') { | ||
78 | display: flex; | ||
79 | font-size: 1 / 16 * 14rem; | ||
80 | |||
81 | + h1 { | ||
82 | margin-top: $line-height * 1rem; | ||
83 | } | ||
84 | } | ||
85 | |||
86 | @include element('meta-item') { | ||
87 | padding: .3em .7em; | ||
88 | background-color: prop(--colors --meta --bg); | ||
89 | color: prop(--colors --meta --fg); | ||
90 | } | ||
91 | |||
71 | img { | 92 | img { |
72 | max-width: 100%; | 93 | max-width: 100%; |
73 | } | 94 | } |