diff options
Diffstat (limited to 'assets/css/components/_card.scss')
-rw-r--r-- | assets/css/components/_card.scss | 30 |
1 files changed, 30 insertions, 0 deletions
diff --git a/assets/css/components/_card.scss b/assets/css/components/_card.scss index eeaa7c1..1a7d1bd 100644 --- a/assets/css/components/_card.scss +++ b/assets/css/components/_card.scss | |||
@@ -11,6 +11,11 @@ | |||
11 | --hover: ( | 11 | --hover: ( |
12 | --bg: prop(--colors --fg-lo, $global: true), | 12 | --bg: prop(--colors --fg-lo, $global: true), |
13 | --fg: prop(--colors --bg-hi, $global: true), | 13 | --fg: prop(--colors --bg-hi, $global: true), |
14 | ), | ||
15 | --link: ( | ||
16 | --bg: prop(--colors --obj-hi, $global: true), | ||
17 | --fg: prop(--colors --fg-lo, $global: true), | ||
18 | --fg-faint: prop(--colors --fg, $global: true), | ||
14 | ) | 19 | ) |
15 | ) | 20 | ) |
16 | )); | 21 | )); |
@@ -18,6 +23,20 @@ | |||
18 | @include store(( | 23 | @include store(( |
19 | --colors: ( | 24 | --colors: ( |
20 | --bg: prop(--colors --bg-hi, $global: true), | 25 | --bg: prop(--colors --bg-hi, $global: true), |
26 | --link: ( | ||
27 | --bg: hsl( | ||
28 | prop(--colors --secondary-accent --h, $global: true), | ||
29 | prop(--colors --secondary-accent --s, $global: true), | ||
30 | 98.8%, | ||
31 | ), | ||
32 | --fg: prop(--colors --secondary-accent --color, $global: true), | ||
33 | --fg-faint: hsla( | ||
34 | prop(--colors --secondary-accent --h, $global: true), | ||
35 | prop(--colors --secondary-accent --s, $global: true), | ||
36 | prop(--colors --secondary-accent --l, $global: true), | ||
37 | .75 | ||
38 | ), | ||
39 | ) | ||
21 | ) | 40 | ) |
22 | ), 'light'); | 41 | ), 'light'); |
23 | 42 | ||
@@ -67,6 +86,17 @@ | |||
67 | } | 86 | } |
68 | } | 87 | } |
69 | 88 | ||
89 | @include modifier('mark-visited') { | ||
90 | &:link { | ||
91 | background-color: prop(--colors --link --bg); | ||
92 | color: prop(--colors --link --fg); | ||
93 | |||
94 | small { | ||
95 | color: prop(--colors --link --fg-faint); | ||
96 | } | ||
97 | } | ||
98 | } | ||
99 | |||
70 | @include element('content') { | 100 | @include element('content') { |
71 | box-sizing: border-box; | 101 | box-sizing: border-box; |
72 | width: 100%; | 102 | width: 100%; |