Madhura68
3eaaacaeb8
Schema-uitbreidingen voor de sprint-niveau jobflow (PBI-46): - TaskStatus, StoryStatus, PbiStatus, SprintStatus krijgen FAILED - Nieuwe enums: SprintRunStatus, PrStrategy - Nieuw SprintRun-model dat per-task ClaudeJobs groepeert - ClaudeJob.sprint_run_id koppeling + index - Product.pr_strategy (default SPRINT) - Bijhorende Prisma-migratie propagateStatusUpwards vervangt updateTaskStatusWithStoryPromotion en herevalueert de keten Task → Story → PBI → Sprint → SprintRun bij elke task-statuswijziging. Bij FAILED cancelt het sibling-jobs in dezelfde SprintRun. PBI-status BLOCKED blijft handmatig en wordt niet overschreven. Status-mappers + theme krijgen failed-token + label-uitbreidingen. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
396 lines
12 KiB
CSS
396 lines
12 KiB
CSS
@custom-variant dark (&:is(.dark *));
|
|
|
|
:root {
|
|
--font-size: 16px;
|
|
|
|
/* MD3 Surface Colors */
|
|
--background: #fdfcff;
|
|
--foreground: #1b1b1f;
|
|
--surface: #fdfcff;
|
|
--surface-dim: #dbd9e0;
|
|
--surface-bright: #fdfcff;
|
|
--surface-container-lowest: #ffffff;
|
|
--surface-container-low: #f7f5fc;
|
|
--surface-container: #f1eff6;
|
|
--surface-container-high: #ebeaf0;
|
|
--surface-container-highest: #e6e3ea;
|
|
|
|
/* MD3 Primary Color (Blue - Productivity) */
|
|
--primary: #0061a4;
|
|
--primary-foreground: #ffffff;
|
|
--primary-container: #d1e4ff;
|
|
--primary-container-foreground: #001d36;
|
|
--on-primary: #ffffff;
|
|
|
|
/* MD3 Secondary Color (Purple - Planning) */
|
|
--secondary: #5b5e71;
|
|
--secondary-foreground: #ffffff;
|
|
--secondary-container: #dfe1f9;
|
|
--secondary-container-foreground: #181b2c;
|
|
--on-secondary: #ffffff;
|
|
|
|
/* MD3 Tertiary Color (Teal - Progress) */
|
|
--tertiary: #006874;
|
|
--tertiary-foreground: #ffffff;
|
|
--tertiary-container: #97f0ff;
|
|
--tertiary-container-foreground: #001f24;
|
|
|
|
/* Semantic State Colors */
|
|
--success: #006e1c;
|
|
--success-foreground: #ffffff;
|
|
--success-container: #92f894;
|
|
--success-container-foreground: #002204;
|
|
|
|
--warning: #735b00;
|
|
--warning-foreground: #ffffff;
|
|
--warning-container: #ffdf9d;
|
|
--warning-container-foreground: #231b00;
|
|
|
|
--error: #ba1a1a;
|
|
--error-foreground: #ffffff;
|
|
--error-container: #ffdad6;
|
|
--error-container-foreground: #410002;
|
|
|
|
--info: #006493;
|
|
--info-foreground: #ffffff;
|
|
--info-container: #c9e6ff;
|
|
--info-container-foreground: #001e2f;
|
|
|
|
/* Legacy shadcn mappings */
|
|
--card: var(--surface-container-low);
|
|
--card-foreground: var(--foreground);
|
|
--popover: var(--surface-container);
|
|
--popover-foreground: var(--foreground);
|
|
--muted: var(--surface-container-high);
|
|
--muted-foreground: #45464f;
|
|
--accent: var(--secondary-container);
|
|
--accent-foreground: var(--secondary-container-foreground);
|
|
--destructive: var(--error);
|
|
--destructive-foreground: var(--error-foreground);
|
|
--border: #c5c6d0;
|
|
--input: transparent;
|
|
--input-background: var(--surface-container);
|
|
--switch-background: #79767d;
|
|
--ring: var(--primary);
|
|
|
|
/* MD3 Outline Variant */
|
|
--outline-variant: #c5c6d0;
|
|
|
|
/* MD3 On-Error-Container */
|
|
--on-error-container: #410002;
|
|
|
|
/* Project Management Specific Colors */
|
|
--status-todo: #6750a4;
|
|
--status-in-progress: #0061a4;
|
|
--status-review: #7b5ea7;
|
|
--status-done: #006e1c;
|
|
--status-blocked: #ba1a1a;
|
|
--status-failed: #93000a;
|
|
|
|
--priority-critical: #ba1a1a;
|
|
--priority-high: #c75300;
|
|
--priority-medium: #735b00;
|
|
--priority-low: #006874;
|
|
|
|
/* Chart Colors */
|
|
--chart-1: var(--primary);
|
|
--chart-2: var(--secondary);
|
|
--chart-3: var(--tertiary);
|
|
--chart-4: var(--success);
|
|
--chart-5: var(--warning);
|
|
|
|
--font-weight-medium: 500;
|
|
--font-weight-normal: 400;
|
|
--radius: 0.75rem;
|
|
|
|
/* Sidebar */
|
|
--sidebar: var(--surface-container-low);
|
|
--sidebar-foreground: var(--foreground);
|
|
--sidebar-primary: var(--primary);
|
|
--sidebar-primary-foreground: var(--primary-foreground);
|
|
--sidebar-accent: var(--surface-container-high);
|
|
--sidebar-accent-foreground: var(--foreground);
|
|
--sidebar-border: var(--border);
|
|
--sidebar-ring: var(--primary);
|
|
}
|
|
|
|
.dark {
|
|
/* MD3 Dark Surface Colors */
|
|
--background: #1b1b1f;
|
|
--foreground: #e4e1e9;
|
|
--surface: #1b1b1f;
|
|
--surface-dim: #1b1b1f;
|
|
--surface-bright: #413f47;
|
|
--surface-container-lowest: #0f0e13;
|
|
--surface-container-low: #232227;
|
|
--surface-container: #27262b;
|
|
--surface-container-high: #322f36;
|
|
--surface-container-highest: #3d3a41;
|
|
|
|
/* MD3 Primary Color (Blue) */
|
|
--primary: #9fcbfa;
|
|
--primary-foreground: #003257;
|
|
--primary-container: #00497b;
|
|
--primary-container-foreground: #d1e4ff;
|
|
--on-primary: #003257;
|
|
|
|
/* MD3 Secondary Color (Purple) */
|
|
--secondary: #c3c4dd;
|
|
--secondary-foreground: #2c2f42;
|
|
--secondary-container: #434659;
|
|
--secondary-container-foreground: #dfe1f9;
|
|
--on-secondary: #2c2f42;
|
|
|
|
/* MD3 Tertiary Color (Teal) */
|
|
--tertiary: #4fd8eb;
|
|
--tertiary-foreground: #00363d;
|
|
--tertiary-container: #004f58;
|
|
--tertiary-container-foreground: #97f0ff;
|
|
|
|
/* Semantic State Colors */
|
|
--success: #77db77;
|
|
--success-foreground: #00390a;
|
|
--success-container: #005313;
|
|
--success-container-foreground: #92f894;
|
|
|
|
--warning: #efc047;
|
|
--warning-foreground: #3c2f00;
|
|
--warning-container: #574400;
|
|
--warning-container-foreground: #ffdf9d;
|
|
|
|
--error: #ffb4ab;
|
|
--error-foreground: #690005;
|
|
--error-container: #93000a;
|
|
--error-container-foreground: #ffdad6;
|
|
|
|
--info: #87ceff;
|
|
--info-foreground: #00344d;
|
|
--info-container: #004c6d;
|
|
--info-container-foreground: #c9e6ff;
|
|
|
|
/* Legacy shadcn mappings */
|
|
--card: var(--surface-container-low);
|
|
--card-foreground: var(--foreground);
|
|
--popover: var(--surface-container);
|
|
--popover-foreground: var(--foreground);
|
|
--muted: var(--surface-container-high);
|
|
--muted-foreground: #c5c6d0;
|
|
--accent: var(--secondary-container);
|
|
--accent-foreground: var(--secondary-container-foreground);
|
|
--destructive: var(--error);
|
|
--destructive-foreground: var(--error-container-foreground);
|
|
--border: #45464f;
|
|
--input: transparent;
|
|
--input-background: var(--surface-container);
|
|
--switch-background: #898790;
|
|
--ring: var(--primary);
|
|
|
|
/* MD3 Outline Variant */
|
|
--outline-variant: #45464f;
|
|
|
|
/* MD3 On-Error-Container */
|
|
--on-error-container: #ffdad6;
|
|
|
|
/* Project Management Specific Colors */
|
|
--status-todo: #cfbdfe;
|
|
--status-in-progress: #9fcbfa;
|
|
--status-review: #c9b6ef;
|
|
--status-done: #77db77;
|
|
--status-blocked: #ffb4ab;
|
|
--status-failed: #ff8a80;
|
|
|
|
--priority-critical: #ffb4ab;
|
|
--priority-high: #ffb68d;
|
|
--priority-medium: #efc047;
|
|
--priority-low: #4fd8eb;
|
|
|
|
/* Chart Colors */
|
|
--chart-1: var(--primary);
|
|
--chart-2: var(--secondary);
|
|
--chart-3: var(--tertiary);
|
|
--chart-4: var(--success);
|
|
--chart-5: var(--warning);
|
|
|
|
/* Sidebar */
|
|
--sidebar: var(--surface-container-low);
|
|
--sidebar-foreground: var(--foreground);
|
|
--sidebar-primary: var(--primary);
|
|
--sidebar-primary-foreground: var(--primary-container);
|
|
--sidebar-accent: var(--surface-container-high);
|
|
--sidebar-accent-foreground: var(--foreground);
|
|
--sidebar-border: var(--border);
|
|
--sidebar-ring: var(--primary);
|
|
}
|
|
|
|
@theme inline {
|
|
/* Base colors */
|
|
--color-background: var(--background);
|
|
--color-foreground: var(--foreground);
|
|
|
|
/* MD3 Surface colors */
|
|
--color-surface: var(--surface);
|
|
--color-surface-dim: var(--surface-dim);
|
|
--color-surface-bright: var(--surface-bright);
|
|
--color-surface-container-lowest: var(--surface-container-lowest);
|
|
--color-surface-container-low: var(--surface-container-low);
|
|
--color-surface-container: var(--surface-container);
|
|
--color-surface-container-high: var(--surface-container-high);
|
|
--color-surface-container-highest: var(--surface-container-highest);
|
|
|
|
/* MD3 Primary color */
|
|
--color-primary: var(--primary);
|
|
--color-primary-foreground: var(--primary-foreground);
|
|
--color-primary-container: var(--primary-container);
|
|
--color-primary-container-foreground: var(--primary-container-foreground);
|
|
--color-on-primary: var(--on-primary);
|
|
|
|
/* MD3 Secondary color */
|
|
--color-secondary: var(--secondary);
|
|
--color-secondary-foreground: var(--secondary-foreground);
|
|
--color-secondary-container: var(--secondary-container);
|
|
--color-secondary-container-foreground: var(--secondary-container-foreground);
|
|
--color-on-secondary: var(--on-secondary);
|
|
|
|
/* MD3 Tertiary color */
|
|
--color-tertiary: var(--tertiary);
|
|
--color-tertiary-foreground: var(--tertiary-foreground);
|
|
--color-tertiary-container: var(--tertiary-container);
|
|
--color-tertiary-container-foreground: var(--tertiary-container-foreground);
|
|
|
|
/* Semantic states */
|
|
--color-success: var(--success);
|
|
--color-success-foreground: var(--success-foreground);
|
|
--color-success-container: var(--success-container);
|
|
--color-success-container-foreground: var(--success-container-foreground);
|
|
|
|
--color-warning: var(--warning);
|
|
--color-warning-foreground: var(--warning-foreground);
|
|
--color-warning-container: var(--warning-container);
|
|
--color-warning-container-foreground: var(--warning-container-foreground);
|
|
|
|
--color-error: var(--error);
|
|
--color-error-foreground: var(--error-foreground);
|
|
--color-error-container: var(--error-container);
|
|
--color-error-container-foreground: var(--error-container-foreground);
|
|
--color-on-error-container: var(--on-error-container);
|
|
|
|
--color-info: var(--info);
|
|
--color-info-foreground: var(--info-foreground);
|
|
--color-info-container: var(--info-container);
|
|
--color-info-container-foreground: var(--info-container-foreground);
|
|
|
|
/* Legacy shadcn */
|
|
--color-card: var(--card);
|
|
--color-card-foreground: var(--card-foreground);
|
|
--color-popover: var(--popover);
|
|
--color-popover-foreground: var(--popover-foreground);
|
|
--color-muted: var(--muted);
|
|
--color-muted-foreground: var(--muted-foreground);
|
|
--color-accent: var(--accent);
|
|
--color-accent-foreground: var(--accent-foreground);
|
|
--color-destructive: var(--destructive);
|
|
--color-destructive-foreground: var(--destructive-foreground);
|
|
--color-outline-variant: var(--outline-variant);
|
|
--color-border: var(--border);
|
|
--color-input: var(--input);
|
|
--color-input-background: var(--input-background);
|
|
--color-switch-background: var(--switch-background);
|
|
--color-ring: var(--ring);
|
|
|
|
/* Project management colors */
|
|
--color-status-todo: var(--status-todo);
|
|
--color-status-in-progress: var(--status-in-progress);
|
|
--color-status-review: var(--status-review);
|
|
--color-status-done: var(--status-done);
|
|
--color-status-blocked: var(--status-blocked);
|
|
--color-status-failed: var(--status-failed);
|
|
|
|
--color-priority-critical: var(--priority-critical);
|
|
--color-priority-high: var(--priority-high);
|
|
--color-priority-medium: var(--priority-medium);
|
|
--color-priority-low: var(--priority-low);
|
|
|
|
/* Charts */
|
|
--color-chart-1: var(--chart-1);
|
|
--color-chart-2: var(--chart-2);
|
|
--color-chart-3: var(--chart-3);
|
|
--color-chart-4: var(--chart-4);
|
|
--color-chart-5: var(--chart-5);
|
|
|
|
/* Radius */
|
|
--radius-sm: calc(var(--radius) - 4px);
|
|
--radius-md: calc(var(--radius) - 2px);
|
|
--radius-lg: var(--radius);
|
|
--radius-xl: calc(var(--radius) + 4px);
|
|
|
|
/* Sidebar */
|
|
--color-sidebar: var(--sidebar);
|
|
--color-sidebar-foreground: var(--sidebar-foreground);
|
|
--color-sidebar-primary: var(--sidebar-primary);
|
|
--color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
|
|
--color-sidebar-accent: var(--sidebar-accent);
|
|
--color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
|
|
--color-sidebar-border: var(--sidebar-border);
|
|
--color-sidebar-ring: var(--sidebar-ring);
|
|
}
|
|
|
|
@layer base {
|
|
* {
|
|
@apply border-border outline-ring/50;
|
|
}
|
|
|
|
body {
|
|
@apply bg-background text-foreground;
|
|
}
|
|
|
|
/**
|
|
* Default typography styles for HTML elements (h1-h4, p, label, button, input).
|
|
* These are in @layer base, so Tailwind utility classes (like text-sm, text-lg) automatically override them.
|
|
*/
|
|
|
|
html {
|
|
font-size: var(--font-size);
|
|
}
|
|
|
|
h1 {
|
|
font-size: var(--text-2xl);
|
|
font-weight: var(--font-weight-medium);
|
|
line-height: 1.5;
|
|
}
|
|
|
|
h2 {
|
|
font-size: var(--text-xl);
|
|
font-weight: var(--font-weight-medium);
|
|
line-height: 1.5;
|
|
}
|
|
|
|
h3 {
|
|
font-size: var(--text-lg);
|
|
font-weight: var(--font-weight-medium);
|
|
line-height: 1.5;
|
|
}
|
|
|
|
h4 {
|
|
font-size: var(--text-base);
|
|
font-weight: var(--font-weight-medium);
|
|
line-height: 1.5;
|
|
}
|
|
|
|
label {
|
|
font-size: var(--text-base);
|
|
font-weight: var(--font-weight-medium);
|
|
line-height: 1.5;
|
|
}
|
|
|
|
button {
|
|
font-size: var(--text-base);
|
|
font-weight: var(--font-weight-medium);
|
|
line-height: 1.5;
|
|
}
|
|
|
|
input {
|
|
font-size: var(--text-base);
|
|
font-weight: var(--font-weight-normal);
|
|
line-height: 1.5;
|
|
}
|
|
}
|