@acorex/styles 5.6.0 → 5.7.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.
- package/package.json +1 -1
- package/src/components/_alert.scss +17 -27
- package/src/components/_button.scss +309 -401
- package/src/components/_calendar.scss +36 -18
- package/src/components/_color-palette.scss +45 -19
- package/src/components/_data-table.scss +30 -5
- package/src/components/_datapager.scss +35 -26
- package/src/components/_decoration.scss +17 -9
- package/src/components/_drawer.scss +5 -1
- package/src/components/_dropdown.scss +6 -2
- package/src/components/_editor-container.scss +6 -1
- package/src/components/_fieldset.scss +1 -1
- package/src/components/_popup.scss +5 -1
- package/src/components/_range-slider.scss +59 -2
- package/src/components/_table.scss +40 -7
- package/src/components/_tabs.scss +3 -3
- package/src/icons/demo-files/demo.css +152 -152
- package/src/icons/demo-files/demo.js +30 -30
- package/src/icons/demo.html +15 -1
- package/src/icons/fonts/acorex-icon.eot +0 -0
- package/src/icons/fonts/acorex-icon.svg +1 -0
- package/src/icons/fonts/acorex-icon.ttf +0 -0
- package/src/icons/fonts/acorex-icon.woff +0 -0
- package/src/icons/selection.json +1 -1
- package/src/icons/style.css +8 -5
- package/src/icons/style.scss +10 -5
- package/src/icons/variables.scss +1 -0
- package/src/utility/_mixins.scss +31 -31
- package/src/variables/_colors.scss +15 -14
package/src/utility/_mixins.scss
CHANGED
|
@@ -58,37 +58,31 @@
|
|
|
58
58
|
} @else {
|
|
59
59
|
@apply ax-bg-#{$color}-500 ax-text-#{$color}-fore;
|
|
60
60
|
}
|
|
61
|
+
.ax-alert-progress{
|
|
62
|
+
@apply ax-bg-#{$color}-800;
|
|
63
|
+
}
|
|
61
64
|
}
|
|
62
65
|
@if ($look == "outline") {
|
|
63
66
|
@apply ax-bg-transparent ax-text-#{$color}-500 ax-border ax-rounded-md ax-border-#{$color}-500;
|
|
64
67
|
ax-header {
|
|
65
68
|
@apply ax-bg-#{$color}-50;
|
|
66
69
|
}
|
|
67
|
-
.ax-alert-
|
|
68
|
-
@apply ax-bg
|
|
69
|
-
ax-button {
|
|
70
|
-
@apply ax-bg-#{$color}-500 #{!important};
|
|
71
|
-
}
|
|
70
|
+
.ax-alert-progress{
|
|
71
|
+
@apply ax-bg-#{$color}-100;
|
|
72
72
|
}
|
|
73
73
|
}
|
|
74
74
|
@if ($look == "twotone") {
|
|
75
75
|
@apply ax-bg-#{$color}-100 ax-text-#{$color}-500;
|
|
76
|
-
.ax-alert-
|
|
77
|
-
@apply ax-bg-#{$color}-
|
|
78
|
-
ax-button {
|
|
79
|
-
@apply ax-bg-#{$color}-500 #{!important};
|
|
80
|
-
}
|
|
76
|
+
.ax-alert-progress{
|
|
77
|
+
@apply ax-bg-#{$color}-500;
|
|
81
78
|
}
|
|
82
79
|
}
|
|
83
80
|
@if ($look == "blank") {
|
|
84
81
|
@apply ax-bg-transparent ax-text-#{$color}-500;
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
@apply ax-bg-transparent #{!important};
|
|
88
|
-
ax-button {
|
|
89
|
-
@apply ax-bg-#{$color}-500 #{!important};
|
|
90
|
-
}
|
|
82
|
+
.ax-alert-progress{
|
|
83
|
+
@apply ax-bg-#{$color}-100;
|
|
91
84
|
}
|
|
85
|
+
|
|
92
86
|
}
|
|
93
87
|
}
|
|
94
88
|
|
|
@@ -104,20 +98,26 @@
|
|
|
104
98
|
}
|
|
105
99
|
}
|
|
106
100
|
|
|
107
|
-
@mixin button-on-colorful-bg {
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
101
|
+
// @mixin button-on-colorful-bg {
|
|
102
|
+
// ax-button {
|
|
103
|
+
// @apply ax-bg-black/20 ax-text-sm ax-border-0 ax-outline-0 ax-ring-0 ax-ring-transparent ax-h-auto ax-shadow-none ax-font-semibold #{!important};
|
|
104
|
+
// & > button {
|
|
105
|
+
// @apply ax-py-1.5 ax-px-2;
|
|
106
|
+
// }
|
|
107
|
+
// &:focus,
|
|
108
|
+
// &:focus-within,
|
|
109
|
+
// &:active,
|
|
110
|
+
// &:hover {
|
|
111
|
+
// @apply ax-bg-black/30 ax-ring-0 ax-border-0 ax-outline-0 ax-shadow-none ax-ring-transparent ax-ring-offset-0 #{!important};
|
|
112
|
+
// }
|
|
113
|
+
// &:active {
|
|
114
|
+
// @apply ax-bg-black/40 #{!important};
|
|
115
|
+
// }
|
|
116
|
+
// }
|
|
117
|
+
// }
|
|
118
|
+
|
|
119
|
+
@mixin rtl {
|
|
120
|
+
.ax-rtl {
|
|
121
|
+
@content;
|
|
122
122
|
}
|
|
123
123
|
}
|
|
@@ -90,20 +90,6 @@ $theme-colors: (
|
|
|
90
90
|
"800": "91 33 182",
|
|
91
91
|
"900": "76 29 149",
|
|
92
92
|
),
|
|
93
|
-
"dark": (
|
|
94
|
-
"": "21 21 21",
|
|
95
|
-
"fore": "255 255 255",
|
|
96
|
-
"50": "227 227 227",
|
|
97
|
-
"100": "185 185 185",
|
|
98
|
-
"200": "138 138 138",
|
|
99
|
-
"300": "91 91 91",
|
|
100
|
-
"400": "56 56 56",
|
|
101
|
-
"500": "21 21 21",
|
|
102
|
-
"600": "18 18 18",
|
|
103
|
-
"700": "15 15 15",
|
|
104
|
-
"800": "12 12 12",
|
|
105
|
-
"900": "6 6 6",
|
|
106
|
-
),
|
|
107
93
|
"light": (
|
|
108
94
|
"": "100 116 139",
|
|
109
95
|
"fore": "15 23 42",
|
|
@@ -117,5 +103,20 @@ $theme-colors: (
|
|
|
117
103
|
"700": "51 65 85",
|
|
118
104
|
"800": "30 41 59",
|
|
119
105
|
"900": "15 23 42",
|
|
106
|
+
),
|
|
107
|
+
"dark": (
|
|
108
|
+
"": "21 21 21",
|
|
109
|
+
"fore": "255 255 255",
|
|
110
|
+
"50": "227 227 227",
|
|
111
|
+
"100": "185 185 185",
|
|
112
|
+
"200": "138 138 138",
|
|
113
|
+
"300": "91 91 91",
|
|
114
|
+
"400": "56 56 56",
|
|
115
|
+
"500": "21 21 21",
|
|
116
|
+
"600": "18 18 18",
|
|
117
|
+
"700": "15 15 15",
|
|
118
|
+
"800": "12 12 12",
|
|
119
|
+
"900": "6 6 6",
|
|
120
120
|
)
|
|
121
|
+
|
|
121
122
|
);
|