@acorex/styles 5.0.53 → 5.0.56
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.
package/package.json
CHANGED
@@ -0,0 +1,25 @@
|
|
1
|
+
@layer components {
|
2
|
+
ax-action-sheet,
|
3
|
+
.ax-action-sheet {
|
4
|
+
.ax-action-sheet-container {
|
5
|
+
@apply ax-fixed ax-bottom-0 ax-left-1/2 -ax-translate-x-1/2 ax-z-[9999] ax-w-1/3 ax-rounded-t-2xl ax-overflow-hidden;
|
6
|
+
|
7
|
+
@include screen(mobile) {
|
8
|
+
@apply ax-w-full;
|
9
|
+
}
|
10
|
+
.ax-action-sheet-caption {
|
11
|
+
@apply ax-text-sm ax-p-4;
|
12
|
+
}
|
13
|
+
.ax-action-sheet-items {
|
14
|
+
@apply ax-flex ax-flex-col ax-pb-3 ax-overflow-x-hidden ax-overflow-y-auto;
|
15
|
+
ax-button {
|
16
|
+
@apply ax-rounded-none ax-w-full ax-text-start ax-justify-start;
|
17
|
+
}
|
18
|
+
}
|
19
|
+
}
|
20
|
+
}
|
21
|
+
|
22
|
+
.ax-action-sheet-backdrop {
|
23
|
+
@apply ax-bg-black/75 ax-left-0 ax-right-0 ax-top-0 ax-bottom-0 ax-fixed ax-z-[9998];
|
24
|
+
}
|
25
|
+
}
|
@@ -2,19 +2,24 @@
|
|
2
2
|
ax-avatar-group,
|
3
3
|
.ax-avatar-group {
|
4
4
|
@apply ax-flex;
|
5
|
-
ax-avatar{
|
5
|
+
ax-avatar {
|
6
6
|
@apply ax-border-2 ax-border-white -ax-m-1 dark:ax-border-dark-500;
|
7
7
|
}
|
8
8
|
}
|
9
9
|
ax-avatar,
|
10
10
|
.ax-avatar {
|
11
11
|
@apply ax-relative ax-flex ax-items-center ax-justify-center ax-w-16 ax-h-16;
|
12
|
-
ax-badge{
|
13
|
-
@apply ax-absolute -ax-top-1.5
|
12
|
+
ax-badge {
|
13
|
+
@apply ax-absolute -ax-top-1.5;
|
14
14
|
right: -6px;
|
15
15
|
}
|
16
16
|
.ax-avatar-container {
|
17
17
|
@apply ax-w-full ax-h-full ax-rounded-md;
|
18
|
+
.ax-default-avatar {
|
19
|
+
svg {
|
20
|
+
@apply ax-w-full;
|
21
|
+
}
|
22
|
+
}
|
18
23
|
.ax-default-avatar,
|
19
24
|
.ax-text-avatar,
|
20
25
|
.ax-icon-avatar,
|
@@ -1,34 +1,26 @@
|
|
1
1
|
@layer components {
|
2
2
|
.ax-drawer-container {
|
3
|
-
@apply ax-flex
|
4
|
-
ax-relative
|
5
|
-
ax-w-full
|
6
|
-
ax-h-full
|
7
|
-
ax-overflow-hidden;
|
3
|
+
@apply ax-flex ax-relative ax-w-full ax-h-full ax-overflow-hidden;
|
8
4
|
|
9
5
|
.ax-drawer-backdrop {
|
10
|
-
@apply ax-absolute ax-w-full ax-h-full;
|
11
|
-
|
12
|
-
top: 0;
|
13
|
-
right: 0;
|
14
|
-
top: 0;
|
15
|
-
bottom: 0;
|
16
|
-
background-color: rgba($color: #000000, $alpha: 0.3);
|
6
|
+
@apply ax-absolute ax-w-full ax-h-full ax-z-[990] ax-transition-all ax-top-0 ax-bottom-0 ax-bg-black/50;
|
7
|
+
|
17
8
|
}
|
18
9
|
|
19
10
|
.ax-drawer {
|
20
|
-
|
11
|
+
|
21
12
|
|
22
|
-
&.ax-animated {
|
23
|
-
|
24
|
-
}
|
13
|
+
// &.ax-animated {
|
14
|
+
// transition: all 500ms;
|
15
|
+
// }
|
25
16
|
|
26
17
|
&.ax-drawer-overlay {
|
27
|
-
@apply ax-absolute;
|
18
|
+
@apply ax-absolute ax-z-[999];
|
28
19
|
z-index: 9999;
|
29
20
|
}
|
30
21
|
|
31
22
|
&.ax-drawer-start {
|
23
|
+
@apply ax-h-full;
|
32
24
|
&.ax-hide {
|
33
25
|
position: absolute;
|
34
26
|
left: -9999px;
|
@@ -44,6 +36,7 @@
|
|
44
36
|
}
|
45
37
|
|
46
38
|
&.ax-drawer-end {
|
39
|
+
@apply ax-h-full;
|
47
40
|
&.ax-hide {
|
48
41
|
position: absolute;
|
49
42
|
right: -9999px;
|
@@ -69,6 +62,60 @@
|
|
69
62
|
}
|
70
63
|
}
|
71
64
|
}
|
65
|
+
&.ax-drawer-top {
|
66
|
+
@apply ax-w-full;
|
67
|
+
&.ax-hide {
|
68
|
+
position: absolute;
|
69
|
+
top: -9999px;
|
70
|
+
}
|
71
|
+
|
72
|
+
&.ax-drawer-overlay {
|
73
|
+
&.ax-collapsed {
|
74
|
+
top: calc(-2 * var(--attr-height));
|
75
|
+
}
|
76
|
+
|
77
|
+
&.ax-expanded {
|
78
|
+
top: calc(-2 * var(--attr-diff));
|
79
|
+
}
|
80
|
+
}
|
81
|
+
|
82
|
+
&.ax-drawer-push {
|
83
|
+
&.ax-collapsed {
|
84
|
+
margin-block-start: calc(-2 * var(--attr-height));
|
85
|
+
}
|
86
|
+
|
87
|
+
&.ax-expanded {
|
88
|
+
margin-block-start: 0;
|
89
|
+
}
|
90
|
+
}
|
91
|
+
}
|
92
|
+
&.ax-drawer-bottom {
|
93
|
+
@apply ax-w-full;
|
94
|
+
&.ax-hide {
|
95
|
+
position: absolute;
|
96
|
+
bottom: -9999px;
|
97
|
+
}
|
98
|
+
|
99
|
+
&.ax-drawer-overlay {
|
100
|
+
&.ax-collapsed {
|
101
|
+
bottom: calc(-2 * var(--attr-height));
|
102
|
+
}
|
103
|
+
|
104
|
+
&.ax-expanded {
|
105
|
+
bottom: calc(-2 * var(--attr-diff));
|
106
|
+
}
|
107
|
+
}
|
108
|
+
|
109
|
+
&.ax-drawer-push {
|
110
|
+
&.ax-collapsed {
|
111
|
+
margin-block-start: calc(-2 * var(--attr-height));
|
112
|
+
}
|
113
|
+
|
114
|
+
&.ax-expanded {
|
115
|
+
margin-block-start: 0;
|
116
|
+
}
|
117
|
+
}
|
118
|
+
}
|
72
119
|
}
|
73
120
|
|
74
121
|
.ax-drawer-content {
|
@@ -126,7 +126,7 @@
|
|
126
126
|
|
127
127
|
&.ax-look-pills-color {
|
128
128
|
ax-tab-item {
|
129
|
-
@apply ax-text-light-fore ax-
|
129
|
+
@apply ax-text-light-fore ax-mr-1 ax-rounded dark:ax-text-primary-200;
|
130
130
|
|
131
131
|
&:hover {
|
132
132
|
@apply ax-bg-primary-100 ax-text-primary-500 dark:ax-text-primary-50 dark:ax-bg-primary-500;
|