48 lines
639 B
Plaintext
48 lines
639 B
Plaintext
---
|
|
description: SFERA UI rules
|
|
globs:
|
|
- "src/**/*.tsx"
|
|
- "src/**/*.ts"
|
|
alwaysApply: true
|
|
---
|
|
|
|
# SFERA UI Rules
|
|
|
|
Use:
|
|
- Next.js
|
|
- React
|
|
- TypeScript
|
|
- Tailwind
|
|
- shadcn/ui
|
|
- lucide-react
|
|
- TanStack Table
|
|
- Zod
|
|
- React Hook Form
|
|
|
|
Do not use:
|
|
- Bootstrap
|
|
- random colors
|
|
- inline styles
|
|
- huge components
|
|
- business logic inside JSX
|
|
|
|
Every page must include:
|
|
- loading state
|
|
- error state
|
|
- empty state
|
|
- permission state where applicable
|
|
|
|
Visual style:
|
|
- enterprise
|
|
- minimal
|
|
- rounded-2xl
|
|
- soft shadows
|
|
- clear hierarchy
|
|
- dark/light ready
|
|
|
|
AI actions must show:
|
|
- selected model
|
|
- token usage
|
|
- project/user limits
|
|
- audit log entry
|