summaryrefslogtreecommitdiffstats
path: root/src/layouts
diff options
context:
space:
mode:
authorVolpeon <git@volpeon.ink>2024-06-25 19:17:42 +0200
committerVolpeon <git@volpeon.ink>2024-06-25 19:17:42 +0200
commitbfd2f3750498826f457f96b7dd89476589fa31cd (patch)
tree4bdc8cdc3eb33fcf283353e42c3b596e990e213b /src/layouts
parentFocus indicator style (diff)
downloadiro-design-bfd2f3750498826f457f96b7dd89476589fa31cd.tar.gz
iro-design-bfd2f3750498826f457f96b7dd89476589fa31cd.tar.bz2
iro-design-bfd2f3750498826f457f96b7dd89476589fa31cd.zip
Fix form
Diffstat (limited to 'src/layouts')
-rw-r--r--src/layouts/_form.scss20
1 files changed, 10 insertions, 10 deletions
diff --git a/src/layouts/_form.scss b/src/layouts/_form.scss
index 9c741ec..f6b60ea 100644
--- a/src/layouts/_form.scss
+++ b/src/layouts/_form.scss
@@ -6,8 +6,8 @@
6@include iro.props-namespace('form') { 6@include iro.props-namespace('form') {
7 @include iro.props-store(( 7 @include iro.props-store((
8 --dims: ( 8 --dims: (
9 --item-spacing-y: fn.global-dim(--size --325), 9 --item-spacing-b: fn.global-dim(--size --325),
10 --label-spacing-x: fn.global-dim(--size --325), 10 --label-spacing-i: fn.global-dim(--size --325),
11 --hint-font-size: fn.global-dim(--font-size --75), 11 --hint-font-size: fn.global-dim(--font-size --75),
12 ), 12 ),
13 )); 13 ));
@@ -15,7 +15,7 @@
15 @include iro.bem-layout(iro.props-namespace()) { 15 @include iro.bem-layout(iro.props-namespace()) {
16 display: flex; 16 display: flex;
17 flex-direction: column; 17 flex-direction: column;
18 gap: fn.dim(--item-spacing-y) fn.dim(--label-spacing-x); 18 gap: fn.dim(--item-spacing-b) fn.dim(--label-spacing-i);
19 19
20 @include iro.bem-elem('item') { 20 @include iro.bem-elem('item') {
21 display: block; 21 display: block;
@@ -32,7 +32,7 @@
32 align-items: flex-end; 32 align-items: flex-end;
33 } 33 }
34 34
35 @include iro.bem-modifier('labels-left', 'labels-right') { 35 @include iro.bem-modifier('labels-start', 'labels-end') {
36 display: grid; 36 display: grid;
37 grid-template-columns: auto 1fr; 37 grid-template-columns: auto 1fr;
38 grid-template-rows: auto; 38 grid-template-rows: auto;
@@ -43,19 +43,19 @@
43 } 43 }
44 44
45 @include iro.bem-elem('item-label') { 45 @include iro.bem-elem('item-label') {
46 grid-column: 1; 46 grid-column: 1;
47 padding-right: 0; 47 padding-inline-end: 0;
48 } 48 }
49 49
50 @include iro.bem-elem('item-content') { 50 @include iro.bem-elem('item-content') {
51 grid-column: 2; 51 grid-column: 2;
52 margin-top: 0; 52 margin-block-start: 0;
53 } 53 }
54 } 54 }
55 55
56 @include iro.bem-modifier('labels-right') { 56 @include iro.bem-modifier('labels-end') {
57 @include iro.bem-elem('item-label') { 57 @include iro.bem-elem('item-label') {
58 text-align: right; 58 text-align: end;
59 } 59 }
60 } 60 }
61 } 61 }