summaryrefslogtreecommitdiffstats
path: root/src/objects/_text-field.vars.scss
diff options
context:
space:
mode:
authorVolpeon <git@volpeon.ink>2026-07-22 12:27:09 +0200
committerVolpeon <git@volpeon.ink>2026-07-22 12:27:09 +0200
commitcc5329a5f4d3ea91cac93bc7f9b8f943b7ced226 (patch)
treed16dea8f0a5edca2b610ecabeac5e93a4d98be2f /src/objects/_text-field.vars.scss
parentUpdate _index.scss (diff)
downloadiro-design-cc5329a5f4d3ea91cac93bc7f9b8f943b7ced226.tar.gz
iro-design-cc5329a5f4d3ea91cac93bc7f9b8f943b7ced226.tar.bz2
iro-design-cc5329a5f4d3ea91cac93bc7f9b8f943b7ced226.zip
Paths
Diffstat (limited to 'src/objects/_text-field.vars.scss')
-rw-r--r--src/objects/_text-field.vars.scss121
1 files changed, 95 insertions, 26 deletions
diff --git a/src/objects/_text-field.vars.scss b/src/objects/_text-field.vars.scss
index ef06822..9a2a16a 100644
--- a/src/objects/_text-field.vars.scss
+++ b/src/objects/_text-field.vars.scss
@@ -1,39 +1,108 @@
1@use 'sass:map'; 1@use "sass:map";
2@use 'pkg:iro-sass/src/props'; 2@use "pkg:iro-sass/props";
3@use '../core.vars' as core; 3@use "../core.vars" as core;
4 4
5$line-height: props.def(--o-text-field--line-height, 1.4) !default; 5$line-height: props.def(--o-text-field--line-height, 1.4) !default;
6$pad-i: props.def(--o-text-field--pad-i, props.get(core.$size--125)) !default; 6$pad-i: props.def(--o-text-field--pad-i, props.get(core.$size--125)) !default;
7$pad-i-pill: props.def(--o-text-field--pad-i-pill, props.get(core.$size--175)) !default; 7$pad-i-pill: props.def(--o-text-field--pad-i-pill, props.get(core.$size--175)) !default;
8$pad-b: props.def(--o-text-field--pad-b, props.get(core.$size--125)) !default; 8$pad-b: props.def(--o-text-field--pad-b, props.get(core.$size--125)) !default;
9$border-width: props.def(--o-text-field--border-width, props.get(core.$border-width--thin)) !default; 9$border-width: props.def(
10$rounding: props.def(--o-text-field--rounding, props.get(core.$rounding--sm)) !default; 10 --o-text-field--border-width,
11 props.get(core.$border-width--thin)
12) !default;
13$rounding: props.def(--o-text-field--rounding, props.get(core.$rounding--sm)) !default;
11 14
12$extended--pad: props.def(--o-text-field--extended--pad, props.get(core.$size--50)) !default; 15$extended--pad: props.def(--o-text-field--extended--pad, props.get(core.$size--50)) !default;
13 16
14$focus--border-width: props.def(--o-text-field--focus--border-width, props.get(core.$border-width--medium)) !default; 17$focus--border-width: props.def(
18 --o-text-field--focus--border-width,
19 props.get(core.$border-width--medium)
20) !default;
15 21
16$key-focus--border-width: props.def(--o-text-field--key-focus--border-width, props.get(core.$key-focus--outline-width)) !default; 22$key-focus--border-width: props.def(
23 --o-text-field--key-focus--border-width,
24 props.get(core.$key-focus--outline-width)
25) !default;
17 26
18$bg-color: props.def(--o-text-field--bg-color, props.get(core.$theme, --base, --50), 'color') !default; 27$bg-color: props.def(
19$placeholder-color: props.def(--o-text-field--placeholder-color, props.get(core.$theme, --text-mute-more), 'color') !default; 28 --o-text-field--bg-color,
20$text-color: props.def(--o-text-field--text-color, props.get(core.$theme, --text), 'color') !default; 29 props.get(core.$theme, --base, --50),
21$border-color: props.def(--o-text-field--border-color, props.get(core.$theme, --border-strong), 'color') !default; 30 "color"
31) !default;
32$placeholder-color: props.def(
33 --o-text-field--placeholder-color,
34 props.get(core.$theme, --text-mute-more),
35 "color"
36) !default;
37$text-color: props.def(
38 --o-text-field--text-color,
39 props.get(core.$theme, --text),
40 "color"
41) !default;
42$border-color: props.def(
43 --o-text-field--border-color,
44 props.get(core.$theme, --border-strong),
45 "color"
46) !default;
22 47
23$hover--border-color: props.def(--o-text-field--hover--border-color, props.get(core.$theme, --text-mute-more), 'color') !default; 48$hover--border-color: props.def(
49 --o-text-field--hover--border-color,
50 props.get(core.$theme, --text-mute-more),
51 "color"
52) !default;
24 53
25$focus--border-color: props.def(--o-text-field--focus--border-color, props.get(core.$theme, --focus, --border), 'color') !default; 54$focus--border-color: props.def(
55 --o-text-field--focus--border-color,
56 props.get(core.$theme, --focus, --border),
57 "color"
58) !default;
26 59
27$key-focus--border-color: props.def(--o-text-field--key-focus--border-color, props.get(core.$theme, --focus, --border), 'color') !default; 60$key-focus--border-color: props.def(
28$key-focus--outline-color: props.def(--o-text-field--key-focus--outline-color, props.get(core.$theme, --focus, --outline), 'color') !default; 61 --o-text-field--key-focus--border-color,
62 props.get(core.$theme, --focus, --border),
63 "color"
64) !default;
65$key-focus--outline-color: props.def(
66 --o-text-field--key-focus--outline-color,
67 props.get(core.$theme, --focus, --outline),
68 "color"
69) !default;
29 70
30$error--border-color: props.def(--o-text-field--error--border-color, props.get(core.$theme, --negative, --700), 'color') !default; 71$error--border-color: props.def(
72 --o-text-field--error--border-color,
73 props.get(core.$theme, --negative, --700),
74 "color"
75) !default;
31 76
32$error--hover--border-color: props.def(--o-text-field--error--hover--border-color, props.get(core.$theme, --negative, --900), 'color') !default; 77$error--hover--border-color: props.def(
78 --o-text-field--error--hover--border-color,
79 props.get(core.$theme, --negative, --900),
80 "color"
81) !default;
33 82
34$error--focus--border-color: props.def(--o-text-field--error--focus--border-color, props.get(core.$theme, --negative, --900), 'color') !default; 83$error--focus--border-color: props.def(
84 --o-text-field--error--focus--border-color,
85 props.get(core.$theme, --negative, --900),
86 "color"
87) !default;
35 88
36$disabled--bg-color: props.def(--o-text-field--disabled--bg-color, props.get(core.$theme, --border-mute), 'color') !default; 89$disabled--bg-color: props.def(
37$disabled--placeholder-color: props.def(--o-text-field--disabled--placeholder-color, props.get(core.$theme, --text-disabled), 'color') !default; 90 --o-text-field--disabled--bg-color,
38$disabled--text-color: props.def(--o-text-field--disabled--text-color, props.get(core.$theme, --text-disabled), 'color') !default; 91 props.get(core.$theme, --border-mute),
39$disabled--border-color: props.def(--o-text-field--disabled--border-color, props.get(core.$theme, --border-mute), 'color') !default; 92 "color"
93) !default;
94$disabled--placeholder-color: props.def(
95 --o-text-field--disabled--placeholder-color,
96 props.get(core.$theme, --text-disabled),
97 "color"
98) !default;
99$disabled--text-color: props.def(
100 --o-text-field--disabled--text-color,
101 props.get(core.$theme, --text-disabled),
102 "color"
103) !default;
104$disabled--border-color: props.def(
105 --o-text-field--disabled--border-color,
106 props.get(core.$theme, --border-mute),
107 "color"
108) !default;
generated by cgit v1.3.1 (git 2.54.0) at 2026-07-22 15:25:29 +0000