@acorex/styles 5.0.52 → 5.0.55
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,
|
|
@@ -0,0 +1,52 @@
|
|
|
1
|
+
@layer components {
|
|
2
|
+
ax-collpase,
|
|
3
|
+
.ax-collapse {
|
|
4
|
+
@apply ax-border ax-border-light-200 ax-block ax-text-sm ax-rounded ax-overflow-hidden;
|
|
5
|
+
|
|
6
|
+
.ax-collapse-header {
|
|
7
|
+
@apply ax-cursor-pointer ax-select-none;
|
|
8
|
+
|
|
9
|
+
&.ax-state-collapsed {
|
|
10
|
+
.ax-collapse-header-container {
|
|
11
|
+
@apply ax-border-b-0;
|
|
12
|
+
.ax-collapse-arrow {
|
|
13
|
+
@apply -ax-rotate-90;
|
|
14
|
+
}
|
|
15
|
+
}
|
|
16
|
+
.ax-collapse-custom-header-container{
|
|
17
|
+
@apply ax-border-b-0;
|
|
18
|
+
}
|
|
19
|
+
}
|
|
20
|
+
.ax-collapse-custom-header-container{
|
|
21
|
+
@apply ax-bg-light-50 ax-border-b ax-border-light-200;
|
|
22
|
+
}
|
|
23
|
+
.ax-collapse-header-container {
|
|
24
|
+
@apply ax-flex ax-justify-between ax-px-3 ax-py-1.5 ax-bg-light-50 ax-border-b ax-border-light-200;
|
|
25
|
+
.ax-collapse-arrow {
|
|
26
|
+
@apply ax-inline-block ax-text-xl ax-me-2 ax-rotate-90;
|
|
27
|
+
}
|
|
28
|
+
}
|
|
29
|
+
}
|
|
30
|
+
.ax-collapse-body {
|
|
31
|
+
@apply ax-p-3;
|
|
32
|
+
}
|
|
33
|
+
}
|
|
34
|
+
.ax-collapse-group {
|
|
35
|
+
@apply ax-block ax-border ax-border-light-200 ax-rounded ax-overflow-hidden;
|
|
36
|
+
|
|
37
|
+
ax-collpase,
|
|
38
|
+
.ax-collapse {
|
|
39
|
+
@apply ax-rounded-none ax-border-none;
|
|
40
|
+
.ax-collapse-header-container {
|
|
41
|
+
@apply ax-border-t ax-border-light-200;
|
|
42
|
+
}
|
|
43
|
+
}
|
|
44
|
+
ax-collapse {
|
|
45
|
+
&:first-child {
|
|
46
|
+
.ax-collapse-header-container {
|
|
47
|
+
@apply ax-border-t-0;
|
|
48
|
+
}
|
|
49
|
+
}
|
|
50
|
+
}
|
|
51
|
+
}
|
|
52
|
+
}
|
|
@@ -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 {
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
@layer components {
|
|
2
|
+
ax-result,
|
|
3
|
+
.ax-result {
|
|
4
|
+
@apply ax-flex ax-flex-col;
|
|
5
|
+
.ax-result-icon {
|
|
6
|
+
@apply ax-text-6xl ax-text-center;
|
|
7
|
+
}
|
|
8
|
+
.ax-result-title,
|
|
9
|
+
.ax-result-description {
|
|
10
|
+
@apply ax-mt-4 ax-text-center;
|
|
11
|
+
}
|
|
12
|
+
.ax-result-title {
|
|
13
|
+
@apply ax-text-2xl ax-font-semibold ax-text-light-700 dark:ax-text-light-50;
|
|
14
|
+
}
|
|
15
|
+
.ax-result-description {
|
|
16
|
+
@apply ax-text-sm ax-text-light-500 dark:ax-text-light-100;
|
|
17
|
+
}
|
|
18
|
+
.ax-custom-icon,.ax-custom-image{
|
|
19
|
+
@apply ax-flex ax-items-center ax-justify-center;
|
|
20
|
+
}
|
|
21
|
+
.ax-result-content {
|
|
22
|
+
@apply ax-mt-4;
|
|
23
|
+
}
|
|
24
|
+
}
|
|
25
|
+
}
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
@import "./action-sheet";
|
|
1
2
|
@import "./alert";
|
|
2
3
|
@import "./avatar";
|
|
3
4
|
@import "./badge";
|
|
@@ -6,6 +7,7 @@
|
|
|
6
7
|
@import "./calendar";
|
|
7
8
|
@import "./carousel";
|
|
8
9
|
@import "./checkbox";
|
|
10
|
+
@import "./collapse";
|
|
9
11
|
@import "./datapager";
|
|
10
12
|
@import "./datepicker";
|
|
11
13
|
@import "./dialog";
|
|
@@ -25,6 +27,7 @@
|
|
|
25
27
|
@import "./radio";
|
|
26
28
|
@import "./range-slider";
|
|
27
29
|
@import "./rating";
|
|
30
|
+
@import "./result";
|
|
28
31
|
@import "./selectbox";
|
|
29
32
|
@import "./selection-list";
|
|
30
33
|
@import "./side-menu";
|