16 lines
1.2 KiB
Markdown
16 lines
1.2 KiB
Markdown
# Frontend Design Rules
|
|
|
|
## Routing Rule
|
|
ROUTING RULE: You must structure the Next.js App Router strictly by business domains. The allowed directories are exactly: /app/(dashboard)/jobs, /app/(dashboard)/candidates, /app/(dashboard)/interviews, and /app/(dashboard)/workflows.
|
|
|
|
## Styling Whitelist
|
|
STYLING WHITELIST: You are restricted to a neutral, professional Human Resources design system. You must ONLY use the following Tailwind CSS tokens:
|
|
- **Backgrounds:** `bg-slate-50` for main layouts, `bg-white` for cards/surfaces.
|
|
- **Text:** `text-slate-900` for headings, `text-slate-600` for body text, `text-slate-500` for secondary labels.
|
|
- **Primary Actions (Buttons/Links):** `bg-blue-600` for backgrounds, `hover:bg-blue-700` for hover states, `text-white` for text.
|
|
- **Borders & Dividers:** `border-slate-200`.
|
|
- **Border Radius:** strictly `rounded-md` or `rounded-lg`. Do not use full rounding unless it is an avatar.
|
|
- **Shadows:** strictly `shadow-sm` for cards, `shadow-md` for modals/dropdowns.
|
|
|
|
## UI Component Rule
|
|
UI COMPONENT RULE: Build and reuse standard components (e.g., `<PrimaryButton>`, `<StatusBadge>`, `<DataCard>`). Do not invent new visual styles outside of the allowed tokens.
|