@acorex/styles 21.0.0-next.5 → 21.0.0-next.7
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/components/{_action-item.scss → _action-item.css} +19 -27
- package/components/{_actionsheet.scss → _actionsheet.css} +10 -3
- package/components/{_check-box.scss → _check-box.css} +8 -17
- package/components/{_drop-down.scss → _drop-down.css} +27 -15
- package/components/_editor-container.css +306 -0
- package/components/{_list.scss → _list.css} +82 -42
- package/components/{_radio.scss → _radio.css} +16 -18
- package/components/{_table.scss → _table.css} +62 -19
- package/components/{_uploader.scss → _uploader.css} +13 -6
- package/components/index.css +11 -0
- package/icons/fontawesome/_variables.css +229 -0
- package/icons/fontawesome/index.css +555 -0
- package/icons/huge/huge-bulk/_variables.css +211 -0
- package/icons/huge/huge-bulk/index.css +520 -0
- package/icons/huge/huge-duotone/_variables.css +211 -0
- package/icons/huge/huge-duotone/index.css +517 -0
- package/icons/huge/huge-solid-rounded/_variables.css +211 -0
- package/icons/huge/huge-solid-rounded/index.css +504 -0
- package/icons/huge/huge-solid-sharp/_variables.css +213 -0
- package/icons/huge/huge-solid-sharp/index.css +517 -0
- package/icons/huge/huge-solid-standard/_variables.css +211 -0
- package/icons/huge/huge-solid-standard/index.css +516 -0
- package/icons/huge/huge-stroke-rounded/_variables.css +211 -0
- package/icons/huge/huge-stroke-rounded/index.css +515 -0
- package/icons/huge/huge-stroke-sharp/_variables.css +142 -0
- package/icons/huge/huge-stroke-sharp/index.css +515 -0
- package/icons/huge/huge-stroke-standard/_variables.css +141 -0
- package/icons/huge/huge-stroke-standard/index.css +515 -0
- package/icons/huge/huge-twotone/_variables.css +211 -0
- package/icons/huge/huge-twotone/index.css +516 -0
- package/icons/material/_variables.css +229 -0
- package/icons/material/index.css +573 -0
- package/index.css +25 -0
- package/package.json +1 -1
- package/tailwind-base.js +0 -4
- package/themes/{default.scss → default copy.scss } +6 -9
- package/themes/default.css +973 -0
- package/base/_preflight.scss +0 -424
- package/base/index.scss +0 -15
- package/components/_editor-container.scss +0 -293
- package/components/index.scss +0 -11
- package/generators/index.js +0 -1
- package/generators/tailwind-class-generator.js +0 -68
- package/icons/fontawesome/_variables.scss +0 -225
- package/icons/fontawesome/index.scss +0 -705
- package/icons/huge/huge-bulk/_variables.scss +0 -209
- package/icons/huge/huge-bulk/index.scss +0 -656
- package/icons/huge/huge-duotone/_variables.scss +0 -209
- package/icons/huge/huge-duotone/index.scss +0 -657
- package/icons/huge/huge-solid-rounded/_variables.scss +0 -209
- package/icons/huge/huge-solid-rounded/index.scss +0 -643
- package/icons/huge/huge-solid-sharp/_variables.scss +0 -209
- package/icons/huge/huge-solid-sharp/index.scss +0 -656
- package/icons/huge/huge-solid-standard/_variables.scss +0 -209
- package/icons/huge/huge-solid-standard/index.scss +0 -656
- package/icons/huge/huge-stroke-rounded/_variables.scss +0 -209
- package/icons/huge/huge-stroke-rounded/index.scss +0 -656
- package/icons/huge/huge-stroke-sharp/_variables.scss +0 -209
- package/icons/huge/huge-stroke-sharp/index.scss +0 -656
- package/icons/huge/huge-stroke-standard/_variables.scss +0 -209
- package/icons/huge/huge-stroke-standard/index.scss +0 -656
- package/icons/huge/huge-twotone/_variables.scss +0 -209
- package/icons/huge/huge-twotone/index.scss +0 -656
- package/icons/material/_variables.scss +0 -224
- package/icons/material/index.scss +0 -709
- package/index.scss +0 -7
- package/mixins/_editor-looks.scss +0 -32
- package/mixins/_media.scss +0 -73
- package/mixins/_scroll-bar.scss +0 -35
- package/mixins/_util.scss +0 -19
- package/mixins/index.scss +0 -4
- package/utils/_theme-generator.scss +0 -238
- package/utils/_utils.scss +0 -278
- package/utils/index.scss +0 -2
- /package/components/{_general-button.scss → _general-button.css} +0 -0
- /package/components/{_ripple.scss → _ripple.css} +0 -0
package/components/index.scss
DELETED
@@ -1,11 +0,0 @@
|
|
1
|
-
@forward './action-item';
|
2
|
-
@forward './actionsheet';
|
3
|
-
@forward './check-box';
|
4
|
-
@forward './drop-down';
|
5
|
-
@forward './editor-container';
|
6
|
-
@forward './general-button';
|
7
|
-
@forward './list';
|
8
|
-
@forward './radio';
|
9
|
-
@forward './ripple';
|
10
|
-
@forward './table';
|
11
|
-
@forward './uploader';
|
package/generators/index.js
DELETED
@@ -1 +0,0 @@
|
|
1
|
-
export * from './tailwind-class-generator';
|
@@ -1,68 +0,0 @@
|
|
1
|
-
/**
|
2
|
-
* You can give it the variable name you added in the theme file as input and generate color range classes from 50 to 950.
|
3
|
-
*/
|
4
|
-
const variations = ['lightest', 'lighter', 'light', 'surface', 'dark', 'darker', 'darkest'];
|
5
|
-
|
6
|
-
export const createPalette = function (colorName) {
|
7
|
-
const shades = [50, 100, 200, 300, 400, 500, 600, 700, 800, 900, 950];
|
8
|
-
const palette = {
|
9
|
-
DEFAULT: `rgba(var(--ax-sys-color-${colorName}-500), <alpha-value>)`,
|
10
|
-
default: `rgba(var(--ax-sys-color-${colorName}-500), <alpha-value>)`,
|
11
|
-
};
|
12
|
-
|
13
|
-
shades.forEach((shade) => {
|
14
|
-
palette[shade] = `rgba(var(--ax-sys-color-${colorName}-${shade}), <alpha-value>)`;
|
15
|
-
});
|
16
|
-
|
17
|
-
return palette;
|
18
|
-
};
|
19
|
-
|
20
|
-
/**
|
21
|
-
* To be able to create additional color classes you need to use the createSurface.
|
22
|
-
* This function generates seven surface colors. Also, if you want to have surfaces in all Tailwind properties, you can put them in colors.
|
23
|
-
*/
|
24
|
-
export const createSurfaces = function (colorName) {
|
25
|
-
return variations.reduce((surfaces, variation) => {
|
26
|
-
const surfaceVariant = variation === 'surface' ? '' : '-surface';
|
27
|
-
surfaces[variation] = `rgba(var(--ax-sys-color-${colorName}-${variation}${surfaceVariant}), <alpha-value>)`;
|
28
|
-
return surfaces;
|
29
|
-
}, {});
|
30
|
-
};
|
31
|
-
|
32
|
-
/**
|
33
|
-
* The on surface color is based on the surface color of the same name,
|
34
|
-
* so you can generate it with createOnSurface for both text and other colors.
|
35
|
-
*/
|
36
|
-
export const createOnSurfaces = function (colorName) {
|
37
|
-
return variations.reduce((onSurfaces, variation) => {
|
38
|
-
const surfaceVariant = variation === 'surface' ? '' : '-surface';
|
39
|
-
const key = variation === 'contrast' ? `on-${variation}` : `on-${variation}`;
|
40
|
-
onSurfaces[key] = `rgba(var(--ax-sys-color-on-${colorName}-${variation}${surfaceVariant}), <alpha-value>)`;
|
41
|
-
return onSurfaces;
|
42
|
-
}, {});
|
43
|
-
};
|
44
|
-
|
45
|
-
/**
|
46
|
-
* The board color is only used for border colors, which you can generate with the createBorderSurfaces function.
|
47
|
-
*/
|
48
|
-
export const createBorderSurfaces = function (colorName) {
|
49
|
-
return variations.reduce((borderSurfaces, variation) => {
|
50
|
-
const surfaceVariant = variation === 'surface' ? '' : '-surface';
|
51
|
-
borderSurfaces[variation] =
|
52
|
-
`rgba(var(--ax-sys-color-border-${colorName}-${variation}${surfaceVariant}), <alpha-value>)`;
|
53
|
-
return borderSurfaces;
|
54
|
-
}, {});
|
55
|
-
};
|
56
|
-
|
57
|
-
export function createColoredSurfaces(colorName) {
|
58
|
-
return variations.reduce((classes, variation) => {
|
59
|
-
const surfaceVariant = variation === 'surface' ? '' : '-surface';
|
60
|
-
|
61
|
-
classes[`.${colorName}-${variation}`] = {
|
62
|
-
backgroundColor: `rgb(var(--ax-sys-color-${colorName}-${variation}${surfaceVariant}))`,
|
63
|
-
color: `rgb(var(--ax-sys-color-on-${colorName}-${variation}${surfaceVariant}))`,
|
64
|
-
borderColor: `rgb(var(--ax-sys-color-border-${colorName}-${variation}${surfaceVariant}))`,
|
65
|
-
};
|
66
|
-
return classes;
|
67
|
-
}, {});
|
68
|
-
}
|
@@ -1,225 +0,0 @@
|
|
1
|
-
$ax-icon-more-horizontal: '\f141';
|
2
|
-
$ax-icon-more-horizontal: '\f141';
|
3
|
-
$ax-icon-more-horizontal-after: '';
|
4
|
-
|
5
|
-
$ax-icon-more-vertical: '\f142';
|
6
|
-
$ax-icon-more-vertical-after: '';
|
7
|
-
|
8
|
-
$ax-icon-arrow-long-up: '\f176';
|
9
|
-
$ax-icon-arrow-long-up-after: '';
|
10
|
-
|
11
|
-
$ax-icon-arrow-long-down: '\f175';
|
12
|
-
$ax-icon-arrow-long-down-after: '';
|
13
|
-
|
14
|
-
$ax-icon-color-palette: '\f53f';
|
15
|
-
$ax-icon-color-palette-after: '';
|
16
|
-
|
17
|
-
$ax-icon-arrow-left: '\f0d9';
|
18
|
-
$ax-icon-arrow-left-after: '';
|
19
|
-
|
20
|
-
$ax-icon-arrow-down: '\f0d7';
|
21
|
-
$ax-icon-arrow-down-after: '';
|
22
|
-
|
23
|
-
$ax-icon-arrow-up: '\f0d8';
|
24
|
-
$ax-icon-arrow-up-after: '';
|
25
|
-
|
26
|
-
$ax-icon-arrow-right: '\f0da';
|
27
|
-
$ax-icon-arrow-right-after: '';
|
28
|
-
|
29
|
-
$ax-icon-chevron-left: '\f053';
|
30
|
-
$ax-icon-chevron-left-after: '';
|
31
|
-
|
32
|
-
$ax-icon-chevron-down: '\f078';
|
33
|
-
$ax-icon-chevron-down-after: '';
|
34
|
-
|
35
|
-
$ax-icon-chevron-up: '\f077';
|
36
|
-
$ax-icon-chevron-up-after: '';
|
37
|
-
|
38
|
-
$ax-icon-chevron-right: '\f054';
|
39
|
-
$ax-icon-chevron-right-after: '';
|
40
|
-
|
41
|
-
$ax-icon-chevron-double-right: '\f324';
|
42
|
-
$ax-icon-chevron-double-right-after: '';
|
43
|
-
|
44
|
-
$ax-icon-chevron-double-left: '\f323';
|
45
|
-
$ax-icon-chevron-double-left-after: '';
|
46
|
-
|
47
|
-
$ax-icon-first-page: '\f33e';
|
48
|
-
$ax-icon-first-page-after: '';
|
49
|
-
|
50
|
-
$ax-icon-last-page: '\f340';
|
51
|
-
$ax-icon-last-page-after: '';
|
52
|
-
|
53
|
-
$ax-icon-calendar: '\f133';
|
54
|
-
$ax-icon-calendar-after: '';
|
55
|
-
|
56
|
-
$ax-icon-info: '\f05a';
|
57
|
-
$ax-icon-info-after: '';
|
58
|
-
|
59
|
-
$ax-icon-error: '\f06a';
|
60
|
-
$ax-icon-error-after: '';
|
61
|
-
|
62
|
-
$ax-icon-warning: '\f071';
|
63
|
-
$ax-icon-warning-after: '';
|
64
|
-
|
65
|
-
$ax-icon-check: '\f00c';
|
66
|
-
$ax-icon-check-after: '';
|
67
|
-
|
68
|
-
$ax-icon-check-circle: '\f058';
|
69
|
-
$ax-icon-check-circle-after: '';
|
70
|
-
|
71
|
-
$ax-icon-dobble-check: '\f560';
|
72
|
-
$ax-icon-dobble-check-after: '';
|
73
|
-
|
74
|
-
$ax-icon-close: '\f00d';
|
75
|
-
$ax-icon-close-after: '';
|
76
|
-
|
77
|
-
$ax-icon-clear: '\f057';
|
78
|
-
$ax-icon-clear-after: '';
|
79
|
-
|
80
|
-
$ax-icon-visibility-off: '\f070';
|
81
|
-
$ax-icon-visibility-off-after: '';
|
82
|
-
|
83
|
-
$ax-icon-visibility: '\f06e';
|
84
|
-
$ax-icon-visibility-after: '';
|
85
|
-
|
86
|
-
$ax-icon-unfold-more: '\f0dc';
|
87
|
-
$ax-icon-unfold-more-after: '';
|
88
|
-
|
89
|
-
$ax-icon-download: '\f019';
|
90
|
-
$ax-icon-download-after: '';
|
91
|
-
|
92
|
-
$ax-icon-upload: '\e09a';
|
93
|
-
$ax-icon-upload-after: '';
|
94
|
-
|
95
|
-
$ax-icon-search: '\f002';
|
96
|
-
$ax-icon-search-after: '';
|
97
|
-
|
98
|
-
$ax-icon-copy: '\f0c5';
|
99
|
-
$ax-icon-copy-after: '';
|
100
|
-
|
101
|
-
$ax-icon-refresh: '\f021';
|
102
|
-
$ax-icon-refresh-after: '';
|
103
|
-
|
104
|
-
$ax-icon-inbox: '\f01c';
|
105
|
-
$ax-icon-inbox-after: '';
|
106
|
-
|
107
|
-
$ax-icon-emoji: '\f118';
|
108
|
-
$ax-icon-emoji-after: '';
|
109
|
-
|
110
|
-
$ax-icon-attach: '\f0c6';
|
111
|
-
$ax-icon-attach-after: '';
|
112
|
-
|
113
|
-
$ax-icon-mic: '\f130';
|
114
|
-
$ax-icon-mic-after: '';
|
115
|
-
|
116
|
-
$ax-icon-send: '\f1d8';
|
117
|
-
$ax-icon-send-after: '';
|
118
|
-
|
119
|
-
$ax-icon-play: '\f04b';
|
120
|
-
$ax-icon-play-after: '';
|
121
|
-
|
122
|
-
$ax-icon-pause: '\f04c';
|
123
|
-
$ax-icon-pause-after: '';
|
124
|
-
|
125
|
-
$ax-icon-reload: '\f2f9';
|
126
|
-
$ax-icon-reload-after: '';
|
127
|
-
|
128
|
-
$ax-icon-heart: '\f004';
|
129
|
-
$ax-icon-heart-after: '';
|
130
|
-
|
131
|
-
$ax-icon-comment: '\f075';
|
132
|
-
$ax-icon-comment-after: '';
|
133
|
-
|
134
|
-
$ax-icon-bold: '\f032';
|
135
|
-
$ax-icon-bold-after: '';
|
136
|
-
|
137
|
-
$ax-icon-italic: '\f033';
|
138
|
-
$ax-icon-italic-after: '';
|
139
|
-
|
140
|
-
$ax-icon-strike: '\f0cc';
|
141
|
-
$ax-icon-strike-after: '';
|
142
|
-
|
143
|
-
$ax-icon-under-line: '\f0cd';
|
144
|
-
$ax-icon-under-line-after: '';
|
145
|
-
|
146
|
-
$ax-icon-order-list: '\f0cb';
|
147
|
-
$ax-icon-order-list-after: '';
|
148
|
-
|
149
|
-
$ax-icon-un-order-list: '\f0ca';
|
150
|
-
$ax-icon-un-order-list-after: '';
|
151
|
-
|
152
|
-
$ax-icon-align-left: '\f036';
|
153
|
-
$ax-icon-align-left-after: '';
|
154
|
-
|
155
|
-
$ax-icon-align-right: '\f038';
|
156
|
-
$ax-icon-align-right-after: '';
|
157
|
-
|
158
|
-
$ax-icon-align-center: '\f037';
|
159
|
-
$ax-icon-align-center-after: '';
|
160
|
-
|
161
|
-
$ax-icon-align-justify: '\f039';
|
162
|
-
$ax-icon-align-justify-after: '';
|
163
|
-
|
164
|
-
$ax-icon-undo: '\f0e2';
|
165
|
-
$ax-icon-undo-after: '';
|
166
|
-
|
167
|
-
$ax-icon-redo: '\f01e';
|
168
|
-
$ax-icon-redo-after: '';
|
169
|
-
|
170
|
-
$ax-icon-highlight: '\f591';
|
171
|
-
$ax-icon-highlight-after: '';
|
172
|
-
|
173
|
-
$ax-icon-link: '\f0c1';
|
174
|
-
$ax-icon-link-after: '';
|
175
|
-
|
176
|
-
$ax-icon-image: '\f03e';
|
177
|
-
$ax-icon-image-after: '';
|
178
|
-
|
179
|
-
$ax-icon-pen: '\f304';
|
180
|
-
$ax-icon-pen-after: '';
|
181
|
-
|
182
|
-
$ax-icon-eraser: '\f12d';
|
183
|
-
$ax-icon-eraser-after: '';
|
184
|
-
|
185
|
-
$ax-icon-pen-ruler: '\f5ae';
|
186
|
-
$ax-icon-pen-ruler-after: '';
|
187
|
-
|
188
|
-
$ax-icon-crop: '\f125';
|
189
|
-
$ax-icon-crop-after: '';
|
190
|
-
|
191
|
-
$ax-icon-full-screen: '\f065';
|
192
|
-
$ax-icon-full-screen-after: '';
|
193
|
-
|
194
|
-
$ax-icon-up-folder: '\e632';
|
195
|
-
$ax-icon-up-folder-after: '';
|
196
|
-
|
197
|
-
$ax-icon-sort: '\e0ae';
|
198
|
-
$ax-icon-sort-after: '';
|
199
|
-
|
200
|
-
$ax-icon-menu: '\f0c9';
|
201
|
-
$ax-icon-menu-after: '';
|
202
|
-
|
203
|
-
$ax-icon-plus: '\2b';
|
204
|
-
$ax-icon-plus-after: '';
|
205
|
-
|
206
|
-
$ax-icon-trash: '\f1f8';
|
207
|
-
$ax-icon-trash-after: '';
|
208
|
-
|
209
|
-
$ax-icon-arrow-turn-right: '\e635';
|
210
|
-
$ax-icon-arrow-turn-right-after: '';
|
211
|
-
|
212
|
-
$ax-icon-arrow-turn-left: '\e632';
|
213
|
-
$ax-icon-arrow-turn-left-after: '';
|
214
|
-
|
215
|
-
$ax-icon-save: '\f0c7';
|
216
|
-
$ax-icon-save-after: '';
|
217
|
-
|
218
|
-
$ax-icon-minimize: '\f068';
|
219
|
-
$ax-icon-minimize-after: '';
|
220
|
-
|
221
|
-
$ax-icon-maximize: '\f31d';
|
222
|
-
$ax-icon-maximize-after: '';
|
223
|
-
|
224
|
-
$ax-icon-code: '\f121';
|
225
|
-
$ax-icon-code-after: '';
|