summaryrefslogtreecommitdiffstats
path: root/src/objects/_thumbnail.vars.scss
diff options
context:
space:
mode:
Diffstat (limited to 'src/objects/_thumbnail.vars.scss')
-rw-r--r--src/objects/_thumbnail.vars.scss100
1 files changed, 33 insertions, 67 deletions
diff --git a/src/objects/_thumbnail.vars.scss b/src/objects/_thumbnail.vars.scss
index 737a626..a5625fc 100644
--- a/src/objects/_thumbnail.vars.scss
+++ b/src/objects/_thumbnail.vars.scss
@@ -1,85 +1,51 @@
1@use "sass:map"; 1@use 'sass:map';
2@use "sass:string"; 2@use 'sass:string';
3@use "pkg:iro-sass/props"; 3@use 'pkg:iro-sass/src/props';
4@use "../core.vars" as core; 4@use '../core.vars' as core;
5 5
6$size: props.def(--o-thumbnail--size, props.get(core.$size--900)) !default; 6$size: props.def(--o-thumbnail--size, props.get(core.$size--900)) !default;
7$rounding: props.def(--o-thumbnail--rounding, props.get(core.$rounding--sm)) !default; 7$rounding: props.def(--o-thumbnail--rounding, props.get(core.$rounding--sm)) !default;
8$spacing: props.def(--o-thumbnail--spacing, props.get(core.$size--100)) !default; 8$spacing: props.def(--o-thumbnail--spacing, props.get(core.$size--100)) !default;
9$border-width: props.def(--o-thumbnail--border-width, props.get(core.$border-width--thin)) !default; 9$border-width: props.def(--o-thumbnail--border-width, props.get(core.$border-width--thin)) !default;
10 10
11$selected--border-width: props.def( 11$selected--border-width: props.def(--o-thumbnail--selected--border-width, props.get(core.$border-width--medium)) !default;
12 --o-thumbnail--selected--border-width,
13 props.get(core.$border-width--medium)
14) !default;
15 12
16$key-focus--border-width: props.def( 13$key-focus--border-width: props.def(--o-thumbnail--key-focus--border-width, props.get(core.$key-focus--border-width)) !default;
17 --o-thumbnail--key-focus--border-width, 14$key-focus--border-offset: props.def(--o-thumbnail--key-focus--border-offset, props.get(core.$key-focus--border-offset)) !default;
18 props.get(core.$key-focus--border-width) 15$key-focus--outline-width: props.def(--o-thumbnail--key-focus--outline-width, props.get(core.$key-focus--outline-width)) !default;
19) !default;
20$key-focus--border-offset: props.def(
21 --o-thumbnail--key-focus--border-offset,
22 props.get(core.$key-focus--border-offset)
23) !default;
24$key-focus--outline-width: props.def(
25 --o-thumbnail--key-focus--outline-width,
26 props.get(core.$key-focus--outline-width)
27) !default;
28 16
29$border-color: props.def( 17$border-color: props.def(--o-thumbnail--border-color, props.get(core.$theme, --border-strong), 'color') !default;
30 --o-thumbnail--border-color,
31 props.get(core.$theme, --border-strong),
32 "color"
33) !default;
34 18
35$hover--border-color: props.def( 19$hover--border-color: props.def(--o-thumbnail--hover--border-color, props.get(core.$theme, --text-mute-more), 'color') !default;
36 --o-thumbnail--hover--border-color,
37 props.get(core.$theme, --text-mute-more),
38 "color"
39) !default;
40 20
41$selected--border-color: props.def( 21$selected--border-color: props.def(--o-thumbnail--selected--border-color, props.get(core.$theme, --heading), 'color') !default;
42 --o-thumbnail--selected--border-color,
43 props.get(core.$theme, --heading),
44 "color"
45) !default;
46 22
47$key-focus--border-color: props.def( 23$key-focus--border-color: props.def(--o-thumbnail--key-focus--border-color, props.get(core.$theme, --focus, --border), 'color') !default;
48 --o-thumbnail--key-focus--border-color, 24$key-focus--outline-color: props.def(--o-thumbnail--key-focus--outline-color, props.get(core.$theme, --focus, --outline), 'color') !default;
49 props.get(core.$theme, --focus, --border),
50 "color"
51) !default;
52$key-focus--outline-color: props.def(
53 --o-thumbnail--key-focus--outline-color,
54 props.get(core.$theme, --focus, --outline),
55 "color"
56) !default;
57 25
58$size--md: props.def(--o-thumbnail--size, props.get(core.$size--600), "md") !default; 26$size--md: props.def(--o-thumbnail--size, props.get(core.$size--600), 'md') !default;
59 27
60$static-themes: props.def(--o-thumbnail, (), "color"); 28$static-themes: props.def(--o-thumbnail, (), 'color');
61 29
62@each $theme in map.keys(props.get(core.$transparent-colors)) { 30@each $theme in map.keys(props.get(core.$transparent-colors)) {
63 $thumbnail-theme: --static-#{string.slice($theme, 3)}; 31 $thumbnail-theme: --static-#{string.slice($theme, 3)};
64 32
65 $static-themes: props.merge( 33 $static-themes: props.merge($static-themes, (
66 $static-themes, 34 $thumbnail-theme: (
67 ( 35 --border: props.get(core.$transparent-colors, $theme, --400),
68 $thumbnail-theme: (
69 --border: props.get(core.$transparent-colors, $theme, --400),
70 --hover: (
71 --border: props.get(core.$transparent-colors, $theme, --500),
72 ),
73 36
74 --selected: ( 37 --hover: (
75 --border: props.get(core.$transparent-colors, $theme, --900), 38 --border: props.get(core.$transparent-colors, $theme, --500),
76 ), 39 ),
77 40
78 --key-focus: ( 41 --selected: (
79 --border: props.get(core.$transparent-colors, $theme, --900), 42 --border: props.get(core.$transparent-colors, $theme, --900),
80 --outline: props.get(core.$transparent-colors, $theme, --300), 43 ),
81 ), 44
82 ), 45 --key-focus: (
46 --border: props.get(core.$transparent-colors, $theme, --900),
47 --outline: props.get(core.$transparent-colors, $theme, --300),
48 ),
83 ) 49 )
84 ); 50 ));
85} 51}
generated by cgit v1.3.1 (git 2.54.0) at 2026-07-22 18:38:40 +0000