summaryrefslogtreecommitdiffstats
path: root/assets/css
diff options
context:
space:
mode:
authorVolpeon <git@volpeon.ink>2021-05-16 08:48:48 +0200
committerVolpeon <git@volpeon.ink>2021-05-16 08:48:48 +0200
commit670cfcf0bbb5c1651e14a69a6500fd41e9e9efd8 (patch)
treee9de5261aac6998227503f8d5b14c91e0e6ec37b /assets/css
parentUse prefers-color-scheme media query (diff)
downloadvolpeon.ink-670cfcf0bbb5c1651e14a69a6500fd41e9e9efd8.tar.gz
volpeon.ink-670cfcf0bbb5c1651e14a69a6500fd41e9e9efd8.tar.bz2
volpeon.ink-670cfcf0bbb5c1651e14a69a6500fd41e9e9efd8.zip
Design adjustments
Diffstat (limited to 'assets/css')
-rw-r--r--assets/css/_vars.scss6
-rw-r--r--assets/css/components/_footer.scss1
-rw-r--r--assets/css/components/_post-list.scss10
-rw-r--r--assets/css/layouts/_card-grid.scss2
-rw-r--r--assets/css/layouts/_project-grid.scss5
5 files changed, 15 insertions, 9 deletions
diff --git a/assets/css/_vars.scss b/assets/css/_vars.scss
index bbe02e5..63936ab 100644
--- a/assets/css/_vars.scss
+++ b/assets/css/_vars.scss
@@ -53,8 +53,7 @@ $content--width: 42rem;
53 --fg: $gray6, // Text 53 --fg: $gray6, // Text
54 --fg-lo: $gray7, // Strong text 54 --fg-lo: $gray7, // Strong text
55 55
56 --obj-shadow: transparent, 56 --obj-shadow: transparent,
57 --obj-shadow-filter: transparent,
58 57
59 --accent: ( 58 --accent: (
60 --h: 354, 59 --h: 354,
@@ -105,8 +104,7 @@ $content--width: 42rem;
105 --fg: $gray6, // Text 104 --fg: $gray6, // Text
106 --fg-lo: $gray7, // Strong text 105 --fg-lo: $gray7, // Strong text
107 106
108 --obj-shadow: rgba(#000, .05), 107 --obj-shadow: rgba(#000, .05),
109 --obj-shadow-filter: rgba(#000, .04),
110 108
111 --accent: ( 109 --accent: (
112 --h: 354, 110 --h: 354,
diff --git a/assets/css/components/_footer.scss b/assets/css/components/_footer.scss
index 2bd1fb1..da471e7 100644
--- a/assets/css/components/_footer.scss
+++ b/assets/css/components/_footer.scss
@@ -10,6 +10,7 @@
10 position: relative; 10 position: relative;
11 min-height: prop(--dims --outer, $global: true); 11 min-height: prop(--dims --outer, $global: true);
12 margin-top: calc(2 * #{prop(--container --dims --pad-y, $global: true)}); 12 margin-top: calc(2 * #{prop(--container --dims --pad-y, $global: true)});
13 overflow: hidden;
13 color: prop(--colors --fg); 14 color: prop(--colors --fg);
14 font-family: $font-fam--mono; 15 font-family: $font-fam--mono;
15 line-height: 1.4; 16 line-height: 1.4;
diff --git a/assets/css/components/_post-list.scss b/assets/css/components/_post-list.scss
index 6ddc9b7..dc3eda6 100644
--- a/assets/css/components/_post-list.scss
+++ b/assets/css/components/_post-list.scss
@@ -17,14 +17,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 }
20 21
21 @include next-element('post') { 22 @include element('category-content') {
22 margin-top: $line-height * .5rem; 23 margin-top: $line-height * .5rem;
23 } 24 filter: drop-shadow(#{prop(--dims --obj-shadow, $global: true)} #{prop(--colors --obj-shadow, $global: true)});
24 } 25 }
25 26
26 @include element('post') { 27 @include element('post') {
27 color: prop(--colors --post --idle-fg); 28 box-shadow: none;
29 color: prop(--colors --post --idle-fg);
28 30
29 &:visited { 31 &:visited {
30 color: prop(--colors --post --visited-fg); 32 color: prop(--colors --post --visited-fg);
diff --git a/assets/css/layouts/_card-grid.scss b/assets/css/layouts/_card-grid.scss
index 235ef0b..c9d927a 100644
--- a/assets/css/layouts/_card-grid.scss
+++ b/assets/css/layouts/_card-grid.scss
@@ -9,7 +9,7 @@
9 display: grid; 9 display: grid;
10 grid-template-columns: repeat(auto-fill, minmax(#{prop(--dims --col-width)}, 1fr)); 10 grid-template-columns: repeat(auto-fill, minmax(#{prop(--dims --col-width)}, 1fr));
11 gap: .6rem; 11 gap: .6rem;
12 filter: drop-shadow(#{prop(--dims --obj-shadow, $global: true)} #{prop(--colors --obj-shadow-filter, $global: true)}); 12 filter: drop-shadow(#{prop(--dims --obj-shadow, $global: true)} #{prop(--colors --obj-shadow, $global: true)});
13 13
14 @include element('card') { 14 @include element('card') {
15 box-shadow: none; 15 box-shadow: none;
diff --git a/assets/css/layouts/_project-grid.scss b/assets/css/layouts/_project-grid.scss
index 7c67663..5ed983c 100644
--- a/assets/css/layouts/_project-grid.scss
+++ b/assets/css/layouts/_project-grid.scss
@@ -9,6 +9,11 @@
9 display: grid; 9 display: grid;
10 grid-template-columns: repeat(auto-fill, minmax(#{prop(--dims --col-width)}, 1fr)); 10 grid-template-columns: repeat(auto-fill, minmax(#{prop(--dims --col-width)}, 1fr));
11 gap: 2rem; 11 gap: 2rem;
12 filter: drop-shadow(#{prop(--dims --obj-shadow, $global: true)} #{prop(--colors --obj-shadow, $global: true)});
13
14 @include element('project') {
15 box-shadow: none;
16 }
12 17
13 @include media('<=sm') { 18 @include media('<=sm') {
14 grid-template-columns: 1fr; 19 grid-template-columns: 1fr;