7feb53ee20
All checks were successful
Deploy SOLUTION_ERP / build-deploy (push) Successful in 4m24s
Tham khảo NAMGROUP density conventions, GIỮ brand #1F7DC1 + Be Vietnam Pro. - index.css: density heading ladder (semibold, drop font-bold) + .label-eyebrow util - 6 UI primitives (Button/Input/Label/Select/Textarea/Dialog): text-xs font-semibold, py-1.5 ≤36px, rounded-lg, brand focus-ring - 6 shell (DataTable sticky-thead+RowActions/Layout brand-rail/TopBar/PageHeader/PhaseBadge/EmptyState) - DashboardPage flagship: KPI cards + brand-tinted icon chips + uppercase labels Visual-only — functionality unchanged (Button variant/size keys stable 51 call-sites, props/forwardRef intact). build 0 TS err. reviewer PASS 0 blocker (2 minor slate-400 hint a11y defer). fe-admin only (fe-user mirror = Phase 3). Dashboard live-visual blocked by dev auth-rig → xem live sau deploy. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
87 lines
2.3 KiB
CSS
87 lines
2.3 KiB
CSS
@import "tailwindcss";
|
|
|
|
@import url("https://fonts.googleapis.com/css2?family=Be+Vietnam+Pro:wght@300;400;500;600;700;800&family=JetBrains+Mono:wght@400;600&display=swap");
|
|
|
|
@theme {
|
|
/* Solutions brand palette (derived from logo #1F7DC1) */
|
|
--color-brand-50: #f0f7fc;
|
|
--color-brand-100: #dbeaf7;
|
|
--color-brand-200: #b8d5ef;
|
|
--color-brand-300: #8bbae3;
|
|
--color-brand-400: #5499d3;
|
|
--color-brand-500: #2e85c7;
|
|
--color-brand-600: #1f7dc1; /* exact logo blue */
|
|
--color-brand-700: #1b6aa3;
|
|
--color-brand-800: #175685;
|
|
--color-brand-900: #144868;
|
|
|
|
/* Accent red from ® mark */
|
|
--color-accent-500: #dc2626;
|
|
--color-accent-600: #b91c1c;
|
|
|
|
--font-sans: "Be Vietnam Pro", "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
|
|
--font-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
|
|
}
|
|
|
|
html, body, #root {
|
|
height: 100%;
|
|
}
|
|
|
|
body {
|
|
margin: 0;
|
|
background-color: #f8fafc;
|
|
color: #0f172a;
|
|
font-family: var(--font-sans);
|
|
font-size: 14px;
|
|
line-height: 1.55;
|
|
letter-spacing: -0.003em;
|
|
-webkit-font-smoothing: antialiased;
|
|
-moz-osx-font-smoothing: grayscale;
|
|
text-rendering: optimizeLegibility;
|
|
}
|
|
|
|
/* Heading tightening + better hierarchy with Be Vietnam Pro.
|
|
Density-first (NAMGROUP convention): semibold ladder, never font-bold —
|
|
weight carries hierarchy without shouting. */
|
|
h1, h2, h3, h4 {
|
|
letter-spacing: -0.014em;
|
|
color: #0f172a;
|
|
font-weight: 600;
|
|
}
|
|
|
|
/* Section / form labels — uppercase scan-pattern shared across the app.
|
|
Use class="label-eyebrow" for the dense ERP label treatment. */
|
|
.label-eyebrow {
|
|
font-size: 11px;
|
|
font-weight: 600;
|
|
letter-spacing: 0.06em;
|
|
text-transform: uppercase;
|
|
color: #64748b; /* slate-500 — WCAG-AA on white (4.6:1) */
|
|
}
|
|
|
|
/* Tabular numbers in tables + stat cards for better alignment */
|
|
table, .tabular-nums {
|
|
font-variant-numeric: tabular-nums;
|
|
}
|
|
|
|
/* Smoother form focus */
|
|
input:focus-visible, textarea:focus-visible, select:focus-visible, button:focus-visible {
|
|
outline: none;
|
|
}
|
|
|
|
/* Subtle scrollbar that fits the brand */
|
|
::-webkit-scrollbar {
|
|
width: 8px;
|
|
height: 8px;
|
|
}
|
|
::-webkit-scrollbar-track {
|
|
background: transparent;
|
|
}
|
|
::-webkit-scrollbar-thumb {
|
|
background: #cbd5e1;
|
|
border-radius: 4px;
|
|
}
|
|
::-webkit-scrollbar-thumb:hover {
|
|
background: #94a3b8;
|
|
}
|