@ertugrulozcan97/apexui 0.1.2 → 0.1.3
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.
- package/package.json +3 -3
- package/src/{main.css → tokens.css} +4 -59
package/package.json
CHANGED
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@ertugrulozcan97/apexui",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.3",
|
|
4
4
|
"private": false,
|
|
5
5
|
"type": "module",
|
|
6
6
|
"files": [
|
|
7
7
|
"dist",
|
|
8
|
-
"src/
|
|
8
|
+
"src/tokens.css"
|
|
9
9
|
],
|
|
10
10
|
"main": "./dist/apexui.umd.js",
|
|
11
11
|
"module": "./dist/apexui.es.js",
|
|
@@ -15,7 +15,7 @@
|
|
|
15
15
|
"import": "./dist/apexui.es.js",
|
|
16
16
|
"require": "./dist/apexui.umd.js"
|
|
17
17
|
},
|
|
18
|
-
"./style": "./src/
|
|
18
|
+
"./style": "./src/tokens.css"
|
|
19
19
|
},
|
|
20
20
|
"scripts": {
|
|
21
21
|
"dev": "vite",
|
|
@@ -1,8 +1,6 @@
|
|
|
1
|
-
@import url("https://fonts.googleapis.com/css2?family=Geist:wght@400;500;600;700&family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap");
|
|
2
|
-
@import "tailwindcss";
|
|
3
|
-
|
|
4
1
|
/* ============================================================
|
|
5
|
-
|
|
2
|
+
ApexUI — Design Tokens (Tailwind v4 CSS theme)
|
|
3
|
+
Import this AFTER @import "tailwindcss" in your project.
|
|
6
4
|
============================================================ */
|
|
7
5
|
@theme {
|
|
8
6
|
/* Brand colors */
|
|
@@ -75,7 +73,7 @@
|
|
|
75
73
|
*,
|
|
76
74
|
*::before,
|
|
77
75
|
*::after {
|
|
78
|
-
border-radius: 0 !important;
|
|
76
|
+
border-radius: 0 !important;
|
|
79
77
|
}
|
|
80
78
|
|
|
81
79
|
html {
|
|
@@ -93,7 +91,7 @@
|
|
|
93
91
|
}
|
|
94
92
|
|
|
95
93
|
/* ============================================================
|
|
96
|
-
Utility classes
|
|
94
|
+
Utility classes
|
|
97
95
|
============================================================ */
|
|
98
96
|
@layer utilities {
|
|
99
97
|
.font-display {
|
|
@@ -127,57 +125,4 @@
|
|
|
127
125
|
.h-input {
|
|
128
126
|
height: var(--height-input);
|
|
129
127
|
}
|
|
130
|
-
|
|
131
|
-
/* Focus ring in brand color */
|
|
132
|
-
.focus-brand:focus-visible {
|
|
133
|
-
outline: none;
|
|
134
|
-
border-color: var(--color-brand-500) !important;
|
|
135
|
-
box-shadow: 0 0 0 3px rgb(255 133 52 / 0.2);
|
|
136
|
-
}
|
|
137
|
-
|
|
138
|
-
/* Custom select arrow */
|
|
139
|
-
.select-arrow {
|
|
140
|
-
appearance: none;
|
|
141
|
-
background-image:
|
|
142
|
-
linear-gradient(45deg, transparent 50%, var(--color-ink-700) 50%),
|
|
143
|
-
linear-gradient(135deg, var(--color-ink-700) 50%, transparent 50%);
|
|
144
|
-
background-position:
|
|
145
|
-
calc(100% - 18px) 17px,
|
|
146
|
-
calc(100% - 13px) 17px;
|
|
147
|
-
background-size:
|
|
148
|
-
5px 5px,
|
|
149
|
-
5px 5px;
|
|
150
|
-
background-repeat: no-repeat;
|
|
151
|
-
}
|
|
152
|
-
|
|
153
|
-
/* Eyebrow label */
|
|
154
|
-
.eyebrow {
|
|
155
|
-
font-family: var(--font-display);
|
|
156
|
-
font-size: 10px;
|
|
157
|
-
font-weight: 600;
|
|
158
|
-
letter-spacing: 0.08em;
|
|
159
|
-
text-transform: uppercase;
|
|
160
|
-
color: var(--color-ink-500);
|
|
161
|
-
}
|
|
162
|
-
|
|
163
|
-
/* Col-label inside list cards */
|
|
164
|
-
.col-label {
|
|
165
|
-
font-family: var(--font-mono);
|
|
166
|
-
font-size: 10px;
|
|
167
|
-
color: var(--color-ink-500);
|
|
168
|
-
text-transform: uppercase;
|
|
169
|
-
letter-spacing: 0.06em;
|
|
170
|
-
margin-bottom: 3px;
|
|
171
|
-
}
|
|
172
|
-
|
|
173
|
-
/* Metric sizes */
|
|
174
|
-
.metric-lg {
|
|
175
|
-
font-family: var(--font-display);
|
|
176
|
-
font-size: 40px;
|
|
177
|
-
font-weight: 700;
|
|
178
|
-
line-height: 1.05;
|
|
179
|
-
letter-spacing: -0.015em;
|
|
180
|
-
color: var(--color-ink-900);
|
|
181
|
-
font-variant-numeric: tabular-nums;
|
|
182
|
-
}
|
|
183
128
|
}
|