arekui 1.0.0 → 1.0.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 (54) hide show
  1. package/LICENSE +21 -21
  2. package/README.md +198 -198
  3. package/arekui.css +3279 -3279
  4. package/arekui.d.ts +328 -328
  5. package/arekui.js +450 -450
  6. package/package.json +59 -57
  7. package/scripts/build-custom.js +318 -318
  8. package/src/arekui.css +55 -55
  9. package/src/base/neo-overrides.css +317 -317
  10. package/src/base/reset.css +67 -67
  11. package/src/base/tokens.css +304 -304
  12. package/src/components/accordion.css +34 -34
  13. package/src/components/alert.css +26 -26
  14. package/src/components/badge.css +33 -33
  15. package/src/components/breadcrumb.css +33 -33
  16. package/src/components/button.css +103 -103
  17. package/src/components/card.css +24 -24
  18. package/src/components/carousel.css +14 -14
  19. package/src/components/chat.css +78 -78
  20. package/src/components/drawer.css +53 -53
  21. package/src/components/file-upload.css +51 -51
  22. package/src/components/footer.css +26 -26
  23. package/src/components/forms.css +69 -69
  24. package/src/components/hero.css +22 -22
  25. package/src/components/join.css +14 -14
  26. package/src/components/link.css +24 -24
  27. package/src/components/menu.css +56 -56
  28. package/src/components/misc.css +57 -57
  29. package/src/components/modal.css +32 -32
  30. package/src/components/navbar.css +37 -37
  31. package/src/components/pagination.css +46 -46
  32. package/src/components/popover.css +70 -70
  33. package/src/components/progress.css +19 -19
  34. package/src/components/prose.css +80 -80
  35. package/src/components/rating.css +37 -37
  36. package/src/components/scroll-top.css +36 -36
  37. package/src/components/skeleton.css +54 -54
  38. package/src/components/swap.css +45 -45
  39. package/src/components/table.css +22 -22
  40. package/src/components/tabs.css +24 -24
  41. package/src/components/tag.css +101 -101
  42. package/src/components/textured.css +34 -34
  43. package/src/components/timeline.css +34 -34
  44. package/src/components/toast.css +134 -134
  45. package/src/components/tooltip.css +24 -24
  46. package/src/utilities/borders.css +152 -152
  47. package/src/utilities/colors.css +73 -73
  48. package/src/utilities/hover.css +33 -33
  49. package/src/utilities/layout.css +100 -100
  50. package/src/utilities/neo-utilities.css +95 -95
  51. package/src/utilities/responsive.css +128 -128
  52. package/src/utilities/sizing.css +91 -91
  53. package/src/utilities/spacing.css +130 -130
  54. package/src/utilities/typography.css +94 -94
package/src/utilities/sizing.css CHANGED
@@ -1,91 +1,91 @@
1
- /* UTILITIES — sizing */
2
- .ar-w-8 {
3
- width: var(--ar-s-8);
4
- }
5
- .ar-w-40 {
6
- width: var(--ar-s-40, 10rem);
7
- }
8
- .ar-w-48 {
9
- width: var(--ar-s-48, 12rem);
10
- }
11
- .ar-w-60 {
12
- width: 15rem;
13
- }
14
- .ar-w-80 {
15
- width: 20rem;
16
- }
17
- .ar-w-full {
18
- width: 100%;
19
- }
20
- .ar-w-1\/3 {
21
- width: 33.333333%;
22
- }
23
- .ar-w-2\/3 {
24
- width: 66.666667%;
25
- }
26
- .ar-w-1\/2 {
27
- width: 50%;
28
- }
29
- .ar-w-11\/12 {
30
- width: 91.666667%;
31
- }
32
- .ar-h-8 {
33
- height: var(--ar-s-8);
34
- }
35
- .ar-h-48 {
36
- height: 12rem;
37
- }
38
- .ar-h-full {
39
- height: 100%;
40
- }
41
- .ar-min-h-full {
42
- min-height: 100%;
43
- }
44
- .ar-min-h-screen {
45
- min-height: 100vh;
46
- }
47
- .ar-max-w-none {
48
- max-width: none;
49
- }
50
- .ar-max-w-sm {
51
- max-width: 24rem;
52
- }
53
- .ar-max-w-md {
54
- max-width: 28rem;
55
- }
56
- .ar-max-w-lg {
57
- max-width: 32rem;
58
- }
59
- .ar-max-w-xl {
60
- max-width: 36rem;
61
- }
62
- .ar-max-w-2xl {
63
- max-width: 42rem;
64
- }
65
- .ar-max-w-3xl {
66
- max-width: 48rem;
67
- }
68
- .ar-max-w-4xl {
69
- max-width: 56rem;
70
- }
71
- .ar-max-w-5xl {
72
- max-width: 64rem;
73
- }
74
- .ar-max-w-6xl {
75
- max-width: 72rem;
76
- }
77
- .ar-max-w-7xl {
78
- max-width: 80rem;
79
- }
80
- .ar-aspect-video {
81
- aspect-ratio: 16 / 9;
82
- }
83
- .ar-object-cover {
84
- object-fit: cover;
85
- }
86
- .ar-overflow-hidden {
87
- overflow: hidden;
88
- }
89
- .ar-overflow-x-auto {
90
- overflow-x: auto;
91
- }
1
+ /* UTILITIES — sizing */
2
+ .ar-w-8 {
3
+ width: var(--ar-s-8);
4
+ }
5
+ .ar-w-40 {
6
+ width: var(--ar-s-40, 10rem);
7
+ }
8
+ .ar-w-48 {
9
+ width: var(--ar-s-48, 12rem);
10
+ }
11
+ .ar-w-60 {
12
+ width: 15rem;
13
+ }
14
+ .ar-w-80 {
15
+ width: 20rem;
16
+ }
17
+ .ar-w-full {
18
+ width: 100%;
19
+ }
20
+ .ar-w-1\/3 {
21
+ width: 33.333333%;
22
+ }
23
+ .ar-w-2\/3 {
24
+ width: 66.666667%;
25
+ }
26
+ .ar-w-1\/2 {
27
+ width: 50%;
28
+ }
29
+ .ar-w-11\/12 {
30
+ width: 91.666667%;
31
+ }
32
+ .ar-h-8 {
33
+ height: var(--ar-s-8);
34
+ }
35
+ .ar-h-48 {
36
+ height: 12rem;
37
+ }
38
+ .ar-h-full {
39
+ height: 100%;
40
+ }
41
+ .ar-min-h-full {
42
+ min-height: 100%;
43
+ }
44
+ .ar-min-h-screen {
45
+ min-height: 100vh;
46
+ }
47
+ .ar-max-w-none {
48
+ max-width: none;
49
+ }
50
+ .ar-max-w-sm {
51
+ max-width: 24rem;
52
+ }
53
+ .ar-max-w-md {
54
+ max-width: 28rem;
55
+ }
56
+ .ar-max-w-lg {
57
+ max-width: 32rem;
58
+ }
59
+ .ar-max-w-xl {
60
+ max-width: 36rem;
61
+ }
62
+ .ar-max-w-2xl {
63
+ max-width: 42rem;
64
+ }
65
+ .ar-max-w-3xl {
66
+ max-width: 48rem;
67
+ }
68
+ .ar-max-w-4xl {
69
+ max-width: 56rem;
70
+ }
71
+ .ar-max-w-5xl {
72
+ max-width: 64rem;
73
+ }
74
+ .ar-max-w-6xl {
75
+ max-width: 72rem;
76
+ }
77
+ .ar-max-w-7xl {
78
+ max-width: 80rem;
79
+ }
80
+ .ar-aspect-video {
81
+ aspect-ratio: 16 / 9;
82
+ }
83
+ .ar-object-cover {
84
+ object-fit: cover;
85
+ }
86
+ .ar-overflow-hidden {
87
+ overflow: hidden;
88
+ }
89
+ .ar-overflow-x-auto {
90
+ overflow-x: auto;
91
+ }
package/src/utilities/spacing.css CHANGED
@@ -1,130 +1,130 @@
1
- /* UTILITIES — spacing */
2
- .ar-p-0 {
3
- padding: var(--ar-s-0);
4
- }
5
- .ar-p-1 {
6
- padding: var(--ar-s-1);
7
- }
8
- .ar-p-2 {
9
- padding: var(--ar-s-2);
10
- }
11
- .ar-p-3 {
12
- padding: var(--ar-s-3);
13
- }
14
- .ar-p-4 {
15
- padding: var(--ar-s-4);
16
- }
17
- .ar-p-5 {
18
- padding: var(--ar-s-5);
19
- }
20
- .ar-p-6 {
21
- padding: var(--ar-s-6);
22
- }
23
- .ar-p-8 {
24
- padding: var(--ar-s-8);
25
- }
26
- .ar-p-10 {
27
- padding: var(--ar-s-10);
28
- }
29
- .ar-p-12 {
30
- padding: var(--ar-s-12);
31
- }
32
- .ar-px-1 {
33
- padding-inline: var(--ar-s-1);
34
- }
35
- .ar-px-2 {
36
- padding-inline: var(--ar-s-2);
37
- }
38
- .ar-px-3 {
39
- padding-inline: var(--ar-s-3);
40
- }
41
- .ar-px-4 {
42
- padding-inline: var(--ar-s-4);
43
- }
44
- .ar-px-6 {
45
- padding-inline: var(--ar-s-6);
46
- }
47
- .ar-px-8 {
48
- padding-inline: var(--ar-s-8);
49
- }
50
- .ar-py-1 {
51
- padding-block: var(--ar-s-1);
52
- }
53
- .ar-py-2 {
54
- padding-block: var(--ar-s-2);
55
- }
56
- .ar-py-3 {
57
- padding-block: var(--ar-s-3);
58
- }
59
- .ar-py-4 {
60
- padding-block: var(--ar-s-4);
61
- }
62
- .ar-py-6 {
63
- padding-block: var(--ar-s-6);
64
- }
65
- .ar-py-8 {
66
- padding-block: var(--ar-s-8);
67
- }
68
- .ar-py-12 {
69
- padding-block: var(--ar-s-12);
70
- }
71
- .ar-pt-2 {
72
- padding-top: var(--ar-s-2);
73
- }
74
- .ar-pt-10 {
75
- padding-top: var(--ar-s-10);
76
- }
77
- .ar-pb-0 {
78
- padding-bottom: var(--ar-s-0);
79
- }
80
- .ar-pb-2 {
81
- padding-bottom: var(--ar-s-2);
82
- }
83
- .ar-m-0 {
84
- margin: var(--ar-s-0);
85
- }
86
- .ar-m-2 {
87
- margin: var(--ar-s-2);
88
- }
89
- .ar-m-4 {
90
- margin: var(--ar-s-4);
91
- }
92
- .ar-mt-1 {
93
- margin-top: var(--ar-s-1);
94
- }
95
- .ar-mt-2 {
96
- margin-top: var(--ar-s-2);
97
- }
98
- .ar-mt-3 {
99
- margin-top: var(--ar-s-3);
100
- }
101
- .ar-mt-4 {
102
- margin-top: var(--ar-s-4);
103
- }
104
- .ar-mt-6 {
105
- margin-top: var(--ar-s-6);
106
- }
107
- .ar-mt-8 {
108
- margin-top: var(--ar-s-8);
109
- }
110
- .ar-mb-2 {
111
- margin-bottom: var(--ar-s-2);
112
- }
113
- .ar-mb-8 {
114
- margin-bottom: var(--ar-s-8);
115
- }
116
- .ar-my-1 {
117
- margin-block: var(--ar-s-1);
118
- }
119
- .ar-my-2 {
120
- margin-block: var(--ar-s-2);
121
- }
122
- .ar-my-4 {
123
- margin-block: var(--ar-s-4);
124
- }
125
- .ar-my-10 {
126
- margin-block: var(--ar-s-10);
127
- }
128
- .ar-mx-auto {
129
- margin-inline: auto;
130
- }
1
+ /* UTILITIES — spacing */
2
+ .ar-p-0 {
3
+ padding: var(--ar-s-0);
4
+ }
5
+ .ar-p-1 {
6
+ padding: var(--ar-s-1);
7
+ }
8
+ .ar-p-2 {
9
+ padding: var(--ar-s-2);
10
+ }
11
+ .ar-p-3 {
12
+ padding: var(--ar-s-3);
13
+ }
14
+ .ar-p-4 {
15
+ padding: var(--ar-s-4);
16
+ }
17
+ .ar-p-5 {
18
+ padding: var(--ar-s-5);
19
+ }
20
+ .ar-p-6 {
21
+ padding: var(--ar-s-6);
22
+ }
23
+ .ar-p-8 {
24
+ padding: var(--ar-s-8);
25
+ }
26
+ .ar-p-10 {
27
+ padding: var(--ar-s-10);
28
+ }
29
+ .ar-p-12 {
30
+ padding: var(--ar-s-12);
31
+ }
32
+ .ar-px-1 {
33
+ padding-inline: var(--ar-s-1);
34
+ }
35
+ .ar-px-2 {
36
+ padding-inline: var(--ar-s-2);
37
+ }
38
+ .ar-px-3 {
39
+ padding-inline: var(--ar-s-3);
40
+ }
41
+ .ar-px-4 {
42
+ padding-inline: var(--ar-s-4);
43
+ }
44
+ .ar-px-6 {
45
+ padding-inline: var(--ar-s-6);
46
+ }
47
+ .ar-px-8 {
48
+ padding-inline: var(--ar-s-8);
49
+ }
50
+ .ar-py-1 {
51
+ padding-block: var(--ar-s-1);
52
+ }
53
+ .ar-py-2 {
54
+ padding-block: var(--ar-s-2);
55
+ }
56
+ .ar-py-3 {
57
+ padding-block: var(--ar-s-3);
58
+ }
59
+ .ar-py-4 {
60
+ padding-block: var(--ar-s-4);
61
+ }
62
+ .ar-py-6 {
63
+ padding-block: var(--ar-s-6);
64
+ }
65
+ .ar-py-8 {
66
+ padding-block: var(--ar-s-8);
67
+ }
68
+ .ar-py-12 {
69
+ padding-block: var(--ar-s-12);
70
+ }
71
+ .ar-pt-2 {
72
+ padding-top: var(--ar-s-2);
73
+ }
74
+ .ar-pt-10 {
75
+ padding-top: var(--ar-s-10);
76
+ }
77
+ .ar-pb-0 {
78
+ padding-bottom: var(--ar-s-0);
79
+ }
80
+ .ar-pb-2 {
81
+ padding-bottom: var(--ar-s-2);
82
+ }
83
+ .ar-m-0 {
84
+ margin: var(--ar-s-0);
85
+ }
86
+ .ar-m-2 {
87
+ margin: var(--ar-s-2);
88
+ }
89
+ .ar-m-4 {
90
+ margin: var(--ar-s-4);
91
+ }
92
+ .ar-mt-1 {
93
+ margin-top: var(--ar-s-1);
94
+ }
95
+ .ar-mt-2 {
96
+ margin-top: var(--ar-s-2);
97
+ }
98
+ .ar-mt-3 {
99
+ margin-top: var(--ar-s-3);
100
+ }
101
+ .ar-mt-4 {
102
+ margin-top: var(--ar-s-4);
103
+ }
104
+ .ar-mt-6 {
105
+ margin-top: var(--ar-s-6);
106
+ }
107
+ .ar-mt-8 {
108
+ margin-top: var(--ar-s-8);
109
+ }
110
+ .ar-mb-2 {
111
+ margin-bottom: var(--ar-s-2);
112
+ }
113
+ .ar-mb-8 {
114
+ margin-bottom: var(--ar-s-8);
115
+ }
116
+ .ar-my-1 {
117
+ margin-block: var(--ar-s-1);
118
+ }
119
+ .ar-my-2 {
120
+ margin-block: var(--ar-s-2);
121
+ }
122
+ .ar-my-4 {
123
+ margin-block: var(--ar-s-4);
124
+ }
125
+ .ar-my-10 {
126
+ margin-block: var(--ar-s-10);
127
+ }
128
+ .ar-mx-auto {
129
+ margin-inline: auto;
130
+ }
package/src/utilities/typography.css CHANGED
@@ -1,94 +1,94 @@
1
- /* UTILITIES — typography */
2
- .ar-text-xs {
3
- font-size: 0.75rem;
4
- }
5
- .ar-text-sm {
6
- font-size: 0.875rem;
7
- }
8
- .ar-text-base {
9
- font-size: 1rem;
10
- }
11
- .ar-text-lg {
12
- font-size: 1.125rem;
13
- }
14
- .ar-text-xl {
15
- font-size: 1.25rem;
16
- }
17
- .ar-text-2xl {
18
- font-size: 1.5rem;
19
- }
20
- .ar-text-3xl {
21
- font-size: 1.875rem;
22
- }
23
- .ar-text-4xl {
24
- font-size: 2.25rem;
25
- }
26
- .ar-text-5xl {
27
- font-size: 3rem;
28
- }
29
- .ar-text-6xl {
30
- font-size: 3.75rem;
31
- }
32
- .ar-text-7xl {
33
- font-size: 4.5rem;
34
- }
35
- .ar-text-8xl {
36
- font-size: 6rem;
37
- }
38
- .ar-text-9xl {
39
- font-size: 8rem;
40
- }
41
- .ar-font-thin {
42
- font-weight: 100;
43
- }
44
- .ar-font-normal {
45
- font-weight: 400;
46
- }
47
- .ar-font-medium {
48
- font-weight: 500;
49
- }
50
- .ar-font-semibold {
51
- font-weight: 600;
52
- }
53
- .ar-font-bold {
54
- font-weight: 700;
55
- }
56
- .ar-text-left {
57
- text-align: left;
58
- }
59
- .ar-text-center {
60
- text-align: center;
61
- }
62
- .ar-text-right {
63
- text-align: right;
64
- }
65
- .ar-text-pretty {
66
- text-wrap: pretty;
67
- }
68
- .ar-text-wrap {
69
- text-wrap: wrap;
70
- }
71
- .ar-leading-tight {
72
- line-height: 1.25;
73
- }
74
- .ar-leading-6 {
75
- line-height: 1.5rem;
76
- }
77
- .ar-tracking-wide {
78
- letter-spacing: 0.025em;
79
- }
80
- .ar-tracking-wider {
81
- letter-spacing: 0.05em;
82
- }
83
- .ar-underline {
84
- text-decoration: underline;
85
- }
86
- .ar-no-underline {
87
- text-decoration: none;
88
- }
89
- .ar-list-none {
90
- list-style: none;
91
- }
92
- .ar-tabular-nums {
93
- font-variant-numeric: tabular-nums;
94
- }
1
+ /* UTILITIES — typography */
2
+ .ar-text-xs {
3
+ font-size: 0.75rem;
4
+ }
5
+ .ar-text-sm {
6
+ font-size: 0.875rem;
7
+ }
8
+ .ar-text-base {
9
+ font-size: 1rem;
10
+ }
11
+ .ar-text-lg {
12
+ font-size: 1.125rem;
13
+ }
14
+ .ar-text-xl {
15
+ font-size: 1.25rem;
16
+ }
17
+ .ar-text-2xl {
18
+ font-size: 1.5rem;
19
+ }
20
+ .ar-text-3xl {
21
+ font-size: 1.875rem;
22
+ }
23
+ .ar-text-4xl {
24
+ font-size: 2.25rem;
25
+ }
26
+ .ar-text-5xl {
27
+ font-size: 3rem;
28
+ }
29
+ .ar-text-6xl {
30
+ font-size: 3.75rem;
31
+ }
32
+ .ar-text-7xl {
33
+ font-size: 4.5rem;
34
+ }
35
+ .ar-text-8xl {
36
+ font-size: 6rem;
37
+ }
38
+ .ar-text-9xl {
39
+ font-size: 8rem;
40
+ }
41
+ .ar-font-thin {
42
+ font-weight: 100;
43
+ }
44
+ .ar-font-normal {
45
+ font-weight: 400;
46
+ }
47
+ .ar-font-medium {
48
+ font-weight: 500;
49
+ }
50
+ .ar-font-semibold {
51
+ font-weight: 600;
52
+ }
53
+ .ar-font-bold {
54
+ font-weight: 700;
55
+ }
56
+ .ar-text-left {
57
+ text-align: left;
58
+ }
59
+ .ar-text-center {
60
+ text-align: center;
61
+ }
62
+ .ar-text-right {
63
+ text-align: right;
64
+ }
65
+ .ar-text-pretty {
66
+ text-wrap: pretty;
67
+ }
68
+ .ar-text-wrap {
69
+ text-wrap: wrap;
70
+ }
71
+ .ar-leading-tight {
72
+ line-height: 1.25;
73
+ }
74
+ .ar-leading-6 {
75
+ line-height: 1.5rem;
76
+ }
77
+ .ar-tracking-wide {
78
+ letter-spacing: 0.025em;
79
+ }
80
+ .ar-tracking-wider {
81
+ letter-spacing: 0.05em;
82
+ }
83
+ .ar-underline {
84
+ text-decoration: underline;
85
+ }
86
+ .ar-no-underline {
87
+ text-decoration: none;
88
+ }
89
+ .ar-list-none {
90
+ list-style: none;
91
+ }
92
+ .ar-tabular-nums {
93
+ font-variant-numeric: tabular-nums;
94
+ }