codexly-ui 0.1.22 → 0.1.24
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/assets/styles/_fonts.css +3 -84
- package/assets/styles/_theme.css +11 -1
- package/fesm2022/codexly-ui.mjs +442 -111
- package/fesm2022/codexly-ui.mjs.map +1 -1
- package/package.json +1 -1
- package/types/codexly-ui.d.ts +57 -24
- package/assets/fonts/roboto-bold-italic.ttf +0 -0
- package/assets/fonts/roboto-bold.ttf +0 -0
- package/assets/fonts/roboto-italic.ttf +0 -0
- package/assets/fonts/roboto-light-italic.ttf +0 -0
- package/assets/fonts/roboto-light.ttf +0 -0
- package/assets/fonts/roboto-medium-italic.ttf +0 -0
- package/assets/fonts/roboto-medium.ttf +0 -0
- package/assets/fonts/roboto-regular.ttf +0 -0
- package/assets/fonts/roboto-semibold-italic.ttf +0 -0
- package/assets/fonts/roboto-semibold.ttf +0 -0
package/assets/styles/_fonts.css
CHANGED
|
@@ -1,84 +1,3 @@
|
|
|
1
|
-
/*
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
font-style: normal;
|
|
5
|
-
font-weight: 300;
|
|
6
|
-
font-display: swap;
|
|
7
|
-
src: url('../fonts/roboto-light.ttf') format('truetype');
|
|
8
|
-
}
|
|
9
|
-
|
|
10
|
-
@font-face {
|
|
11
|
-
font-family: 'Roboto';
|
|
12
|
-
font-style: italic;
|
|
13
|
-
font-weight: 300;
|
|
14
|
-
font-display: swap;
|
|
15
|
-
src: url('../fonts/roboto-light-italic.ttf') format('truetype');
|
|
16
|
-
}
|
|
17
|
-
|
|
18
|
-
/* ── Roboto 400 Regular ────────────────────────────────────────────────────── */
|
|
19
|
-
@font-face {
|
|
20
|
-
font-family: 'Roboto';
|
|
21
|
-
font-style: normal;
|
|
22
|
-
font-weight: 400;
|
|
23
|
-
font-display: swap;
|
|
24
|
-
src: url('../fonts/roboto-regular.ttf') format('truetype');
|
|
25
|
-
}
|
|
26
|
-
|
|
27
|
-
@font-face {
|
|
28
|
-
font-family: 'Roboto';
|
|
29
|
-
font-style: italic;
|
|
30
|
-
font-weight: 400;
|
|
31
|
-
font-display: swap;
|
|
32
|
-
src: url('../fonts/roboto-italic.ttf') format('truetype');
|
|
33
|
-
}
|
|
34
|
-
|
|
35
|
-
/* ── Roboto 500 Medium ─────────────────────────────────────────────────────── */
|
|
36
|
-
@font-face {
|
|
37
|
-
font-family: 'Roboto';
|
|
38
|
-
font-style: normal;
|
|
39
|
-
font-weight: 500;
|
|
40
|
-
font-display: swap;
|
|
41
|
-
src: url('../fonts/roboto-medium.ttf') format('truetype');
|
|
42
|
-
}
|
|
43
|
-
|
|
44
|
-
@font-face {
|
|
45
|
-
font-family: 'Roboto';
|
|
46
|
-
font-style: italic;
|
|
47
|
-
font-weight: 500;
|
|
48
|
-
font-display: swap;
|
|
49
|
-
src: url('../fonts/roboto-medium-italic.ttf') format('truetype');
|
|
50
|
-
}
|
|
51
|
-
|
|
52
|
-
/* ── Roboto 600 SemiBold ───────────────────────────────────────────────────── */
|
|
53
|
-
@font-face {
|
|
54
|
-
font-family: 'Roboto';
|
|
55
|
-
font-style: normal;
|
|
56
|
-
font-weight: 600;
|
|
57
|
-
font-display: swap;
|
|
58
|
-
src: url('../fonts/roboto-semibold.ttf') format('truetype');
|
|
59
|
-
}
|
|
60
|
-
|
|
61
|
-
@font-face {
|
|
62
|
-
font-family: 'Roboto';
|
|
63
|
-
font-style: italic;
|
|
64
|
-
font-weight: 600;
|
|
65
|
-
font-display: swap;
|
|
66
|
-
src: url('../fonts/roboto-semibold-italic.ttf') format('truetype');
|
|
67
|
-
}
|
|
68
|
-
|
|
69
|
-
/* ── Roboto 700 Bold ───────────────────────────────────────────────────────── */
|
|
70
|
-
@font-face {
|
|
71
|
-
font-family: 'Roboto';
|
|
72
|
-
font-style: normal;
|
|
73
|
-
font-weight: 700;
|
|
74
|
-
font-display: swap;
|
|
75
|
-
src: url('../fonts/roboto-bold.ttf') format('truetype');
|
|
76
|
-
}
|
|
77
|
-
|
|
78
|
-
@font-face {
|
|
79
|
-
font-family: 'Roboto';
|
|
80
|
-
font-style: italic;
|
|
81
|
-
font-weight: 700;
|
|
82
|
-
font-display: swap;
|
|
83
|
-
src: url('../fonts/roboto-bold-italic.ttf') format('truetype');
|
|
84
|
-
}
|
|
1
|
+
/* Fonts are loaded dynamically by ClxThemeService via <link> injection.
|
|
2
|
+
Roboto is the default — preloaded here so the app renders before JS executes. */
|
|
3
|
+
@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,300;0,400;0,500;0,600;0,700;1,300;1,400;1,500;1,600;1,700&display=swap');
|
package/assets/styles/_theme.css
CHANGED
|
@@ -1,9 +1,13 @@
|
|
|
1
1
|
/* ── Font registrations ───────────────────────────────────────────────────── */
|
|
2
2
|
@theme {
|
|
3
|
-
--font-roboto: 'Roboto', ui-sans-serif, system-ui, sans-serif;
|
|
4
3
|
--font-material-symbols-outlined: 'Material Symbols Outlined';
|
|
5
4
|
}
|
|
6
5
|
|
|
6
|
+
/* ── Font body variable (overridden dynamically by ClxThemeService) ───────── */
|
|
7
|
+
:root {
|
|
8
|
+
--clx-font-body: 'Roboto', ui-sans-serif, system-ui, sans-serif;
|
|
9
|
+
}
|
|
10
|
+
|
|
7
11
|
/* ── Light theme (default) ────────────────────────────────────────────────── */
|
|
8
12
|
:root {
|
|
9
13
|
color-scheme: light;
|
|
@@ -34,6 +38,10 @@
|
|
|
34
38
|
/* ── Scrollbar ── */
|
|
35
39
|
--clx-scrollbar: #cbd5e1; /* slate-300 */
|
|
36
40
|
--clx-scrollbar-hover: #94a3b8; /* slate-400 */
|
|
41
|
+
|
|
42
|
+
/* ── Theme accents (overridden dynamically by ClxThemeService) ── */
|
|
43
|
+
--clx-secondary: #64748b; /* slate-500 */
|
|
44
|
+
--clx-secondary-light: #f1f5f9; /* slate-100 */
|
|
37
45
|
}
|
|
38
46
|
|
|
39
47
|
/* ── Dark theme ───────────────────────────────────────────────────────────── */
|
|
@@ -83,4 +91,6 @@
|
|
|
83
91
|
--color-clx-border-soft: var(--clx-border-soft);
|
|
84
92
|
--color-clx-primary: var(--clx-primary);
|
|
85
93
|
--color-clx-primary-light: var(--clx-primary-light);
|
|
94
|
+
--color-clx-secondary: var(--clx-secondary);
|
|
95
|
+
--color-clx-secondary-light: var(--clx-secondary-light);
|
|
86
96
|
}
|