@acorex/styles 5.3.0 → 5.3.2

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 (22) hide show
  1. package/package.json +1 -1
  2. package/src/components/_alert.scss +11 -6
  3. package/src/components/_collapse.scss +12 -7
  4. package/src/components/_decoration.scss +2 -1
  5. package/src/components/_dialog.scss +5 -5
  6. package/src/components/_drawer.scss +1 -2
  7. package/src/components/_dropdown.scss +2 -1
  8. package/src/components/_list.scss +3 -3
  9. package/src/components/_progress.scss +1 -1
  10. package/src/components/_selection-list.scss +2 -2
  11. package/src/components/_tabs.scss +1 -1
  12. package/src/components/_textarea.scss +2 -0
  13. package/src/components/_toast.scss +2 -6
  14. package/src/components/_treeview.scss +1 -1
  15. package/src/icons/demo-files/demo.css +152 -152
  16. package/src/icons/demo-files/demo.js +30 -30
  17. package/src/icons/demo.html +500 -500
  18. package/src/icons/fonts/acorex-icon.svg +42 -42
  19. package/src/icons/style.css +126 -126
  20. package/src/icons/style.scss +195 -195
  21. package/src/icons/variables.scss +37 -37
  22. package/src/utility/_mixins.scss +2 -2
package/src/icons/style.scss CHANGED
@@ -1,195 +1,195 @@
1
- @import "variables";
2
-
3
- @font-face {
4
- font-family: '#{$icomoon-font-family}';
5
- src: url('#{$icomoon-font-path}/#{$icomoon-font-family}.eot?ymfsk5');
6
- src: url('#{$icomoon-font-path}/#{$icomoon-font-family}.eot?ymfsk5#iefix') format('embedded-opentype'),
7
- url('#{$icomoon-font-path}/#{$icomoon-font-family}.ttf?ymfsk5') format('truetype'),
8
- url('#{$icomoon-font-path}/#{$icomoon-font-family}.woff?ymfsk5') format('woff'),
9
- url('#{$icomoon-font-path}/#{$icomoon-font-family}.svg?ymfsk5##{$icomoon-font-family}') format('svg');
10
- font-weight: normal;
11
- font-style: normal;
12
- font-display: block;
13
- }
14
-
15
- [class^="ax-ic-"], [class*=" ax-ic-"] {
16
- /* use !important to prevent issues with browser extensions that change fonts */
17
- font-family: '#{$icomoon-font-family}' !important;
18
- speak: never;
19
- font-style: normal;
20
- font-weight: normal;
21
- font-variant: normal;
22
- text-transform: none;
23
- line-height: 1;
24
-
25
- /* Better Font Rendering =========== */
26
- -webkit-font-smoothing: antialiased;
27
- -moz-osx-font-smoothing: grayscale;
28
- }
29
-
30
- .ax-ic-star-filled {
31
- &:before {
32
- content: $ax-ic-star-filled;
33
- }
34
- }
35
- .ax-ic-star-half-filled {
36
- &:before {
37
- content: $ax-ic-star-half-filled;
38
- }
39
- }
40
- .ax-ic-star-outline {
41
- &:before {
42
- content: $ax-ic-star-outline;
43
- }
44
- }
45
- .ax-ic-remove {
46
- &:before {
47
- content: $ax-ic-remove;
48
- }
49
- }
50
- .ax-ic-plus {
51
- &:before {
52
- content: $ax-ic-plus;
53
- }
54
- }
55
- .ax-ic-magnify {
56
- &:before {
57
- content: $ax-ic-magnify;
58
- }
59
- }
60
- .ax-ic-arrow-circle {
61
- &:before {
62
- content: $ax-ic-arrow-circle;
63
- }
64
- }
65
- .ax-ic-arrow-circle-fill {
66
- &:before {
67
- content: $ax-ic-arrow-circle-fill;
68
- }
69
- }
70
- .ax-ic-arrow-half {
71
- &:before {
72
- content: $ax-ic-arrow-half;
73
- }
74
- }
75
- .ax-ic-arrow-fill {
76
- &:before {
77
- content: $ax-ic-arrow-fill;
78
- }
79
- }
80
- .ax-ic-arrow {
81
- &:before {
82
- content: $ax-ic-arrow;
83
- }
84
- }
85
- .ax-ic-unfold {
86
- &:before {
87
- content: $ax-ic-unfold;
88
- }
89
- }
90
- .ax-ic-half-arrow {
91
- &:before {
92
- content: $ax-ic-half-arrow;
93
- }
94
- }
95
- .ax-ic-fullscreen {
96
- &:before {
97
- content: $ax-ic-fullscreen;
98
- }
99
- }
100
- .ax-ic-close-fullscreen {
101
- &:before {
102
- content: $ax-ic-close-fullscreen;
103
- }
104
- }
105
- .ax-ic-fold {
106
- &:before {
107
- content: $ax-ic-fold;
108
- }
109
- }
110
- .ax-ic-eye {
111
- &:before {
112
- content: $ax-ic-eye;
113
- }
114
- }
115
- .ax-ic-eye-off {
116
- &:before {
117
- content: $ax-ic-eye-off;
118
- }
119
- }
120
- .ax-ic-calendar {
121
- &:before {
122
- content: $ax-ic-calendar;
123
- }
124
- }
125
- .ax-ic-time {
126
- &:before {
127
- content: $ax-ic-time;
128
- }
129
- }
130
- .ax-ic-check {
131
- &:before {
132
- content: $ax-ic-check;
133
- }
134
- }
135
- .ax-ic-check-filled {
136
- &:before {
137
- content: $ax-ic-check-filled;
138
- }
139
- }
140
- .ax-ic-chevron {
141
- &:before {
142
- content: $ax-ic-chevron;
143
- }
144
- }
145
- .ax-ic-close {
146
- &:before {
147
- content: $ax-ic-close;
148
- }
149
- }
150
- .ax-ic-error-filled {
151
- &:before {
152
- content: $ax-ic-error-filled;
153
- }
154
- }
155
- .ax-ic-chevron-page {
156
- &:before {
157
- content: $ax-ic-chevron-page;
158
- }
159
- }
160
- .ax-ic-info-filled {
161
- &:before {
162
- content: $ax-ic-info-filled;
163
- }
164
- }
165
- .ax-ic-chevron-double {
166
- &:before {
167
- content: $ax-ic-chevron-double;
168
- }
169
- }
170
- .ax-ic-menu {
171
- &:before {
172
- content: $ax-ic-menu;
173
- }
174
- }
175
- .ax-ic-more {
176
- &:before {
177
- content: $ax-ic-more;
178
- }
179
- }
180
- .ax-ic-warning-filled {
181
- &:before {
182
- content: $ax-ic-warning-filled;
183
- }
184
- }
185
- .ax-ic-chevron-page-filled {
186
- &:before {
187
- content: $ax-ic-chevron-page-filled;
188
- }
189
- }
190
- .ax-ic-calendar-today {
191
- &:before {
192
- content: $ax-ic-calendar-today;
193
- }
194
- }
195
-
1
+ @import "variables";
2
+
3
+ @font-face {
4
+ font-family: '#{$icomoon-font-family}';
5
+ src: url('#{$icomoon-font-path}/#{$icomoon-font-family}.eot?ymfsk5');
6
+ src: url('#{$icomoon-font-path}/#{$icomoon-font-family}.eot?ymfsk5#iefix') format('embedded-opentype'),
7
+ url('#{$icomoon-font-path}/#{$icomoon-font-family}.ttf?ymfsk5') format('truetype'),
8
+ url('#{$icomoon-font-path}/#{$icomoon-font-family}.woff?ymfsk5') format('woff'),
9
+ url('#{$icomoon-font-path}/#{$icomoon-font-family}.svg?ymfsk5##{$icomoon-font-family}') format('svg');
10
+ font-weight: normal;
11
+ font-style: normal;
12
+ font-display: block;
13
+ }
14
+
15
+ [class^="ax-ic-"], [class*=" ax-ic-"] {
16
+ /* use !important to prevent issues with browser extensions that change fonts */
17
+ font-family: '#{$icomoon-font-family}' !important;
18
+ speak: never;
19
+ font-style: normal;
20
+ font-weight: normal;
21
+ font-variant: normal;
22
+ text-transform: none;
23
+ line-height: 1;
24
+
25
+ /* Better Font Rendering =========== */
26
+ -webkit-font-smoothing: antialiased;
27
+ -moz-osx-font-smoothing: grayscale;
28
+ }
29
+
30
+ .ax-ic-star-filled {
31
+ &:before {
32
+ content: $ax-ic-star-filled;
33
+ }
34
+ }
35
+ .ax-ic-star-half-filled {
36
+ &:before {
37
+ content: $ax-ic-star-half-filled;
38
+ }
39
+ }
40
+ .ax-ic-star-outline {
41
+ &:before {
42
+ content: $ax-ic-star-outline;
43
+ }
44
+ }
45
+ .ax-ic-remove {
46
+ &:before {
47
+ content: $ax-ic-remove;
48
+ }
49
+ }
50
+ .ax-ic-plus {
51
+ &:before {
52
+ content: $ax-ic-plus;
53
+ }
54
+ }
55
+ .ax-ic-magnify {
56
+ &:before {
57
+ content: $ax-ic-magnify;
58
+ }
59
+ }
60
+ .ax-ic-arrow-circle {
61
+ &:before {
62
+ content: $ax-ic-arrow-circle;
63
+ }
64
+ }
65
+ .ax-ic-arrow-circle-fill {
66
+ &:before {
67
+ content: $ax-ic-arrow-circle-fill;
68
+ }
69
+ }
70
+ .ax-ic-arrow-half {
71
+ &:before {
72
+ content: $ax-ic-arrow-half;
73
+ }
74
+ }
75
+ .ax-ic-arrow-fill {
76
+ &:before {
77
+ content: $ax-ic-arrow-fill;
78
+ }
79
+ }
80
+ .ax-ic-arrow {
81
+ &:before {
82
+ content: $ax-ic-arrow;
83
+ }
84
+ }
85
+ .ax-ic-unfold {
86
+ &:before {
87
+ content: $ax-ic-unfold;
88
+ }
89
+ }
90
+ .ax-ic-half-arrow {
91
+ &:before {
92
+ content: $ax-ic-half-arrow;
93
+ }
94
+ }
95
+ .ax-ic-fullscreen {
96
+ &:before {
97
+ content: $ax-ic-fullscreen;
98
+ }
99
+ }
100
+ .ax-ic-close-fullscreen {
101
+ &:before {
102
+ content: $ax-ic-close-fullscreen;
103
+ }
104
+ }
105
+ .ax-ic-fold {
106
+ &:before {
107
+ content: $ax-ic-fold;
108
+ }
109
+ }
110
+ .ax-ic-eye {
111
+ &:before {
112
+ content: $ax-ic-eye;
113
+ }
114
+ }
115
+ .ax-ic-eye-off {
116
+ &:before {
117
+ content: $ax-ic-eye-off;
118
+ }
119
+ }
120
+ .ax-ic-calendar {
121
+ &:before {
122
+ content: $ax-ic-calendar;
123
+ }
124
+ }
125
+ .ax-ic-time {
126
+ &:before {
127
+ content: $ax-ic-time;
128
+ }
129
+ }
130
+ .ax-ic-check {
131
+ &:before {
132
+ content: $ax-ic-check;
133
+ }
134
+ }
135
+ .ax-ic-check-filled {
136
+ &:before {
137
+ content: $ax-ic-check-filled;
138
+ }
139
+ }
140
+ .ax-ic-chevron {
141
+ &:before {
142
+ content: $ax-ic-chevron;
143
+ }
144
+ }
145
+ .ax-ic-close {
146
+ &:before {
147
+ content: $ax-ic-close;
148
+ }
149
+ }
150
+ .ax-ic-error-filled {
151
+ &:before {
152
+ content: $ax-ic-error-filled;
153
+ }
154
+ }
155
+ .ax-ic-chevron-page {
156
+ &:before {
157
+ content: $ax-ic-chevron-page;
158
+ }
159
+ }
160
+ .ax-ic-info-filled {
161
+ &:before {
162
+ content: $ax-ic-info-filled;
163
+ }
164
+ }
165
+ .ax-ic-chevron-double {
166
+ &:before {
167
+ content: $ax-ic-chevron-double;
168
+ }
169
+ }
170
+ .ax-ic-menu {
171
+ &:before {
172
+ content: $ax-ic-menu;
173
+ }
174
+ }
175
+ .ax-ic-more {
176
+ &:before {
177
+ content: $ax-ic-more;
178
+ }
179
+ }
180
+ .ax-ic-warning-filled {
181
+ &:before {
182
+ content: $ax-ic-warning-filled;
183
+ }
184
+ }
185
+ .ax-ic-chevron-page-filled {
186
+ &:before {
187
+ content: $ax-ic-chevron-page-filled;
188
+ }
189
+ }
190
+ .ax-ic-calendar-today {
191
+ &:before {
192
+ content: $ax-ic-calendar-today;
193
+ }
194
+ }
195
+
package/src/icons/variables.scss CHANGED
@@ -1,37 +1,37 @@
1
- $icomoon-font-family: "acorex-icon" !default;
2
- $icomoon-font-path: "fonts" !default;
3
-
4
- $ax-ic-star-filled: "\e91e";
5
- $ax-ic-star-half-filled: "\e91f";
6
- $ax-ic-star-outline: "\e920";
7
- $ax-ic-remove: "\e91b";
8
- $ax-ic-plus: "\e91c";
9
- $ax-ic-magnify: "\e91d";
10
- $ax-ic-arrow-circle: "\e911";
11
- $ax-ic-arrow-circle-fill: "\e912";
12
- $ax-ic-arrow-half: "\e913";
13
- $ax-ic-arrow-fill: "\e914";
14
- $ax-ic-arrow: "\e915";
15
- $ax-ic-unfold: "\e916";
16
- $ax-ic-half-arrow: "\e917";
17
- $ax-ic-fullscreen: "\e918";
18
- $ax-ic-close-fullscreen: "\e919";
19
- $ax-ic-fold: "\e91a";
20
- $ax-ic-eye: "\e901";
21
- $ax-ic-eye-off: "\e902";
22
- $ax-ic-calendar: "\e903";
23
- $ax-ic-time: "\e900";
24
- $ax-ic-check: "\e904";
25
- $ax-ic-check-filled: "\e905";
26
- $ax-ic-chevron: "\e906";
27
- $ax-ic-close: "\e907";
28
- $ax-ic-error-filled: "\e908";
29
- $ax-ic-chevron-page: "\e909";
30
- $ax-ic-info-filled: "\e90a";
31
- $ax-ic-chevron-double: "\e90b";
32
- $ax-ic-menu: "\e90c";
33
- $ax-ic-more: "\e90d";
34
- $ax-ic-warning-filled: "\e90e";
35
- $ax-ic-chevron-page-filled: "\e90f";
36
- $ax-ic-calendar-today: "\e910";
37
-
1
+ $icomoon-font-family: "acorex-icon" !default;
2
+ $icomoon-font-path: "fonts" !default;
3
+
4
+ $ax-ic-star-filled: "\e91e";
5
+ $ax-ic-star-half-filled: "\e91f";
6
+ $ax-ic-star-outline: "\e920";
7
+ $ax-ic-remove: "\e91b";
8
+ $ax-ic-plus: "\e91c";
9
+ $ax-ic-magnify: "\e91d";
10
+ $ax-ic-arrow-circle: "\e911";
11
+ $ax-ic-arrow-circle-fill: "\e912";
12
+ $ax-ic-arrow-half: "\e913";
13
+ $ax-ic-arrow-fill: "\e914";
14
+ $ax-ic-arrow: "\e915";
15
+ $ax-ic-unfold: "\e916";
16
+ $ax-ic-half-arrow: "\e917";
17
+ $ax-ic-fullscreen: "\e918";
18
+ $ax-ic-close-fullscreen: "\e919";
19
+ $ax-ic-fold: "\e91a";
20
+ $ax-ic-eye: "\e901";
21
+ $ax-ic-eye-off: "\e902";
22
+ $ax-ic-calendar: "\e903";
23
+ $ax-ic-time: "\e900";
24
+ $ax-ic-check: "\e904";
25
+ $ax-ic-check-filled: "\e905";
26
+ $ax-ic-chevron: "\e906";
27
+ $ax-ic-close: "\e907";
28
+ $ax-ic-error-filled: "\e908";
29
+ $ax-ic-chevron-page: "\e909";
30
+ $ax-ic-info-filled: "\e90a";
31
+ $ax-ic-chevron-double: "\e90b";
32
+ $ax-ic-menu: "\e90c";
33
+ $ax-ic-more: "\e90d";
34
+ $ax-ic-warning-filled: "\e90e";
35
+ $ax-ic-chevron-page-filled: "\e90f";
36
+ $ax-ic-calendar-today: "\e910";
37
+
package/src/utility/_mixins.scss CHANGED
@@ -41,10 +41,10 @@
41
41
 
42
42
  @mixin control-states($type) {
43
43
  @if ($type == "editor") {
44
- @apply dark:ax-border-white/[0.06] dark:ax-bg-white/[0.06] dark:ax-backdrop-blur-3xl;
44
+ @apply dark:ax-border-white/[0.07] dark:ax-bg-white/[0.07] dark:ax-backdrop-blur-3xl;
45
45
  }
46
46
  @if ($type == "editor-disabled") {
47
- @apply ax-bg-light-100 ax-text-light-fore dark:ax-border-white/[0.06] dark:ax-bg-white/[0.-04] dark:ax-text-opacity-60 ax-cursor-not-allowed;
47
+ @apply ax-bg-light-100 ax-text-light-fore dark:ax-border-white/[0.07] dark:ax-bg-white/[0.-04] dark:ax-text-opacity-60 ax-cursor-not-allowed;
48
48
  }
49
49
  @if ($type == "surface") {
50
50
  @apply dark:ax-bg-default-background dark:ax-border-white/[0.16] dark:ax-shadow-md;