[CLAUDE] FE-Admin+FE-User: brand identity từ Solutions logo
All checks were successful
Deploy SOLUTION_ERP / build-deploy (push) Successful in 2m54s
All checks were successful
Deploy SOLUTION_ERP / build-deploy (push) Successful in 2m54s
Lấy logo gốc từ template docx (SOL-CCM-FO-002.05) và brand color exact pixel-sampled #1F7DC1 từ chữ "Solutions". Thay đổi: - logo.png (407x145, từ header docx) đặt vào /public cả 2 app - favicon.svg: "S" trắng trên nền vuông brand blue bo góc - index.css: palette brand-50..900 generate quanh #1F7DC1 + accent red-500/600 cho ® mark + font Be Vietnam Pro (Google Fonts, designed cho tiếng Việt, diacritics đẹp) với fallback Inter + JetBrains Mono cho font-mono + tùy chỉnh scrollbar - Layout sidebar: logo.png 32px + "Admin"/"ERP" subtitle (thay text "SOLUTION ERP" đơn điệu) - LoginPage: gradient background brand-50 + 2 decorative orbs blur, rounded-2xl card + backdrop-blur, big logo 56px + subtitle tracking-[0.2em] - index.html: lang="vi", title "Solutions ERP · Admin" / "Solutions ERP", theme-color #1F7DC1 cho mobile address bar, preconnect fonts.gstatic.com để load Google Fonts nhanh hơn Tất cả màu hardcoded trong component đã dùng `brand-600` → tự map sang palette mới, không cần đổi logic. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
@ -1,11 +1,26 @@
|
||||
@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 {
|
||||
--color-brand-50: #ecfdf5;
|
||||
--color-brand-500: #059669;
|
||||
--color-brand-600: #047857;
|
||||
--color-brand-700: #065f46;
|
||||
--font-sans: "Inter", system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
|
||||
/* 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 {
|
||||
@ -17,4 +32,23 @@ body {
|
||||
background-color: #f8fafc;
|
||||
color: #0f172a;
|
||||
font-family: var(--font-sans);
|
||||
font-feature-settings: "cv11", "ss01", "ss03";
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
text-rendering: optimizeLegibility;
|
||||
}
|
||||
|
||||
::-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;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user