codexly-ui 0.10.88 → 0.10.89
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/_theme.css
CHANGED
|
@@ -24,9 +24,15 @@
|
|
|
24
24
|
--clx-text: #0f172a; /* slate-900 — body text */
|
|
25
25
|
--clx-text-label: #475569; /* slate-600 — field labels */
|
|
26
26
|
--clx-text-muted: #64748b; /* slate-500 — secondary text, body in alerts */
|
|
27
|
-
--clx-text-subtle: #94a3b8; /* slate-400 — hints,
|
|
27
|
+
--clx-text-subtle: #94a3b8; /* slate-400 — hints, idle nav */
|
|
28
28
|
--clx-text-faint: #cbd5e1; /* slate-300 — out-of-range calendar days */
|
|
29
29
|
|
|
30
|
+
/* Fixed input placeholder color — intentionally NOT derived from --clx-text-subtle:
|
|
31
|
+
a custom theme can set --clx-text-subtle close to --clx-text-label (e.g. via the
|
|
32
|
+
theme picker), which collapses placeholder/typed-text contrast. Placeholders need
|
|
33
|
+
a guaranteed-low-contrast color regardless of the user's theme customization. */
|
|
34
|
+
--clx-placeholder: #94a3b8; /* slate-400 */
|
|
35
|
+
|
|
30
36
|
/* ── Borders ── */
|
|
31
37
|
--clx-border: #e2e8f0; /* slate-200 — default input/card border */
|
|
32
38
|
--clx-border-soft: #f1f5f9; /* slate-100 — card/modal header-footer divider */
|
|
@@ -63,6 +69,10 @@
|
|
|
63
69
|
--clx-text-subtle: #64748b; /* slate-500 */
|
|
64
70
|
--clx-text-faint: #475569; /* slate-600 */
|
|
65
71
|
|
|
72
|
+
/* Fixed input placeholder color — see :root definition above for why this is independent
|
|
73
|
+
of --clx-text-subtle. */
|
|
74
|
+
--clx-placeholder: #64748b; /* slate-500 */
|
|
75
|
+
|
|
66
76
|
/* ── Borders ── */
|
|
67
77
|
--clx-border: #334155; /* slate-700 */
|
|
68
78
|
--clx-border-soft: #1e293b; /* slate-800 */
|
|
@@ -87,6 +97,7 @@
|
|
|
87
97
|
--color-clx-text-muted: var(--clx-text-muted);
|
|
88
98
|
--color-clx-text-subtle: var(--clx-text-subtle);
|
|
89
99
|
--color-clx-text-faint: var(--clx-text-faint);
|
|
100
|
+
--color-clx-placeholder: var(--clx-placeholder);
|
|
90
101
|
--color-clx-border: var(--clx-border);
|
|
91
102
|
--color-clx-border-soft: var(--clx-border-soft);
|
|
92
103
|
--color-clx-primary: var(--clx-primary);
|
package/assets/styles/styles.css
CHANGED
|
@@ -9,7 +9,7 @@
|
|
|
9
9
|
@source inline("text-{black,white}");
|
|
10
10
|
@source inline("focus:ring-2 focus-within:ring-2 ring-2");
|
|
11
11
|
@source inline("{bg,border,text}-clx-{surface,surface-2,surface-3,bg,text,text-label,text-muted,text-subtle,text-faint,border,border-soft}");
|
|
12
|
-
@source inline("placeholder:text-clx-
|
|
12
|
+
@source inline("placeholder:text-clx-placeholder");
|
|
13
13
|
|
|
14
14
|
/* ── Shared backdrop base ── */
|
|
15
15
|
.clx-modal-backdrop,
|
package/fesm2022/codexly-ui.mjs
CHANGED
|
@@ -2008,7 +2008,8 @@ const CLX_BG_SECTION = 'bg-clx-surface-2'; // card/modal header+footer
|
|
|
2008
2008
|
const CLX_BG_ICON_WRAP = 'bg-clx-surface-3'; // empty-state icon wrapper
|
|
2009
2009
|
const CLX_BG_ADDON = 'bg-clx-surface-3'; // prefix/suffix text addon
|
|
2010
2010
|
// ── Placeholder ───────────────────────────────────────────────────────────────
|
|
2011
|
-
|
|
2011
|
+
// Fixed color independent of --clx-text-subtle — see _theme.css for why.
|
|
2012
|
+
const CLX_PLACEHOLDER = 'placeholder:text-clx-placeholder';
|
|
2012
2013
|
// ── Disabled borders ──────────────────────────────────────────────────────────
|
|
2013
2014
|
const CLX_BORDER_DISABLED = 'border-clx-border';
|
|
2014
2015
|
// ── Addon (prefix/suffix text) ────────────────────────────────────────────────
|