diff options
Diffstat (limited to 'assets/css')
-rw-r--r-- | assets/css/layouts/_card-list.scss (renamed from assets/css/components/_card-list.scss) | 19 | ||||
-rw-r--r-- | assets/css/scopes/_small.scss | 16 | ||||
-rw-r--r-- | assets/css/style.scss | 4 |
3 files changed, 20 insertions, 19 deletions
diff --git a/assets/css/components/_card-list.scss b/assets/css/layouts/_card-list.scss index aa6eef9..e6d1297 100644 --- a/assets/css/components/_card-list.scss +++ b/assets/css/layouts/_card-list.scss | |||
@@ -1,31 +1,14 @@ | |||
1 | @include namespace('card-list') { | 1 | @include namespace('card-list') { |
2 | @include store(( | 2 | @include store(( |
3 | --colors: ( | ||
4 | --title: prop(--colors --fg-lo, $global: true), | ||
5 | --text: prop(--colors --fg-hi, $global: true), | ||
6 | ), | ||
7 | --dims: ( | 3 | --dims: ( |
8 | --col-width: 17em | 4 | --col-width: 17em |
9 | ) | 5 | ) |
10 | )); | 6 | )); |
11 | 7 | ||
12 | @include component(namespace()) { | 8 | @include layout(namespace()) { |
13 | margin-top: $line-height * 2rem; | 9 | margin-top: $line-height * 2rem; |
14 | font-size: 1rem; | 10 | font-size: 1rem; |
15 | 11 | ||
16 | @include element('title') { | ||
17 | color: prop(--colors --title); | ||
18 | } | ||
19 | |||
20 | @include element('text') { | ||
21 | color: prop(--colors --text); | ||
22 | line-height: 1.4; | ||
23 | |||
24 | p { | ||
25 | margin-top: $line-height * .25rem; | ||
26 | } | ||
27 | } | ||
28 | |||
29 | @include element('cards') { | 12 | @include element('cards') { |
30 | margin-top: $line-height * .625rem; | 13 | margin-top: $line-height * .625rem; |
31 | filter: drop-shadow(#{prop(--dims --obj-shadow, $global: true)} #{prop(--colors --obj-shadow, $global: true)}); | 14 | filter: drop-shadow(#{prop(--dims --obj-shadow, $global: true)} #{prop(--colors --obj-shadow, $global: true)}); |
diff --git a/assets/css/scopes/_small.scss b/assets/css/scopes/_small.scss new file mode 100644 index 0000000..f7aa61c --- /dev/null +++ b/assets/css/scopes/_small.scss | |||
@@ -0,0 +1,16 @@ | |||
1 | @include namespace('small') { | ||
2 | @include store(( | ||
3 | --colors: ( | ||
4 | --fg: prop(--colors --fg-hi, $global: true), | ||
5 | ) | ||
6 | )); | ||
7 | |||
8 | @include scope(namespace()) { | ||
9 | color: prop(--colors --fg); | ||
10 | line-height: 1.4; | ||
11 | |||
12 | p { | ||
13 | margin-top: $line-height * .25rem; | ||
14 | } | ||
15 | } | ||
16 | } | ||
diff --git a/assets/css/style.scss b/assets/css/style.scss index 754b91e..9c57b28 100644 --- a/assets/css/style.scss +++ b/assets/css/style.scss | |||
@@ -16,11 +16,13 @@ | |||
16 | @import 'components/header'; | 16 | @import 'components/header'; |
17 | @import 'components/footer'; | 17 | @import 'components/footer'; |
18 | @import 'components/card'; | 18 | @import 'components/card'; |
19 | @import 'components/card-list'; | 19 | |
20 | @import 'layouts/card-list'; | ||
20 | 21 | ||
21 | @import 'scopes/colored-links'; | 22 | @import 'scopes/colored-links'; |
22 | @import 'scopes/invisible-links'; | 23 | @import 'scopes/invisible-links'; |
23 | @import 'scopes/headlines'; | 24 | @import 'scopes/headlines'; |
25 | @import 'scopes/small'; | ||
24 | @import 'scopes/body'; | 26 | @import 'scopes/body'; |
25 | 27 | ||
26 | @import 'utils'; | 28 | @import 'utils'; |