summaryrefslogtreecommitdiffstats
path: root/src/objects/_field-label.scss
diff options
context:
space:
mode:
Diffstat (limited to 'src/objects/_field-label.scss')
-rw-r--r--src/objects/_field-label.scss110
1 files changed, 55 insertions, 55 deletions
diff --git a/src/objects/_field-label.scss b/src/objects/_field-label.scss
index 564ab2b..aa12eb5 100644
--- a/src/objects/_field-label.scss
+++ b/src/objects/_field-label.scss
@@ -7,70 +7,70 @@
7@use 'field-label.vars' as vars; 7@use 'field-label.vars' as vars;
8 8
9@mixin styles { 9@mixin styles {
10 @include materialize-at-root(meta.module-variables('vars')); 10 @include materialize-at-root(meta.module-variables('vars'));
11 11
12 @include bem.object('field-label') { 12 @include bem.object('field-label') {
13 @include bem.elem('label') { 13 @include bem.elem('label') {
14 display: block; 14 display: block;
15 flex: 0 0 auto; 15 flex: 0 0 auto;
16 padding-inline-end: props.get(vars.$spacing-i); 16 padding-inline-end: props.get(vars.$spacing-i);
17 font-size: props.get(vars.$label-font-size); 17 font-size: props.get(vars.$label-font-size);
18 font-weight: 400; 18 font-weight: 400;
19 line-height: 1.3; 19 line-height: 1.3;
20 color: props.get(vars.$label-color); 20 color: props.get(vars.$label-color);
21 21
22 @include bem.next-elem('content') { 22 @include bem.next-elem('content') {
23 margin-block-start: props.get(vars.$spacing-b); 23 margin-block-start: props.get(vars.$spacing-b);
24 } 24 }
25 } 25 }
26 26
27 @include bem.elem('content') { 27 @include bem.elem('content') {
28 display: block; 28 display: block;
29 flex: 1 1 auto; 29 flex: 1 1 auto;
30 } 30 }
31 31
32 @include bem.elem('hint') { 32 @include bem.elem('hint') {
33 display: block; 33 display: block;
34 margin-block-start: props.get(vars.$spacing-b); 34 margin-block-start: props.get(vars.$spacing-b);
35 font-size: props.get(vars.$hint-font-size); 35 font-size: props.get(vars.$hint-font-size);
36 color: props.get(vars.$hint-color); 36 color: props.get(vars.$hint-color);
37 } 37 }
38 38
39 @include bem.is('invalid') { 39 @include bem.is('invalid') {
40 @include bem.elem('hint') { 40 @include bem.elem('hint') {
41 color: props.get(vars.$error-hint-color); 41 color: props.get(vars.$error-hint-color);
42 } 42 }
43 } 43 }
44 44
45 @include bem.is('disabled') { 45 @include bem.is('disabled') {
46 @include bem.elem('label', 'hint') { 46 @include bem.elem('label', 'hint') {
47 color: props.get(vars.$disabled-color); 47 color: props.get(vars.$disabled-color);
48 } 48 }
49 } 49 }
50 50
51 @include bem.modifier('align-start', 'align-end') { 51 @include bem.modifier('align-start', 'align-end') {
52 display: flex; 52 display: flex;
53 align-items: baseline; 53 align-items: baseline;
54 54
55 @include bem.elem('label') { 55 @include bem.elem('label') {
56 display: inline-block; 56 display: inline-block;
57 57
58 @include bem.next-elem('content') { 58 @include bem.next-elem('content') {
59 margin-block-start: 0; 59 margin-block-start: 0;
60 } 60 }
61 } 61 }
62 } 62 }
63 63
64 @include bem.modifier('align-start') { 64 @include bem.modifier('align-start') {
65 @include bem.elem('label') { 65 @include bem.elem('label') {
66 text-align: start; 66 text-align: start;
67 } 67 }
68 } 68 }
69 69
70 @include bem.modifier('align-end') { 70 @include bem.modifier('align-end') {
71 @include bem.elem('label') { 71 @include bem.elem('label') {
72 text-align: end; 72 text-align: end;
73 } 73 }
74 } 74 }
75 } 75 }
76} 76}