summaryrefslogtreecommitdiffstats
path: root/src/objects
diff options
context:
space:
mode:
Diffstat (limited to 'src/objects')
-rw-r--r--src/objects/_button.scss26
-rw-r--r--src/objects/_checkbox.scss10
-rw-r--r--src/objects/_radio.scss2
-rw-r--r--src/objects/_switch.scss2
4 files changed, 20 insertions, 20 deletions
diff --git a/src/objects/_button.scss b/src/objects/_button.scss
index 6ae8312..57c49e8 100644
--- a/src/objects/_button.scss
+++ b/src/objects/_button.scss
@@ -4,31 +4,31 @@
4@use '../mixins/typography'; 4@use '../mixins/typography';
5 5
6@mixin button-variant($variant) { 6@mixin button-variant($variant) {
7 border-color: fn.color((--#{$variant}, --bg)); 7 border-color: fn.color(--#{$variant} --bg);
8 background-color: fn.color((--#{$variant}, --bg)); 8 background-color: fn.color(--#{$variant} --bg);
9 box-shadow: fn.color((--#{$variant}, --shadow)); 9 box-shadow: fn.color(--#{$variant} --shadow);
10 color: fn.color((--#{$variant}, --label)); 10 color: fn.color(--#{$variant} --label);
11 11
12 @include iro.bem-multi('&:link, &:visited', 'modifier' 'native') { 12 @include iro.bem-multi('&:link, &:visited', 'modifier' 'native') {
13 &:hover { 13 &:hover {
14 border-color: fn.color((--#{$variant}, --hover, --bg)); 14 border-color: fn.color(--#{$variant} --hover --bg);
15 background-color: fn.color((--#{$variant}, --hover, --bg)); 15 background-color: fn.color(--#{$variant} --hover --bg);
16 box-shadow: fn.color((--#{$variant}, --hover, --shadow)); 16 box-shadow: fn.color(--#{$variant} --hover --shadow);
17 color: fn.color((--#{$variant}, --hover, --label)); 17 color: fn.color(--#{$variant} --hover --label);
18 } 18 }
19 19
20 &:active { 20 &:active {
21 border-color: fn.color((--#{$variant}, --active, --bg)); 21 border-color: fn.color(--#{$variant} --active --bg);
22 background-color: fn.color((--#{$variant}, --active, --bg)); 22 background-color: fn.color(--#{$variant} --active --bg);
23 box-shadow: fn.color((--#{$variant}, --active, --shadow)); 23 box-shadow: fn.color(--#{$variant} --active --shadow);
24 color: fn.color((--#{$variant}, --active, --label)); 24 color: fn.color(--#{$variant} --active --label);
25 } 25 }
26 } 26 }
27 27
28 @include iro.bem-modifier('outline') { 28 @include iro.bem-modifier('outline') {
29 background-color: transparent; 29 background-color: transparent;
30 box-shadow: none; 30 box-shadow: none;
31 color: fn.color((--#{$variant}, --outline-label)); 31 color: fn.color(--#{$variant} --outline-label);
32 } 32 }
33} 33}
34 34
diff --git a/src/objects/_checkbox.scss b/src/objects/_checkbox.scss
index b56336a..11836e1 100644
--- a/src/objects/_checkbox.scss
+++ b/src/objects/_checkbox.scss
@@ -46,8 +46,8 @@
46 display: inline-flex; 46 display: inline-flex;
47 position: relative; 47 position: relative;
48 align-items: flex-start; 48 align-items: flex-start;
49 margin-right: calc(-1 * #{fn.dim(--padding-x)} + #{fn.dim(--margin-right)}); 49 margin-right: calc(-1 * fn.dim(--padding-x) + fn.dim(--margin-right));
50 margin-left: calc(-1 * #{fn.dim(--padding-x)}); 50 margin-left: calc(-1 * fn.dim(--padding-x));
51 padding: fn.dim(--padding-y) fn.dim(--padding-x); // sass-lint:disable-line shorthand-values 51 padding: fn.dim(--padding-y) fn.dim(--padding-x); // sass-lint:disable-line shorthand-values
52 52
53 @include iro.bem-elem('box') { 53 @include iro.bem-elem('box') {
@@ -56,7 +56,7 @@
56 flex: 0 0 auto; 56 flex: 0 0 auto;
57 width: fn.dim(--size); 57 width: fn.dim(--size);
58 height: fn.dim(--size); 58 height: fn.dim(--size);
59 margin-top: calc(.5 * (#{$line-height * 1em} - #{fn.dim(--size)})); 59 margin-top: calc(.5 * ($line-height * 1em - fn.dim(--size)));
60 border-radius: fn.dim(--border-width); 60 border-radius: fn.dim(--border-width);
61 background-color: fn.color(--box-border); 61 background-color: fn.color(--box-border);
62 62
@@ -79,8 +79,8 @@
79 79
80 &::after { 80 &::after {
81 z-index: 3; 81 z-index: 3;
82 top: calc(.5 * #{fn.dim(--size)} - 1px); 82 top: calc(.5 * fn.dim(--size) - 1px);
83 left: calc(1.5 * #{fn.dim(--border-width)}); 83 left: calc(1.5 * fn.dim(--border-width));
84 box-sizing: border-box; 84 box-sizing: border-box;
85 width: calc(fn.dim(--size) - 3 * fn.dim(--border-width)); 85 width: calc(fn.dim(--size) - 3 * fn.dim(--border-width));
86 height: 0; 86 height: 0;
diff --git a/src/objects/_radio.scss b/src/objects/_radio.scss
index 178b58c..51bfcd8 100644
--- a/src/objects/_radio.scss
+++ b/src/objects/_radio.scss
@@ -57,7 +57,7 @@
57 flex: 0 0 auto; 57 flex: 0 0 auto;
58 width: fn.dim(--diameter); 58 width: fn.dim(--diameter);
59 height: fn.dim(--diameter); 59 height: fn.dim(--diameter);
60 margin-top: calc(.5 * (#{$line-height * 1em} - #{fn.dim(--diameter)})); 60 margin-top: calc(.5 * ($line-height * 1em - fn.dim(--diameter)));
61 border-radius: 2em; 61 border-radius: 2em;
62 background-color: fn.color(--circle-border); 62 background-color: fn.color(--circle-border);
63 63
diff --git a/src/objects/_switch.scss b/src/objects/_switch.scss
index b75397d..95209b4 100644
--- a/src/objects/_switch.scss
+++ b/src/objects/_switch.scss
@@ -116,7 +116,7 @@
116 background-color: fn.color(--handle-border); 116 background-color: fn.color(--handle-border);
117 117
118 &::after { 118 &::after {
119 left: calc(#{fn.dim(--width)} - #{fn.dim(--height)} + .5px); 119 left: calc(fn.dim(--width) - fn.dim(--height) + .5px);
120 border-color: fn.color(--handle-border); 120 border-color: fn.color(--handle-border);
121 } 121 }
122 } 122 }