@acorex/styles 19.11.0 → 19.11.2-next.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -1,16 +1,16 @@
|
|
|
1
1
|
.ax-action-list {
|
|
2
|
+
display: flex;
|
|
3
|
+
|
|
2
4
|
&.ax-action-list-horizontal {
|
|
3
|
-
display: flex;
|
|
4
5
|
flex-direction: row;
|
|
5
6
|
|
|
6
7
|
ax-divider {
|
|
7
|
-
|
|
8
|
-
width: 1px;
|
|
8
|
+
width: 0px;
|
|
9
9
|
height: auto;
|
|
10
|
+
border-inline-end: 1px solid rgba(var(--ax-sys-color-border-lightest-surface));
|
|
10
11
|
}
|
|
11
12
|
}
|
|
12
13
|
&.ax-action-list-vertical {
|
|
13
|
-
display: flex;
|
|
14
14
|
flex-direction: column;
|
|
15
15
|
|
|
16
16
|
.ax-action-item {
|
|
@@ -24,7 +24,6 @@
|
|
|
24
24
|
}
|
|
25
25
|
|
|
26
26
|
ax-divider {
|
|
27
|
-
margin-block: 0.25rem;
|
|
28
27
|
height: 1px;
|
|
29
28
|
width: 100%;
|
|
30
29
|
}
|
|
@@ -32,8 +31,6 @@
|
|
|
32
31
|
|
|
33
32
|
ax-title {
|
|
34
33
|
display: block;
|
|
35
|
-
padding-inline: 0.875rem;
|
|
36
|
-
padding-block: 0.25rem;
|
|
37
34
|
font-size: 0.75rem;
|
|
38
35
|
line-height: 1rem;
|
|
39
36
|
font-weight: bolder;
|
|
@@ -46,6 +43,10 @@
|
|
|
46
43
|
background-color: rgba(var(--ax-sys-color-border-lightest-surface));
|
|
47
44
|
}
|
|
48
45
|
|
|
46
|
+
ax-text {
|
|
47
|
+
white-space: nowrap;
|
|
48
|
+
}
|
|
49
|
+
|
|
49
50
|
.ax-action-item {
|
|
50
51
|
display: flex;
|
|
51
52
|
align-items: center;
|
|
@@ -55,7 +56,7 @@
|
|
|
55
56
|
height: 2.25rem;
|
|
56
57
|
width: 100%;
|
|
57
58
|
cursor: pointer;
|
|
58
|
-
padding-inline
|
|
59
|
+
padding-inline: var(--ax-comp-action-item-padding-inline, 0.875rem);
|
|
59
60
|
&.ax-state-disabled {
|
|
60
61
|
cursor: not-allowed;
|
|
61
62
|
opacity: 0.5;
|
|
@@ -75,20 +76,9 @@
|
|
|
75
76
|
display: flex;
|
|
76
77
|
align-items: center;
|
|
77
78
|
justify-content: center;
|
|
78
|
-
|
|
79
|
-
&.ax-action-item-prefix {
|
|
80
|
-
padding-inline-start: 0.875rem;
|
|
81
|
-
& > ax-text {
|
|
82
|
-
padding-inline-start: 0.5rem;
|
|
83
|
-
white-space: nowrap;
|
|
84
|
-
}
|
|
85
|
-
}
|
|
86
|
-
|
|
79
|
+
&.ax-action-item-prefix,
|
|
87
80
|
&.ax-action-item-suffix {
|
|
88
|
-
|
|
89
|
-
padding-inline-end: 0.875rem;
|
|
90
|
-
margin-inline-start: 1rem;
|
|
91
|
-
}
|
|
81
|
+
gap: 0.5rem;
|
|
92
82
|
}
|
|
93
83
|
}
|
|
94
84
|
|
|
@@ -102,7 +92,6 @@
|
|
|
102
92
|
color: rgba(var(--ax-sys-body-text-color));
|
|
103
93
|
opacity: 0.5;
|
|
104
94
|
font-weight: lighter;
|
|
105
|
-
padding-inline: 0.5rem;
|
|
106
95
|
}
|
|
107
96
|
}
|
|
108
97
|
}
|
|
@@ -31,14 +31,15 @@
|
|
|
31
31
|
--ax-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
|
|
32
32
|
--ax-shadow-colored: 0 4px 6px -1px var(--ax-shadow-color), 0 2px 4px -2px var(--ax-shadow-color);
|
|
33
33
|
box-shadow: var(--ax-ring-offset-shadow, 0 0 #0000), var(--ax-ring-shadow, 0 0 #0000), var(--ax-shadow);
|
|
34
|
-
border-radius: var(--ax-sys-border-radius);
|
|
34
|
+
border-top-left-radius: var(--ax-sys-border-radius);
|
|
35
|
+
border-top-right-radius: var(--ax-sys-border-radius);
|
|
35
36
|
|
|
36
37
|
@include mixins.media('xs') {
|
|
37
38
|
margin: 0;
|
|
38
39
|
}
|
|
39
40
|
ax-header,
|
|
40
41
|
ax-footer {
|
|
41
|
-
background-color: rgba(var(--ax-sys-color-surface));
|
|
42
|
+
background-color: rgba(var(--ax-sys-color-lightest-surface));
|
|
42
43
|
padding: 0.75rem /* 12px */;
|
|
43
44
|
}
|
|
44
45
|
|
|
@@ -52,9 +53,7 @@
|
|
|
52
53
|
height: auto;
|
|
53
54
|
max-height: 85vh;
|
|
54
55
|
width: 100%;
|
|
55
|
-
background-color: rgba(var(--ax-sys-color-surface));
|
|
56
|
-
border-top-left-radius: var(--ax-sys-border-radius);
|
|
57
|
-
border-top-right-radius: var(--ax-sys-border-radius);
|
|
56
|
+
background-color: rgba(var(--ax-sys-color-lightest-surface));
|
|
58
57
|
&.ax-full {
|
|
59
58
|
height: 95vh;
|
|
60
59
|
max-height: 95vh;
|
|
@@ -5,8 +5,8 @@
|
|
|
5
5
|
align-items: center;
|
|
6
6
|
justify-content: center;
|
|
7
7
|
border-radius: var(--ax-sys-border-radius);
|
|
8
|
-
padding-left: 1rem;
|
|
9
|
-
padding-right: 1rem;
|
|
8
|
+
padding-left: var(--ax-comp-general-button-padding-left, 1rem);
|
|
9
|
+
padding-right: var(--ax-comp-general-button-padding-right, 1rem);
|
|
10
10
|
font-size: 0.875rem;
|
|
11
11
|
line-height: 1.25rem;
|
|
12
12
|
color: rgb(var(--ax-sys-color-on-surface), 0.75);
|
|
@@ -31,8 +31,8 @@
|
|
|
31
31
|
}
|
|
32
32
|
|
|
33
33
|
&.ax-button-icon {
|
|
34
|
-
padding-left: 0.5rem;
|
|
35
|
-
padding-right: 0.5rem;
|
|
34
|
+
padding-left: var(--ax-comp-general-button-padding-left, 0.5rem);
|
|
35
|
+
padding-right: var(--ax-comp-general-button-padding-right, 0.5rem);
|
|
36
36
|
font-size: 100%;
|
|
37
37
|
> button {
|
|
38
38
|
display: flex;
|