Nean Styleguide

Purpose

Enforce design quality and brand differentiation. Complements security, NFR, and coding standards skills.

For brand identity (colors, fonts, design direction, anti-patterns), see /shared-brand.

PrimeNG customization

• Never use default PrimeNG themes unchanged
• Customize theme via CSS variables or custom SCSS
• Ensure components match brand aesthetic
• Override default spacing and typography

NEAN-specific anti-patterns

• Default PrimeNG examples shipped unchanged
• Template SaaS layouts with no variation

Requirements

Responsive

• Mobile, tablet, desktop, large desktop
• Layouts adapt intentionally, not merely shrink
• Navigation patterns may change by breakpoint
• PrimeNG responsive utilities + Tailwind breakpoints

Accessibility

• WCAG 2.1 AA minimum
• Keyboard navigation with visible focus states
• Respect prefers-reduced-motion
• Proper ARIA labels on interactive elements
• PrimeNG components are accessible by default; don't break this

Browser support

• Chrome, Safari (including iOS), Firefox, Edge (latest)
• Mobile Safari mandatory; no Chromium-only behavior

Reference

For semantic tokens, breakpoints, and detailed patterns, see reference/nean-styleguide-reference.md