Initial commit

2025-12-04 22:24:47 +01:00
commit 453ce10494
106 changed files with 17145 additions and 0 deletions
--- a/frontend/src/styles/theme/dimensions.css
+++ b/frontend/src/styles/theme/dimensions.css
@@ -0,0 +1,154 @@
+/* ==========================================
+   DIMENSIONS & SPACING
+   ========================================== */
+
+:root {
+  /* Spacing Scale (based on 0.25rem = 4px) */
+  --space-0: 0;
+  --space-1: 0.25rem;
+  /* 4px */
+  --space-2: 0.5rem;
+  /* 8px */
+  --space-3: 0.75rem;
+  /* 12px */
+  --space-4: 1rem;
+  /* 16px */
+  --space-5: 1.25rem;
+  /* 20px */
+  --space-6: 1.5rem;
+  /* 24px */
+  --space-8: 2rem;
+  /* 32px */
+  --space-10: 2.5rem;
+  /* 40px */
+  --space-12: 3rem;
+  /* 48px */
+  --space-16: 4rem;
+  /* 64px */
+  --space-20: 5rem;
+  /* 80px */
+
+  /* Border Radius */
+  --radius-sm: 4px;
+  --radius-md: 6px;
+  --radius-lg: 8px;
+  --radius-xl: 12px;
+  --radius-full: 9999px;
+
+  /* Component Heights */
+  --height-button: 36px;
+  --height-input: 40px;
+  --height-nav-item: 40px;
+  --height-header: 70px;
+
+  /* Sidebar Dimensions */
+  /* Sidebar is positioned at left: 1rem (16px) with these widths */
+  /* margin-left = left offset (16px) + sidebar width */
+  --sidebar-width: 276px;
+  /* 16px offset + 260px width */
+  --sidebar-width-collapsed: 96px;
+  /* 16px offset + 80px width */
+  --sidebar-mobile-width: 280px;
+
+  /* Page Layout Spacing */
+  --page-padding-x: 2rem;
+  /* Horizontal padding for page content */
+  --page-padding-y: 2rem;
+  /* Vertical padding for page content */
+  --page-padding-x-tablet: 1.5rem;
+  --page-padding-y-tablet: 1.5rem;
+  --page-padding-x-mobile: 1rem;
+  --page-padding-y-mobile: 1rem;
+  --page-max-width: 1400px;
+  /* Maximum content width */
+
+  /* Container Widths */
+  --container-sm: 640px;
+  --container-md: 768px;
+  --container-lg: 1024px;
+  --container-xl: 1280px;
+
+  /* Z-index Scale */
+  --z-dropdown: 100;
+  --z-sticky: 200;
+  --z-fixed: 300;
+  --z-modal-backdrop: 1000;
+  --z-modal: 1001;
+  --z-popover: 1002;
+  --z-tooltip: 1003;
+
+  /* Icon Sizes */
+  --icon-xs: 16px;
+  --icon-sm: 18px;
+  --icon-md: 20px;
+  --icon-lg: 24px;
+  --icon-xl: 32px;
+
+  /* Button Sizes */
+  --btn-padding-sm: 0.5rem 1rem;
+  --btn-padding-md: 0.625rem 1.25rem;
+  --btn-font-size: 0.95rem;
+  --btn-font-size-sm: 0.875rem;
+  --btn-height: 36px;
+  --btn-height-sm: 32px;
+
+  /* Icon Button Sizes */
+  --btn-icon-sm: 32px;
+  --btn-icon-md: 36px;
+  --btn-icon-lg: 48px;
+
+  /* Badge Sizes */
+  --badge-padding: 0.25rem 0.625rem;
+  --badge-font-size: 0.8rem;
+
+  /* Semantic Spacing - Cards & Containers */
+  --card-padding: 0.875rem;
+  /* Reduced from 1rem */
+  --card-padding-sm: 0.625rem;
+  /* Reduced from 0.75rem */
+  --card-gap: 0.625rem;
+  /* Reduced from 0.75rem */
+  --card-gap-lg: 0.875rem;
+  /* Reduced from 1rem */
+
+  /* Semantic Spacing - Sections */
+  --section-gap: 1.25rem;
+  /* Reduced from 1.5rem */
+  --section-gap-sm: 0.875rem;
+  /* Reduced from 1rem */
+
+  /* Semantic Spacing - Elements */
+  --element-gap: 0.375rem;
+  /* Reduced from 0.5rem */
+  --element-gap-sm: 0.25rem;
+  /* Kept same */
+  --element-gap-lg: 0.625rem;
+  /* Reduced from 0.75rem */
+
+  /* Semantic Spacing - Toolbar & Header */
+  --toolbar-gap: 0.625rem;
+  /* Reduced from 0.75rem */
+  --toolbar-padding: 0.75rem;
+  /* Reduced from 1rem */
+
+  /* Semantic Spacing - Table */
+  --table-cell-padding: 0.625rem 0.875rem;
+  /* Reduced from 0.75rem 1rem */
+  --table-cell-padding-sm: 0.5rem 0.75rem;
+  /* Kept same */
+
+  /* Tab Sizes */
+  --tab-padding: 0.625rem 1rem;
+  /* Reduced from 0.75rem 1.25rem */
+  --tab-font-size: 0.95rem;
+
+  /* Input Sizes */
+  --input-padding: 0.625rem 0.875rem;
+  /* Reduced from 0.75rem 1rem */
+  --input-font-size: 0.95rem;
+
+  /* Breakpoints (for reference in media queries) */
+  --breakpoint-mobile: 768px;
+  --breakpoint-tablet: 1024px;
+  --breakpoint-desktop: 1280px;
+}