346bd5d644
All checks were successful
Deploy SOLUTION_ERP / build-deploy (push) Successful in 2m54s
Typography base (both apps): - 14px base, line-height 1.55, letter-spacing -0.003em — Be Vietnam Pro render chắc hơn, dấu tiếng Việt rõ hơn - h1/h2 tracking tighter (-0.018em), h1 weight 700, h2 weight 600 - Tabular numbers trong <table> (tự động align cột số) PageHeader: - Title text-[22px] thay vì text-xl — hierarchy mạnh hơn - Border-bottom + pb-5 thay flat layout — content-area rõ vùng - Description leading-relaxed + slate-500 — dễ đọc hơn Button: - shadow-sm + color-tinted shadow (brand/20, red/20) cho primary/ danger — có chiều sâu - active:translate-y-[0.5px] micro-press feedback - Ring offset 2 (thay 1) + offset-white — focus ring tách rõ Input/Select/Textarea: - h-9 thay h-10 — phù hợp dense table layouts - shadow-[inset_0_1px_0_...] — inset highlight tinh tế - Focus: border-brand-500 + ring-brand-500/20 — 2 lớp chỉ báo - Disabled: bg-slate-50 + opacity-70 — rõ disabled state DataTable: - rounded-xl + shadow-sm + border-200/80 — card feel nhẹ nhàng hơn - Header: UPPERCASE text-[11px] tracking-wider — ERP enterprise look - Row hover: bg-brand-50/40 (thay slate-50) — brand-tinted hover - Padding tăng từ px-3 py-2 → px-4 py-2.5 — breathing room Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
72 lines
1.7 KiB
CSS
72 lines
1.7 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;
|
|
}
|
|
|
|
h1, h2, h3, h4 {
|
|
letter-spacing: -0.018em;
|
|
color: #0f172a;
|
|
}
|
|
h1 { font-weight: 700; }
|
|
h2 { font-weight: 600; }
|
|
|
|
table, .tabular-nums {
|
|
font-variant-numeric: tabular-nums;
|
|
}
|
|
|
|
input:focus-visible, textarea:focus-visible, select:focus-visible, button:focus-visible {
|
|
outline: none;
|
|
}
|
|
|
|
::-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;
|
|
}
|