Add comprehensive semantic design token system

Implement complete semantic layer for all design tokens including typography, spacing, motion, colors, borders, shadows, z-index, opacity, and glass effects. Each semantic token maps base design tokens to contextual usage patterns for improved maintainability and developer experience.

Features:
- Complete semantic typography system with font weights, sizes, line heights, and letter spacing
- Comprehensive spacing tokens for components, layouts, and interactions
- Full motion system with durations, easing, transitions, and hover transforms
- Semantic color system with individual access to all Material Design 3 colors
- Border tokens with widths, radius, and styles for all use cases
- Shadow system including standard and AI-themed shadows
- Z-index layering system for proper stacking context
- Opacity tokens for transparency and visibility states
- Glass morphism tokens with blur, opacity, and theming support

All semantic tokens provide direct access to base token values while offering meaningful contextual aliases for common UI patterns.

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
skyai_dev
2025-09-02 10:24:04 +10:00
parent cd3211101c
commit c803831f60
193 changed files with 23363 additions and 0 deletions

View File

@@ -0,0 +1,50 @@
// Font Awesome exports
export { FaIconComponent } from '@fortawesome/angular-fontawesome';
export { configureFontAwesome } from './font-awesome.config';
// Re-export commonly used icon definitions
export {
faUser,
faHome,
faCog,
faSearch,
faPlus,
faEdit,
faTrash,
faSave,
faCancel,
faCheck,
faTimes,
faArrowLeft,
faArrowRight,
faChevronLeft,
faChevronRight,
faChevronUp,
faChevronDown,
faBars,
faEllipsisV,
faEye,
faEyeSlash,
faDownload,
faUpload,
faRefresh,
faSpinner,
faExclamationTriangle,
faInfoCircle,
faCheckCircle,
faTimesCircle
} from '@fortawesome/free-solid-svg-icons';
export {
faHeart,
faBookmark,
faComment,
faThumbsUp
} from '@fortawesome/free-regular-svg-icons';
export {
faGithub,
faTwitter,
faLinkedin,
faGoogle
} from '@fortawesome/free-brands-svg-icons';