@acorex/styles 21.0.0-next.6 → 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.
Files changed (76) hide show
  1. package/components/{_action-item.scss → _action-item.css} +19 -27
  2. package/components/{_actionsheet.scss → _actionsheet.css} +10 -3
  3. package/components/{_check-box.scss → _check-box.css} +8 -17
  4. package/components/{_drop-down.scss → _drop-down.css} +27 -15
  5. package/components/_editor-container.css +306 -0
  6. package/components/{_list.scss → _list.css} +82 -42
  7. package/components/{_radio.scss → _radio.css} +16 -18
  8. package/components/{_table.scss → _table.css} +62 -19
  9. package/components/{_uploader.scss → _uploader.css} +13 -6
  10. package/components/index.css +11 -0
  11. package/icons/fontawesome/_variables.css +229 -0
  12. package/icons/fontawesome/index.css +555 -0
  13. package/icons/huge/huge-bulk/_variables.css +211 -0
  14. package/icons/huge/huge-bulk/index.css +520 -0
  15. package/icons/huge/huge-duotone/_variables.css +211 -0
  16. package/icons/huge/huge-duotone/index.css +517 -0
  17. package/icons/huge/huge-solid-rounded/_variables.css +211 -0
  18. package/icons/huge/huge-solid-rounded/index.css +504 -0
  19. package/icons/huge/huge-solid-sharp/_variables.css +213 -0
  20. package/icons/huge/huge-solid-sharp/index.css +517 -0
  21. package/icons/huge/huge-solid-standard/_variables.css +211 -0
  22. package/icons/huge/huge-solid-standard/index.css +516 -0
  23. package/icons/huge/huge-stroke-rounded/_variables.css +211 -0
  24. package/icons/huge/huge-stroke-rounded/index.css +515 -0
  25. package/icons/huge/huge-stroke-sharp/_variables.css +142 -0
  26. package/icons/huge/huge-stroke-sharp/index.css +515 -0
  27. package/icons/huge/huge-stroke-standard/_variables.css +141 -0
  28. package/icons/huge/huge-stroke-standard/index.css +515 -0
  29. package/icons/huge/huge-twotone/_variables.css +211 -0
  30. package/icons/huge/huge-twotone/index.css +516 -0
  31. package/icons/material/_variables.css +229 -0
  32. package/icons/material/index.css +573 -0
  33. package/index.css +25 -0
  34. package/package.json +1 -1
  35. package/tailwind-base.js +0 -4
  36. package/themes/{default.scss → default copy.scss } +6 -9
  37. package/themes/default.css +973 -0
  38. package/base/_preflight.scss +0 -424
  39. package/base/index.scss +0 -15
  40. package/components/_editor-container.scss +0 -293
  41. package/components/index.scss +0 -11
  42. package/generators/index.js +0 -1
  43. package/generators/tailwind-class-generator.js +0 -68
  44. package/icons/fontawesome/_variables.scss +0 -228
  45. package/icons/fontawesome/index.scss +0 -714
  46. package/icons/huge/huge-bulk/_variables.scss +0 -209
  47. package/icons/huge/huge-bulk/index.scss +0 -656
  48. package/icons/huge/huge-duotone/_variables.scss +0 -209
  49. package/icons/huge/huge-duotone/index.scss +0 -657
  50. package/icons/huge/huge-solid-rounded/_variables.scss +0 -209
  51. package/icons/huge/huge-solid-rounded/index.scss +0 -643
  52. package/icons/huge/huge-solid-sharp/_variables.scss +0 -209
  53. package/icons/huge/huge-solid-sharp/index.scss +0 -656
  54. package/icons/huge/huge-solid-standard/_variables.scss +0 -209
  55. package/icons/huge/huge-solid-standard/index.scss +0 -656
  56. package/icons/huge/huge-stroke-rounded/_variables.scss +0 -209
  57. package/icons/huge/huge-stroke-rounded/index.scss +0 -656
  58. package/icons/huge/huge-stroke-sharp/_variables.scss +0 -209
  59. package/icons/huge/huge-stroke-sharp/index.scss +0 -656
  60. package/icons/huge/huge-stroke-standard/_variables.scss +0 -209
  61. package/icons/huge/huge-stroke-standard/index.scss +0 -656
  62. package/icons/huge/huge-twotone/_variables.scss +0 -209
  63. package/icons/huge/huge-twotone/index.scss +0 -656
  64. package/icons/material/_variables.scss +0 -227
  65. package/icons/material/index.scss +0 -718
  66. package/index.scss +0 -7
  67. package/mixins/_editor-looks.scss +0 -32
  68. package/mixins/_media.scss +0 -73
  69. package/mixins/_scroll-bar.scss +0 -35
  70. package/mixins/_util.scss +0 -19
  71. package/mixins/index.scss +0 -4
  72. package/utils/_theme-generator.scss +0 -238
  73. package/utils/_utils.scss +0 -278
  74. package/utils/index.scss +0 -2
  75. /package/components/{_general-button.scss → _general-button.css} +0 -0
  76. /package/components/{_ripple.scss → _ripple.css} +0 -0
@@ -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';
@@ -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,228 +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: '';
226
-
227
- $ax-icon-paragraph: '\f1dd';
228
- $ax-icon-paragraph-after: '';