summaryrefslogtreecommitdiffstats
path: root/assets/css
diff options
context:
space:
mode:
authorVolpeon <git@volpeon.ink>2021-04-29 20:31:16 +0200
committerVolpeon <git@volpeon.ink>2021-04-29 20:31:16 +0200
commitf561409f1cf476e2cc1112538eb7b724748a2378 (patch)
tree814e7e97fdbcc51c3368957078c5a4be022e08a1 /assets/css
parentFix text contrast on cards (diff)
downloadvolpeon.ink-f561409f1cf476e2cc1112538eb7b724748a2378.tar.gz
volpeon.ink-f561409f1cf476e2cc1112538eb7b724748a2378.tar.bz2
volpeon.ink-f561409f1cf476e2cc1112538eb7b724748a2378.zip
Update
Diffstat (limited to 'assets/css')
-rw-r--r--assets/css/objects/_button.scss23
-rw-r--r--assets/css/scopes/_body.scss29
-rw-r--r--assets/css/style.scss1
3 files changed, 25 insertions, 28 deletions
diff --git a/assets/css/objects/_button.scss b/assets/css/objects/_button.scss
deleted file mode 100644
index d97ca2d..0000000
--- a/assets/css/objects/_button.scss
+++ /dev/null
@@ -1,23 +0,0 @@
1@include namespace('button') {
2 @include store((
3 --dims: (
4 --pad-x: 1.4em,
5 --pad-y: .5em
6 ),
7 --colors: (
8 --bg: prop(--colors --fg-lo, $global: true),
9 --fg: prop(--colors --bg, $global: true),
10 )
11 ));
12
13 @include object(namespace()) {
14 display: inline-block;
15 padding: prop(--dims --pad-y) prop(--dims --pad-x);
16 border-radius: 10em;
17 background-color: prop(--colors --bg);
18 color: prop(--colors --fg);
19 font-size: 1 / 16 * 14em;
20 font-weight: 500;
21 text-decoration: none;
22 }
23}
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 }
diff --git a/assets/css/style.scss b/assets/css/style.scss
index 958710c..aa83f85 100644
--- a/assets/css/style.scss
+++ b/assets/css/style.scss
@@ -16,7 +16,6 @@
16@import 'layouts/project-grid'; 16@import 'layouts/project-grid';
17 17
18@import 'objects/icon'; 18@import 'objects/icon';
19@import 'objects/button';
20 19
21@import 'components/outer-button'; 20@import 'components/outer-button';
22@import 'components/header'; 21@import 'components/header';