@acorex/styles 4.0.22 → 4.1.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.
Files changed (123) hide show
  1. package/fonts/font-awesome/fa-brands-400.eot +0 -0
  2. package/fonts/font-awesome/fa-brands-400.svg +3570 -0
  3. package/fonts/font-awesome/fa-brands-400.ttf +0 -0
  4. package/fonts/font-awesome/fa-brands-400.woff +0 -0
  5. package/fonts/font-awesome/fa-brands-400.woff2 +0 -0
  6. package/fonts/font-awesome/fa-duotone-900.eot +0 -0
  7. package/fonts/font-awesome/fa-duotone-900.svg +15055 -0
  8. package/fonts/font-awesome/fa-duotone-900.ttf +0 -0
  9. package/fonts/font-awesome/fa-duotone-900.woff +0 -0
  10. package/fonts/font-awesome/fa-duotone-900.woff2 +0 -0
  11. package/fonts/font-awesome/fa-light-300.eot +0 -0
  12. package/fonts/font-awesome/fa-light-300.svg +12330 -0
  13. package/fonts/font-awesome/fa-light-300.ttf +0 -0
  14. package/fonts/font-awesome/fa-light-300.woff +0 -0
  15. package/fonts/font-awesome/fa-light-300.woff2 +0 -0
  16. package/fonts/font-awesome/fa-regular-400.eot +0 -0
  17. package/fonts/font-awesome/fa-regular-400.svg +11256 -0
  18. package/fonts/font-awesome/fa-regular-400.ttf +0 -0
  19. package/fonts/font-awesome/fa-regular-400.woff +0 -0
  20. package/fonts/font-awesome/fa-regular-400.woff2 +0 -0
  21. package/fonts/font-awesome/fa-solid-900.eot +0 -0
  22. package/fonts/font-awesome/fa-solid-900.svg +9588 -0
  23. package/fonts/font-awesome/fa-solid-900.ttf +0 -0
  24. package/fonts/font-awesome/fa-solid-900.woff +0 -0
  25. package/fonts/font-awesome/fa-solid-900.woff2 +0 -0
  26. package/fonts/font-awesome/font-awesome.css +16960 -0
  27. package/package.json +3 -3
  28. package/scss/buttons.scss +64 -0
  29. package/scss/calendar.scss +128 -0
  30. package/scss/checkbox.scss +47 -0
  31. package/scss/context-menu.scss +82 -0
  32. package/scss/data-grid.scss +107 -0
  33. package/scss/drawer.scss +27 -0
  34. package/scss/fieldset.scss +23 -0
  35. package/scss/forms.scss +529 -0
  36. package/scss/list.scss +60 -0
  37. package/scss/master.scss +253 -0
  38. package/scss/menu.scss +481 -0
  39. package/scss/mixin.scss +12 -0
  40. package/scss/page.scss +54 -0
  41. package/scss/progress.scss +11 -0
  42. package/scss/selection-list.scss +116 -0
  43. package/scss/style.scss +49 -0
  44. package/scss/tab-strip.scss +30 -0
  45. package/scss/tab.scss +33 -0
  46. package/scss/toast.scss +24 -0
  47. package/scss/tooltip.scss +53 -0
  48. package/scss/treeview.scss +133 -0
  49. package/scss/upload.scss +169 -0
  50. package/scss/variables.scss +106 -0
  51. package/index.scss +0 -48
  52. package/scss/ax-icon/fonts/acorex.eot +0 -0
  53. package/scss/ax-icon/fonts/acorex.svg +0 -1434
  54. package/scss/ax-icon/fonts/acorex.ttf +0 -0
  55. package/scss/ax-icon/fonts/acorex.woff +0 -0
  56. package/scss/ax-icon/selection.json +0 -1
  57. package/scss/ax-icon/style.scss +0 -7218
  58. package/scss/ax-icon/variables.scss +0 -1428
  59. package/scss/bases/accessiblity.scss +0 -38
  60. package/scss/bases/background.scss +0 -76
  61. package/scss/bases/border.scss +0 -453
  62. package/scss/bases/effects.scss +0 -56
  63. package/scss/bases/filter.scss +0 -184
  64. package/scss/bases/flexbox-and-grid.scss +0 -254
  65. package/scss/bases/interactivity.scss +0 -42
  66. package/scss/bases/layout.scss +0 -207
  67. package/scss/bases/root.scss +0 -53
  68. package/scss/bases/sizing.scss +0 -43
  69. package/scss/bases/skeleton.scss +0 -30
  70. package/scss/bases/spacing.scss +0 -245
  71. package/scss/bases/svg.scss +0 -18
  72. package/scss/bases/table.scss +0 -15
  73. package/scss/bases/transform.scss +0 -114
  74. package/scss/bases/transition-and-animation.scss +0 -116
  75. package/scss/bases/typography.scss +0 -210
  76. package/scss/components/alert.scss +0 -131
  77. package/scss/components/badge.scss +0 -6
  78. package/scss/components/button.scss +0 -264
  79. package/scss/components/calendar.scss +0 -120
  80. package/scss/components/carousel.scss +0 -67
  81. package/scss/components/checkbox.scss +0 -36
  82. package/scss/components/datapager.scss +0 -80
  83. package/scss/components/datepicker.scss +0 -8
  84. package/scss/components/dialog.scss +0 -61
  85. package/scss/components/drawer.scss +0 -78
  86. package/scss/components/dropdown.scss +0 -35
  87. package/scss/components/editor-container.scss +0 -105
  88. package/scss/components/input.scss +0 -47
  89. package/scss/components/label.scss +0 -6
  90. package/scss/components/list.scss +0 -55
  91. package/scss/components/loading.scss +0 -47
  92. package/scss/components/popup.scss +0 -103
  93. package/scss/components/radio.scss +0 -36
  94. package/scss/components/selectbox.scss +0 -39
  95. package/scss/components/selection-list.scss +0 -22
  96. package/scss/components/side-menu.scss +0 -44
  97. package/scss/components/switch.scss +0 -178
  98. package/scss/components/table.scss +0 -22
  99. package/scss/components/tabs.scss +0 -115
  100. package/scss/components/text-box.scss +0 -4
  101. package/scss/components/toast.scss +0 -82
  102. package/scss/components/tooltip.scss +0 -42
  103. package/variables/bases/_accessiblity.scss +0 -22
  104. package/variables/bases/_background.scss +0 -57
  105. package/variables/bases/_border.scss +0 -106
  106. package/variables/bases/_color.scss +0 -135
  107. package/variables/bases/_common.scss +0 -6
  108. package/variables/bases/_effects.scss +0 -36
  109. package/variables/bases/_filter.scss +0 -62
  110. package/variables/bases/_flexbox-and-grid.scss +0 -138
  111. package/variables/bases/_interactivity.scss +0 -31
  112. package/variables/bases/_layout.scss +0 -102
  113. package/variables/bases/_root.scss +0 -70
  114. package/variables/bases/_sizing.scss +0 -322
  115. package/variables/bases/_spacing.scss +0 -38
  116. package/variables/bases/_svg.scss +0 -1
  117. package/variables/bases/_table.scss +0 -2
  118. package/variables/bases/_transform.scss +0 -88
  119. package/variables/bases/_transition-and-animation.scss +0 -26
  120. package/variables/bases/_typography.scss +0 -191
  121. package/variables/components/_button.scss +0 -0
  122. package/variables/components/_editor-container.scss +0 -5
  123. package/variables/components/_input.scss +0 -0
package/scss/master.scss ADDED
@@ -0,0 +1,253 @@
1
+ @import "./variables.scss";
2
+ :root {
3
+ --ax-border-color: #d1d5db;
4
+ --ax-border-dark-color: rgba(34, 36, 38, 0.3);
5
+ --ax-base-size: 8px;
6
+ --ax-base-ratio: 5;
7
+ // Create Sizes
8
+ @each $name, $size in $sizes {
9
+ @if type-of($size) == "map" {
10
+ @each $subname, $variant in $size {
11
+ @if $name== "" {
12
+ --ax-size-#{$name}#{$subname}: #{$variant};
13
+ } @else {
14
+ --ax-size-#{$name}-#{$subname}: #{$variant};
15
+ }
16
+ }
17
+ }
18
+ }
19
+ // Create Colors
20
+ @each $name, $color in $colors {
21
+ @if type-of($color) == "map" {
22
+ @each $subname, $variant in $color {
23
+ @if $subname== "" {
24
+ --ax-#{$name}-#{$color-suffix}: #{$variant};
25
+ } @else {
26
+ --ax-#{$name}-#{$subname}-#{$color-suffix}: #{$variant};
27
+ }
28
+ }
29
+ } @else {
30
+ --ax-#{$name}-#{$color-suffix}: #{$color};
31
+ }
32
+ }
33
+ }
34
+
35
+ // Sizes
36
+ .ax {
37
+ &.form-control {
38
+ height: calc(var(--ax-base-size) * var(--ax-base-ratio)) !important;
39
+ padding: 0 1rem;
40
+ font-size: 1rem;
41
+ font-weight: 500;
42
+ &.sm {
43
+ height: calc((var(--ax-base-size) * var(--ax-base-ratio)) - 10px) !important;
44
+ padding: 0 0.3rem;
45
+ font-size: 0.875rem;
46
+ &.ax-button-icon {
47
+ padding: 0.3rem;
48
+ }
49
+ }
50
+ &.md {
51
+ height: calc(var(--ax-base-size) * var(--ax-base-ratio)) !important;
52
+ padding: 0 1rem;
53
+ font-size: 1rem;
54
+ font-weight: 500;
55
+ &.ax-button-icon {
56
+ padding: 0.7rem;
57
+ }
58
+ }
59
+ &.lg {
60
+ height: calc((var(--ax-base-size) * var(--ax-base-ratio)) + 10px) !important;
61
+ padding: 0 0.8rem;
62
+ font-size: 1.5rem;
63
+ &.ax-button-icon {
64
+ padding: 0.9rem;
65
+ }
66
+ }
67
+ }
68
+ }
69
+
70
+ // @each $name,
71
+ // $size in $sizes {
72
+ // .ax {
73
+ // @if type-of($size)=="map" {
74
+ // @each $subname,
75
+ // $variant in $size {
76
+ // @if $name=="" {
77
+ // &.#{$subname} {
78
+ // font-size: var(--ax-size-#{$subname}) !important;
79
+ // }
80
+ // }
81
+ // }
82
+ // }
83
+ // }
84
+ // }
85
+ @each $name, $size in $sizes {
86
+ @if type-of($size) == "map" {
87
+ @each $subname, $variant in $size {
88
+ @if $name== "" {
89
+ .ax-mrg-#{$subname} {
90
+ margin: var(--ax-size-#{$subname}) !important;
91
+ }
92
+ .ax-pad-#{$subname} {
93
+ padding: var(--ax-size-#{$subname}) !important;
94
+ }
95
+ }
96
+ }
97
+ }
98
+ }
99
+
100
+ // Create Classes
101
+ @each $name, $color in $colors {
102
+ .ax {
103
+ @if type-of($color) == "map" {
104
+ @each $subname, $variant in $color {
105
+ @if $subname== "" {
106
+ &.bg-#{$name} {
107
+ background-color: var(--ax-#{$name}-#{$color-suffix});
108
+ }
109
+ &.bg-light-#{$name} {
110
+ background-color: var(--ax-#{$name}-light-#{$color-suffix});
111
+ }
112
+ &.bg-dark-#{$name} {
113
+ background-color: var(--ax-#{$name}-dark-#{$color-suffix});
114
+ }
115
+ &.bg-lighten-#{$name} {
116
+ background-color: var(--ax-#{$name}-trans-light-#{$color-suffix});
117
+ }
118
+ &.text-#{$name} {
119
+ color: var(--ax-#{$name}-#{$color-suffix});
120
+ }
121
+ &.lighten-#{$name} {
122
+ color: var(--ax-#{$name}-#{$color-suffix});
123
+ background-color: var(--ax-#{$name}-trans-light-#{$color-suffix});
124
+ }
125
+ &.#{$name} {
126
+ border: 1px solid;
127
+ border-color: var(--ax-#{$name}-#{$color-suffix});
128
+ @if ($name == "light") {
129
+ background: var(--ax-white-#{$color-suffix});
130
+ color: var(--ax-dark-#{$color-suffix});
131
+ border-color: var(--ax-border-color);
132
+ } @else {
133
+ background: var(--ax-#{$name}-#{$color-suffix});
134
+ color: var(--ax-#{$name}-fore-#{$color-suffix});
135
+ }
136
+ &:hover,
137
+ &:focus {
138
+ background: var(--ax-#{$name}-dark-#{$color-suffix});
139
+ margin-right: calc(0.75rem * var(--tw-space-x-reverse));
140
+ margin-left: calc(0.75rem * calc(1 - var(--tw-space-x-reverse)));
141
+ }
142
+ &:active {
143
+ background: var(--ax-#{$name}-light-#{$color-suffix});
144
+ }
145
+ &.selected {
146
+ background: var(--ax-#{$name}-dark-#{$color-suffix});
147
+ }
148
+ &.disabled {
149
+ cursor: not-allowed;
150
+ background: var(--ax-gray-light-color) !important;
151
+ color: var(--ax-gray-fore-color) !important;
152
+ border-color: var(--ax-gray-light-color) !important;
153
+ }
154
+ &.twotone {
155
+ background: var(--ax-#{$name}-trans-light-#{$color-suffix});
156
+ border-color: transparent;
157
+
158
+ @if ($name == "light") {
159
+ color: var(--ax-#{$name}-fore-#{$color-suffix});
160
+ } @else {
161
+ color: var(--ax-#{$name}-#{$color-suffix});
162
+ }
163
+
164
+ &:hover:not(.disabled),
165
+ &:focus:not(.disabled)
166
+ {
167
+ background: var(--ax-#{$name}-light-#{$color-suffix});
168
+ color: var(--ax-#{$name}-fore-#{$color-suffix});
169
+ }
170
+ &:active {
171
+ background: var(--ax-#{$name}-dark-#{$color-suffix});
172
+ color: var(--ax-#{$name}-fore-#{$color-suffix});
173
+ }
174
+ &.selected {
175
+ background: var(--ax-#{$name}-dark-#{$color-suffix});
176
+ color: var(--ax-#{$name}-fore-#{$color-suffix});
177
+ }
178
+ }
179
+ &.outline {
180
+ background: transparent;
181
+ border: 1px solid;
182
+ border-color: var(--ax-#{$name}-#{$color-suffix});
183
+ @if ($name == "light") {
184
+ color: var(--ax-#{$name}-fore-#{$color-suffix});
185
+ } @else {
186
+ color: var(--ax-#{$name}-#{$color-suffix});
187
+ }
188
+
189
+ &:hover:not(.disabled),
190
+ &:focus:not(.disabled) {
191
+ background: var(--ax-#{$name}-#{$color-suffix});
192
+ color: var(--ax-#{$name}-fore-#{$color-suffix});
193
+ }
194
+ &:active {
195
+ background: var(--ax-#{$name}-light-#{$color-suffix});
196
+ color: var(--ax-#{$name}-fore-#{$color-suffix});
197
+ border-color: var(--ax-#{$name}-light-#{$color-suffix});
198
+ }
199
+ &.selected {
200
+ background: var(--ax-#{$name}-dark-#{$color-suffix});
201
+ color: var(--ax-#{$name}-fore-#{$color-suffix});
202
+ border-color: var(--ax-#{$name}-dark-#{$color-suffix});
203
+ }
204
+ }
205
+ &.blank {
206
+ background: transparent;
207
+ border-color: transparent;
208
+
209
+ @if ($name == "light") {
210
+ color: var(--ax-#{$name}-fore-#{$color-suffix});
211
+ } @else {
212
+ color: var(--ax-#{$name}-#{$color-suffix});
213
+ }
214
+
215
+ &:hover,
216
+ &:focus {
217
+ @if ($name == "light") {
218
+ background: var(--ax-#{$name}-trans-light-#{$color-suffix});
219
+ color: var(--ax-#{$name}-fore-#{$color-suffix});
220
+ } @else {
221
+ background: var(--ax-#{$name}-trans-light-#{$color-suffix});
222
+ color: var(--ax-#{$name}-#{$color-suffix});
223
+ }
224
+ }
225
+ &:active {
226
+ @if ($name == "light") {
227
+ background: var(--ax-#{$name}-trans-dark-#{$color-suffix});
228
+ color: var(--ax-#{$name}-fore-#{$color-suffix});
229
+ } @else {
230
+ background: var(--ax-#{$name}-trans-dark-#{$color-suffix});
231
+ color: var(--ax-#{$name}-#{$color-suffix});
232
+ }
233
+ }
234
+ &.selected {
235
+ @if ($name == "light") {
236
+ background: var(--ax-#{$name}-trans-dark-#{$color-suffix});
237
+ color: var(--ax-#{$name}-fore-#{$color-suffix});
238
+ } @else {
239
+ background: var(--ax-#{$name}-trans-dark-#{$color-suffix});
240
+ color: var(--ax-#{$name}-#{$color-suffix});
241
+ }
242
+ }
243
+ }
244
+ &.panel {
245
+ color: var(--ax-#{$name}-fore-#{$color-suffix});
246
+ background-color: var(--ax-#{$name}-#{$color-suffix});
247
+ }
248
+ }
249
+ }
250
+ }
251
+ }
252
+ }
253
+ }