claritas-web-framework 6.4.26 → 7.0.1

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 (78) hide show
  1. package/dist/index.css +1 -1
  2. package/index.js +1 -1
  3. package/package.json +13 -22
  4. package/sass/modules/_modal.scss +1 -0
  5. package/js/polyfills/customevent.js +0 -16
  6. package/postcss.config.js +0 -42
  7. package/styles/helpers/container.css +0 -21
  8. package/styles/helpers/embed.css +0 -70
  9. package/styles/helpers/grid.css +0 -64
  10. package/styles/helpers/image.css +0 -5
  11. package/styles/helpers/link.css +0 -20
  12. package/styles/helpers/screen-readers.css +0 -22
  13. package/styles/helpers/wrap.css +0 -5
  14. package/styles/helpers.css +0 -7
  15. package/styles/index.css +0 -6
  16. package/styles/mixins/caret.css +0 -32
  17. package/styles/mixins/clearfix.css +0 -7
  18. package/styles/mixins/group.css +0 -78
  19. package/styles/mixins/helpers/container.css +0 -12
  20. package/styles/mixins/helpers/grid.css +0 -20
  21. package/styles/mixins/helpers/link.css +0 -18
  22. package/styles/mixins/helpers/wrap.css +0 -7
  23. package/styles/mixins/modules/button.css +0 -91
  24. package/styles/mixins/modules/card.css +0 -29
  25. package/styles/mixins/modules/close.css +0 -42
  26. package/styles/mixins/modules/list.css +0 -24
  27. package/styles/mixins/modules/pill.css +0 -43
  28. package/styles/mixins/modules/table.css +0 -75
  29. package/styles/mixins.css +0 -13
  30. package/styles/modules/alert.css +0 -85
  31. package/styles/modules/breadcrumbs.css +0 -41
  32. package/styles/modules/button.css +0 -151
  33. package/styles/modules/card.css +0 -80
  34. package/styles/modules/close.css +0 -5
  35. package/styles/modules/details.css +0 -61
  36. package/styles/modules/dialog.css +0 -82
  37. package/styles/modules/dropdown.css +0 -126
  38. package/styles/modules/form/checkbox.css +0 -99
  39. package/styles/modules/form/file.css +0 -119
  40. package/styles/modules/form/form-field-group.css +0 -71
  41. package/styles/modules/form/output.css +0 -5
  42. package/styles/modules/form/progress.css +0 -57
  43. package/styles/modules/form/radio.css +0 -49
  44. package/styles/modules/form/range.css +0 -105
  45. package/styles/modules/form/select.css +0 -25
  46. package/styles/modules/form/text.css +0 -19
  47. package/styles/modules/form.css +0 -176
  48. package/styles/modules/list.css +0 -99
  49. package/styles/modules/loader.css +0 -229
  50. package/styles/modules/nav.css +0 -99
  51. package/styles/modules/pill.css +0 -72
  52. package/styles/modules/table.css +0 -21
  53. package/styles/modules/tabs.css +0 -101
  54. package/styles/modules/tag.css +0 -118
  55. package/styles/modules/tile.css +0 -114
  56. package/styles/modules.css +0 -26
  57. package/styles/reboot.css +0 -403
  58. package/styles/utilities/align.css +0 -5
  59. package/styles/utilities/border.css +0 -63
  60. package/styles/utilities/colors.css +0 -65
  61. package/styles/utilities/display.css +0 -45
  62. package/styles/utilities/flex.css +0 -131
  63. package/styles/utilities/float.css +0 -15
  64. package/styles/utilities/order.css +0 -33
  65. package/styles/utilities/overflow.css +0 -31
  66. package/styles/utilities/pointer-events.css +0 -5
  67. package/styles/utilities/position.css +0 -79
  68. package/styles/utilities/shadow.css +0 -7
  69. package/styles/utilities/size.css +0 -123
  70. package/styles/utilities/spacing.css +0 -866
  71. package/styles/utilities/tooltip.css +0 -127
  72. package/styles/utilities/translate.css +0 -15
  73. package/styles/utilities/typography.css +0 -74
  74. package/styles/utilities/visibility.css +0 -14
  75. package/styles/utilities/zindex.css +0 -7
  76. package/styles/utilities.css +0 -18
  77. package/styles/vars.css +0 -159
  78. /package/sass/{_index.scss → index.scss} +0 -0
package/styles/reboot.css DELETED
@@ -1,403 +0,0 @@
1
- *,
2
- *::after,
3
- *::before {
4
- box-sizing: border-box;
5
- }
6
-
7
- html {
8
- font-family: sans-serif;
9
- line-height: 1.15;
10
- scroll-behavior: smooth;
11
- -webkit-text-size-adjust: 100%;
12
- -webkit-tap-highlight-color: var(--transparent);
13
- }
14
-
15
- article,
16
- aside,
17
- figcaption,
18
- figure,
19
- footer,
20
- header,
21
- hgroup,
22
- main,
23
- nav,
24
- section {
25
- display: block;
26
- }
27
-
28
- body {
29
- margin: 0;
30
- font-family: var(--font-family-base);
31
- font-size: var(--font-size-base);
32
- font-weight: 400;
33
- line-height: 1.5;
34
- text-align: left;
35
- color: var(--body-color);
36
- background-color: var(--body-background);
37
- font-variant-numeric: tabular-nums;
38
- font-variant-ligatures: no-common-ligatures;
39
- }
40
-
41
- .clearfix::after {
42
- display: block;
43
- clear: both;
44
- content: "";
45
- }
46
-
47
- [tabindex="-1"]:focus {
48
- outline: 0 !important;
49
- }
50
-
51
- ::selection {
52
- background-color: var(--primary);
53
- text-shadow: none !important;
54
- color: var(--white) !important;
55
- }
56
-
57
- p {
58
- margin-top: 0;
59
- margin-bottom: var(--spacer);
60
- }
61
-
62
- abbr[data-original-title],
63
- abbr[title] {
64
- text-decoration: underline dotted;
65
- cursor: help;
66
- border-bottom: 0;
67
- }
68
-
69
- address {
70
- margin-bottom: var(--spacer);
71
- font-style: normal;
72
- line-height: inherit;
73
- }
74
-
75
- dl,
76
- ol,
77
- ul {
78
- margin-top: 0;
79
- margin-bottom: var(--spacer);
80
- }
81
-
82
- ol ol,
83
- ol ul,
84
- ul ol,
85
- ul ul {
86
- margin-bottom: 0;
87
- }
88
-
89
- dt {
90
- font-weight: 700;
91
- }
92
-
93
- dd {
94
- margin-left: 0;
95
- margin-bottom: calc(var(--spacer) * 0.5);
96
- }
97
-
98
- blockquote {
99
- margin: 0 0 var(--spacer);
100
- }
101
-
102
- b,
103
- strong {
104
- font-weight: 700;
105
- }
106
-
107
- sub,
108
- sup {
109
- position: relative;
110
- font-size: var(--font-size-small);
111
- line-height: 0;
112
- vertical-align: baseline;
113
- }
114
-
115
- sub {
116
- bottom: calc(var(--spacer) * -0.25);
117
- }
118
-
119
- sup {
120
- top: calc(var(--spacer) * -0.5);
121
- }
122
-
123
- a {
124
- cursor: pointer;
125
- text-decoration: none;
126
- color: var(--link-color);
127
-
128
- &:hover {
129
- text-decoration: underline;
130
- color: color-mod(var(--link-color) shade(15%));
131
- }
132
-
133
- &:not([href]):not([tabindex]) {
134
- text-decoration: none;
135
-
136
- &:focus,
137
- &:hover {
138
- text-decoration: none;
139
- outline: 0;
140
- }
141
- }
142
- }
143
-
144
- code,
145
- kbd,
146
- pre,
147
- samp {
148
- font-family: var(--font-family-monospace);
149
- font-size: var(--font-size-base);
150
- }
151
-
152
- pre {
153
- margin-top: 0;
154
- margin-bottom: var(--spacer);
155
- overflow: auto;
156
- }
157
-
158
- figure {
159
- margin: 0 0 var(--spacer);
160
- }
161
-
162
- img {
163
- vertical-align: middle;
164
- border-style: none;
165
- }
166
-
167
- svg {
168
- overflow: hidden;
169
- vertical-align: middle;
170
- }
171
-
172
- table {
173
- border-collapse: collapse;
174
- border-spacing: 0;
175
- }
176
-
177
- caption {
178
- padding-top: calc(var(--spacer) * 0.75);
179
- padding-bottom: calc(var(--spacer) * 0.75);
180
- text-align: left;
181
- caption-side: bottom;
182
- }
183
-
184
- td,
185
- th {
186
- background-clip: padding-box;
187
- }
188
-
189
- th {
190
- text-align: inherit;
191
- }
192
-
193
- label {
194
- display: inline-block;
195
- }
196
-
197
- button {
198
- border-radius: 0;
199
-
200
- &:focus {
201
- outline: 0 none;
202
- }
203
- }
204
-
205
- button,
206
- input,
207
- optgroup,
208
- select,
209
- textarea {
210
- margin: 0;
211
- font-family: inherit;
212
- font-size: inherit;
213
- line-height: inherit;
214
- }
215
-
216
- button,
217
- input {
218
- overflow: visible;
219
- }
220
-
221
- button,
222
- select {
223
- text-transform: none;
224
- }
225
-
226
- select {
227
- word-wrap: normal;
228
- }
229
-
230
- [type="button"],
231
- [type="reset"],
232
- [type="submit"],
233
- button {
234
- appearance: button;
235
- }
236
-
237
- [type="button"]:not(:disabled),
238
- [type="reset"]:not(:disabled),
239
- [type="submit"]:not(:disabled),
240
- button:not(:disabled) {
241
- cursor: pointer;
242
- }
243
-
244
- input[type="radio"],
245
- input[type="checkbox"] {
246
- box-sizing: border-box;
247
- padding: 0;
248
- }
249
-
250
- input[type="date"],
251
- input[type="time"],
252
- input[type="datetime-local"],
253
- input[type="month"] {
254
- appearance: listbox;
255
- padding-inline-start: calc(0.375em - 1px);
256
- }
257
-
258
- textarea {
259
- overflow: auto;
260
- resize: vertical;
261
- height: auto;
262
- }
263
-
264
- fieldset {
265
- min-width: 0;
266
- padding: 0;
267
- margin: 0;
268
- border: 0;
269
- }
270
-
271
- legend {
272
- display: block;
273
- width: 100%;
274
- max-width: 100%;
275
- padding: 0;
276
- margin-bottom: calc(var(--spacer) * 0.5);
277
- font-size: var(--font-size-1);
278
- line-height: inherit;
279
- color: inherit;
280
- white-space: normal;
281
- }
282
-
283
- progress {
284
- vertical-align: baseline;
285
- }
286
-
287
- [type="number"]::-webkit-inner-spin-button,
288
- [type="number"]::-webkit-outer-spin-button {
289
- height: auto;
290
- }
291
-
292
- ::-webkit-file-upload-button {
293
- font: inherit;
294
- appearance: button;
295
- }
296
-
297
- output {
298
- display: inline-block;
299
- }
300
-
301
- summary {
302
- display: list-item;
303
- cursor: pointer;
304
- }
305
-
306
- template {
307
- display: none;
308
- }
309
-
310
- [hidden] {
311
- display: none !important;
312
- }
313
-
314
- h1,
315
- h2,
316
- h3,
317
- h4,
318
- h5,
319
- h6,
320
- .h1,
321
- .h2,
322
- .h3,
323
- .h4,
324
- .h5,
325
- .h6 {
326
- margin-top: 0;
327
- margin-bottom: calc(var(--spacer) * 0.5);
328
- font-weight: var(--header-weight);
329
- line-height: 1.5;
330
-
331
- & small {
332
- font-weight: normal;
333
- }
334
- }
335
-
336
- h1,
337
- .h1 {
338
- font-size: var(--font-size-1);
339
- }
340
-
341
- h2,
342
- .h2 {
343
- font-size: var(--font-size-2);
344
- }
345
-
346
- h3,
347
- .h3 {
348
- font-size: var(--font-size-3);
349
- }
350
-
351
- h4,
352
- .h4 {
353
- font-size: var(--font-size-4);
354
- }
355
-
356
- h5,
357
- .h5 {
358
- font-size: var(--font-size-5);
359
- }
360
-
361
- h6,
362
- .h6 {
363
- font-size: var(--font-size-6);
364
- }
365
-
366
- hr,
367
- .hr {
368
- box-sizing: content-box;
369
- height: 0;
370
- width: 100%;
371
- overflow: visible;
372
- margin-top: var(--spacer);
373
- margin-bottom: var(--spacer);
374
- border: 0;
375
- border-top: 1px solid var(--black-transparent-12);
376
- }
377
-
378
- small {
379
- font-size: var(--font-size-small);
380
- }
381
-
382
- mark {
383
- padding: calc(var(--spacer) * 0.2);
384
- background-color: color-mod(var(--warning) a(75%));
385
- }
386
-
387
- button,
388
- input,
389
- select,
390
- textarea {
391
- align-items: center;
392
- border: 1px solid var(--transparent);
393
- border-radius: var(--border-radius);
394
- box-shadow: none;
395
- display: inline-flex;
396
- font-size: var(--font-size-base);
397
- justify-content: flex-start;
398
- line-height: 1.5;
399
- padding: calc(0.375em - 1px) calc(0.625em - 1px);
400
- position: relative;
401
- vertical-align: top;
402
- background-color: var(--transparent);
403
- }
@@ -1,5 +0,0 @@
1
- @each $name in (baseline, top, middle, bottom, text-bottom, text-top) {
2
- .valign--$(name) {
3
- vertical-align: $name !important;
4
- }
5
- }
@@ -1,63 +0,0 @@
1
- .border {
2
- border-width: 1px;
3
- border-style: solid;
4
- border-color: var(--black-transparent-20);
5
- }
6
-
7
- .border--top,
8
- .border-top {
9
- border-top-width: 1px;
10
- border-top-style: solid;
11
- border-top-color: var(--black-transparent-20);
12
- }
13
-
14
- .border--right,
15
- .border-right {
16
- border-right-width: 1px;
17
- border-right-style: solid;
18
- border-right-color: var(--black-transparent-20);
19
- }
20
-
21
- .border--bottom,
22
- .border-bottom {
23
- border-bottom-width: 1px;
24
- border-bottom-style: solid;
25
- border-bottom-color: var(--black-transparent-20);
26
- }
27
-
28
- .border--left,
29
- .border-left {
30
- border-left-width: 1px;
31
- border-left-style: solid;
32
- border-left-color: var(--black-transparent-20);
33
- }
34
-
35
- .border--none {
36
- border: 0 !important;
37
- }
38
-
39
- .border--top-none,
40
- .border-top--none {
41
- border-top: 0 !important;
42
- }
43
-
44
- .border--right-none,
45
- .border-right--none {
46
- border-right: 0 !important;
47
- }
48
-
49
- .border--bottom-none,
50
- .border-bottom--none {
51
- border-bottom: 0 !important;
52
- }
53
-
54
- .border--left-none,
55
- .border-left--none {
56
- border-left: 0 !important;
57
- }
58
-
59
- @each $name in (none, small, medium, large, round) {
60
- .border-radius--$(name) {
61
- border-radius: var(--border-radius-#{$name}) !important;
62
- }
63
- }
@@ -1,65 +0,0 @@
1
- @each $name
2
- in (
3
- white,
4
- black,
5
- light,
6
- medium,
7
- dark,
8
- transparent,
9
- primary,
10
- primary-light,
11
- primary-dark,
12
- secondary,
13
- secondary-light,
14
- secondary-dark,
15
- info,
16
- info-light,
17
- info-dark,
18
- success,
19
- success-light,
20
- success-dark,
21
- warning,
22
- warning-light,
23
- warning-dark,
24
- danger,
25
- danger-light,
26
- danger-dark,
27
- gray-1,
28
- gray-2,
29
- gray-3,
30
- gray-4,
31
- gray-5,
32
- gray-6,
33
- gray-7,
34
- gray-8,
35
- gray-9
36
- )
37
- {
38
- .color--$(name) {
39
- color: var(--#{$name}) !important;
40
-
41
- & a:not(.button) {
42
- color: var(--#{$name}) !important;
43
-
44
- &:hover {
45
- color: color-mod(var(--#{$name}) shade(20%)) !important;
46
- }
47
- }
48
- }
49
-
50
- a.color--$(name):not(.button) {
51
- color: var(--#{$name}) !important;
52
-
53
- &:hover {
54
- color: color-mod(var(--#{$name}) shade(20%)) !important;
55
- }
56
- }
57
-
58
- .background--$(name) {
59
- background-color: var(--#{$name}) !important;
60
- }
61
-
62
- .border--$(name) {
63
- border-color: var(--#{$name}) !important;
64
- }
65
- }
@@ -1,45 +0,0 @@
1
- @each $name
2
- in (
3
- initial,
4
- none,
5
- inline,
6
- inline-block,
7
- block,
8
- table-row,
9
- table-cell,
10
- flex,
11
- inline-flex
12
- )
13
- {
14
- .display--$(name) {
15
- display: $name !important;
16
- }
17
-
18
- @media print {
19
- .display--print-$(name) {
20
- display: $name !important;
21
- }
22
- }
23
- }
24
-
25
- @each $view in mobile, tablet, desktop, widescreen, fullhd {
26
- @each $name
27
- in (
28
- initial,
29
- none,
30
- inline,
31
- inline-block,
32
- block,
33
- table-row,
34
- table-cell,
35
- flex,
36
- inline-flex
37
- )
38
- {
39
- @media (--viewport-$(view)) {
40
- .display--$(view)-$(name) {
41
- display: $name !important;
42
- }
43
- }
44
- }
45
- }
@@ -1,131 +0,0 @@
1
- @each $name in (row, column, row-reverse, column-reverse) {
2
- .flex-direction--$(name) {
3
- flex-direction: $name !important;
4
- }
5
- }
6
-
7
- @each $view in mobile, tablet, desktop, widescreen, fullhd {
8
- @each $name in (row, column, row-reverse, column-reverse) {
9
- @media (--viewport-$(view)) {
10
- .flex-direction--$(view)-$(name) {
11
- flex-direction: $name !important;
12
- }
13
- }
14
- }
15
- }
16
-
17
- @each $name in (wrap, nowrap, wrap-reverse) {
18
- .flex-wrap--$(name) {
19
- flex-wrap: $name !important;
20
- }
21
- }
22
-
23
- @each $view in mobile, tablet, desktop, widescreen, fullhd {
24
- @each $name in (wrap, nowrap, wrap-reverse) {
25
- @media (--viewport-$(view)) {
26
- .flex-wrap--$(view)-$(name) {
27
- flex-wrap: $name !important;
28
- }
29
- }
30
- }
31
- }
32
-
33
- @for $i from 0 through 1 {
34
- .flex-grow--$(i) {
35
- flex-grow: $i !important;
36
- }
37
-
38
- .flex-shrink--$(i) {
39
- flex-shrink: $i !important;
40
- }
41
- }
42
-
43
- @each $view in mobile, tablet, desktop, widescreen, fullhd {
44
- @for $i from 0 through 1 {
45
- @media (--viewport-$(view)) {
46
- .flex-grow--$(view)-$(i) {
47
- flex-grow: $i !important;
48
- }
49
-
50
- .flex-shrink--$(view)-$(i) {
51
- flex-shrink: $i !important;
52
- }
53
- }
54
- }
55
- }
56
-
57
- @each $name
58
- in (flex-start, flex-end, center, space-between, space-around, space-evenly)
59
- {
60
- .justify-content--$(name) {
61
- justify-content: $name !important;
62
- }
63
- }
64
-
65
- @each $view in mobile, tablet, desktop, widescreen, fullhd {
66
- @each $name
67
- in (flex-start, flex-end, center, space-between, space-around, space-evenly)
68
- {
69
- @media (--viewport-$(view)) {
70
- .justify-content--$(view)-$(name) {
71
- justify-content: $name !important;
72
- }
73
- }
74
- }
75
- }
76
-
77
- @each $name in (auto, flex-start, flex-end, center, baseline, stretch) {
78
- .align-items--$(name) {
79
- align-items: $name !important;
80
- }
81
-
82
- .align-self--$(name) {
83
- align-self: $name !important;
84
- }
85
- }
86
-
87
- @each $view in mobile, tablet, desktop, widescreen, fullhd {
88
- @each $name in (auto, flex-start, flex-end, center, baseline, stretch) {
89
- @media (--viewport-$(view)) {
90
- .align-items--$(view)-$(name) {
91
- align-items: $name !important;
92
- }
93
-
94
- .align-self--$(view)-$(name) {
95
- align-self: $name !important;
96
- }
97
- }
98
- }
99
- }
100
-
101
- @each $name
102
- in (flex-start, flex-end, center, space-between, space-around, stretch)
103
- {
104
- .align-content--$(name) {
105
- align-content: $name !important;
106
- }
107
- }
108
-
109
- @each $view in mobile, tablet, desktop, widescreen, fullhd {
110
- @each $name
111
- in (flex-start, flex-end, center, space-between, space-around, stretch)
112
- {
113
- @media (--viewport-$(view)) {
114
- .align-content--$(view)-$(name) {
115
- align-content: $name !important;
116
- }
117
- }
118
- }
119
- }
120
-
121
- .flex--fill {
122
- flex: 1 1 auto !important;
123
- }
124
-
125
- @each $view in mobile, tablet, desktop, widescreen, fullhd {
126
- @media (--viewport-$(view)) {
127
- .flex--$(view)-fill {
128
- flex: 1 1 auto !important;
129
- }
130
- }
131
- }
@@ -1,15 +0,0 @@
1
- @each $name in (left, right, none) {
2
- .float--$(name) {
3
- float: $name !important;
4
- }
5
- }
6
-
7
- @each $view in mobile, tablet, desktop, widescreen, fullhd {
8
- @each $name in (left, right, none) {
9
- @media (--viewport-$(view)) {
10
- .float--$(view)-$(name) {
11
- float: $name !important;
12
- }
13
- }
14
- }
15
- }