more color theme fixtures and cleanup
This commit is contained in:
@@ -436,7 +436,7 @@ export const BUCKET_DISPLAY: BucketDisplayInfo[] = [
|
||||
minScore: 70,
|
||||
maxScore: 89,
|
||||
backgroundColor: '#F59E0B', // amber-500
|
||||
textColor: '#000000',
|
||||
textColor: '#1C1200',
|
||||
},
|
||||
{
|
||||
bucket: 'Investigate',
|
||||
@@ -722,7 +722,7 @@ export const UNKNOWNS_BAND_DISPLAY: UnknownsBandDisplayInfo[] = [
|
||||
minU: 0.2,
|
||||
maxU: 0.4,
|
||||
backgroundColor: '#CA8A04', // yellow-600
|
||||
textColor: '#FFFFFF',
|
||||
textColor: '#1C1200',
|
||||
lightBackground: '#FEF9C3', // yellow-100
|
||||
},
|
||||
{
|
||||
|
||||
@@ -648,7 +648,7 @@ interface ChannelTypeOption {
|
||||
|
||||
.btn-primary {
|
||||
background: #1976d2;
|
||||
color: white;
|
||||
color: #1C1200;
|
||||
border: none;
|
||||
}
|
||||
|
||||
|
||||
@@ -329,7 +329,7 @@ import {
|
||||
gap: 1.5rem;
|
||||
margin-bottom: 1.5rem;
|
||||
padding: 1rem;
|
||||
background: #f8fafc;
|
||||
background: #FFFCF5;
|
||||
border-radius: 8px;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
@@ -392,7 +392,7 @@ import {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.btn-primary { background: #1976d2; color: white; border: none; }
|
||||
.btn-primary { background: #1976d2; color: #1C1200; border: none; }
|
||||
.btn-secondary { background: white; color: #374151; border: 1px solid #d1d5db; }
|
||||
|
||||
.table-container {
|
||||
|
||||
@@ -251,7 +251,7 @@ import {
|
||||
.section-header p { margin: 0; color: #6b7280; font-size: 0.875rem; }
|
||||
|
||||
.btn { padding: 0.5rem 1rem; border-radius: 6px; font-size: 0.875rem; font-weight: 500; cursor: pointer; }
|
||||
.btn-primary { background: #1976d2; color: white; border: none; }
|
||||
.btn-primary { background: #1976d2; color: #1C1200; border: none; }
|
||||
.btn-primary:disabled { opacity: 0.6; cursor: not-allowed; }
|
||||
.btn-secondary { background: white; color: #374151; border: 1px solid #d1d5db; }
|
||||
.btn-sm { padding: 0.375rem 0.75rem; font-size: 0.75rem; }
|
||||
|
||||
@@ -288,7 +288,7 @@ interface ConfigSubTab {
|
||||
|
||||
.tab-button:hover {
|
||||
color: #1976d2;
|
||||
background: #f8fafc;
|
||||
background: #FFFCF5;
|
||||
}
|
||||
|
||||
.tab-button.active {
|
||||
@@ -390,7 +390,7 @@ interface ConfigSubTab {
|
||||
|
||||
.btn-primary {
|
||||
background: #1976d2;
|
||||
color: white;
|
||||
color: #1C1200;
|
||||
border-color: #1976d2;
|
||||
}
|
||||
|
||||
|
||||
@@ -407,7 +407,7 @@ import {
|
||||
|
||||
.btn-primary {
|
||||
background: #1976d2;
|
||||
color: white;
|
||||
color: #1C1200;
|
||||
border: none;
|
||||
}
|
||||
|
||||
|
||||
@@ -234,7 +234,7 @@ import { NotifierRule, NotifierRuleStatus, NotifierSeverity } from '../../../cor
|
||||
|
||||
.btn-primary {
|
||||
background: #1976d2;
|
||||
color: white;
|
||||
color: #1C1200;
|
||||
border: none;
|
||||
}
|
||||
|
||||
|
||||
@@ -280,7 +280,7 @@ import {
|
||||
}
|
||||
|
||||
.btn { padding: 0.5rem 1rem; border-radius: 6px; font-size: 0.875rem; font-weight: 500; cursor: pointer; }
|
||||
.btn-primary { background: #1976d2; color: white; border: none; }
|
||||
.btn-primary { background: #1976d2; color: #1C1200; border: none; }
|
||||
.btn-primary:disabled { opacity: 0.6; cursor: not-allowed; }
|
||||
.btn-secondary { background: white; color: #374151; border: 1px solid #d1d5db; }
|
||||
.btn-icon { padding: 0.25rem 0.5rem; background: transparent; border: none; color: #1976d2; font-size: 0.75rem; cursor: pointer; }
|
||||
|
||||
@@ -327,7 +327,7 @@ import {
|
||||
.section-header p { margin: 0; color: #6b7280; font-size: 0.875rem; }
|
||||
|
||||
.btn { padding: 0.5rem 1rem; border-radius: 6px; font-size: 0.875rem; font-weight: 500; cursor: pointer; }
|
||||
.btn-primary { background: #1976d2; color: white; border: none; }
|
||||
.btn-primary { background: #1976d2; color: #1C1200; border: none; }
|
||||
.btn-secondary { background: white; color: #374151; border: 1px solid #d1d5db; }
|
||||
.btn-sm { padding: 0.375rem 0.75rem; font-size: 0.75rem; }
|
||||
.btn-icon { padding: 0.25rem 0.5rem; background: transparent; border: none; color: #1976d2; font-size: 0.75rem; cursor: pointer; }
|
||||
|
||||
@@ -232,7 +232,7 @@ import { NotifierQuietHours, NotifierQuietHoursRequest, NotifierQuietWindow } fr
|
||||
.section-header p { margin: 0; color: #6b7280; font-size: 0.875rem; }
|
||||
|
||||
.btn { padding: 0.5rem 1rem; border-radius: 6px; font-size: 0.875rem; font-weight: 500; cursor: pointer; }
|
||||
.btn-primary { background: #1976d2; color: white; border: none; }
|
||||
.btn-primary { background: #1976d2; color: #1C1200; border: none; }
|
||||
.btn-secondary { background: white; color: #374151; border: 1px solid #d1d5db; }
|
||||
.btn-sm { padding: 0.375rem 0.75rem; font-size: 0.75rem; }
|
||||
.btn-icon { padding: 0.25rem 0.5rem; background: transparent; border: none; color: #1976d2; font-size: 0.75rem; cursor: pointer; }
|
||||
|
||||
@@ -341,7 +341,7 @@ import {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.btn-primary { background: #1976d2; color: white; border: none; }
|
||||
.btn-primary { background: #1976d2; color: #1C1200; border: none; }
|
||||
.btn-primary:disabled { opacity: 0.6; cursor: not-allowed; }
|
||||
.btn-secondary { background: white; color: #374151; border: 1px solid #d1d5db; }
|
||||
.btn-secondary:disabled { opacity: 0.6; cursor: not-allowed; }
|
||||
|
||||
@@ -346,7 +346,7 @@ import {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.btn-primary { background: #1976d2; color: white; border: none; }
|
||||
.btn-primary { background: #1976d2; color: #1C1200; border: none; }
|
||||
.btn-primary:disabled { opacity: 0.6; cursor: not-allowed; }
|
||||
.btn-secondary { background: white; color: #374151; border: 1px solid #d1d5db; }
|
||||
.btn-sm { padding: 0.375rem 0.75rem; font-size: 0.75rem; }
|
||||
|
||||
@@ -295,7 +295,7 @@ type ThrottleScope = 'global' | 'channel' | 'rule' | 'event';
|
||||
.section-header p { margin: 0; color: #6b7280; font-size: 0.875rem; }
|
||||
|
||||
.btn { padding: 0.5rem 1rem; border-radius: 6px; font-size: 0.875rem; font-weight: 500; cursor: pointer; }
|
||||
.btn-primary { background: #1976d2; color: white; border: none; }
|
||||
.btn-primary { background: #1976d2; color: #1C1200; border: none; }
|
||||
.btn-primary:disabled { opacity: 0.6; cursor: not-allowed; }
|
||||
.btn-secondary { background: white; color: #374151; border: 1px solid #d1d5db; }
|
||||
.btn-icon { padding: 0.25rem 0.5rem; background: transparent; border: none; color: #1976d2; font-size: 0.75rem; cursor: pointer; }
|
||||
|
||||
@@ -147,7 +147,7 @@ import { ProposedAction, ActionType, ACTION_TYPE_METADATA } from './chat.models'
|
||||
/* Variants */
|
||||
.action-button.variant--primary {
|
||||
background: var(--color-primary, #3b82f6);
|
||||
color: white;
|
||||
color: #1C1200;
|
||||
}
|
||||
.action-button.variant--primary:hover:not(:disabled) {
|
||||
background: var(--color-primary-hover, #2563eb);
|
||||
@@ -155,7 +155,7 @@ import { ProposedAction, ActionType, ACTION_TYPE_METADATA } from './chat.models'
|
||||
|
||||
.action-button.variant--danger {
|
||||
background: var(--color-danger, #ef4444);
|
||||
color: white;
|
||||
color: #1C1200;
|
||||
}
|
||||
.action-button.variant--danger:hover:not(:disabled) {
|
||||
background: var(--color-danger-hover, #dc2626);
|
||||
|
||||
@@ -216,7 +216,7 @@ export const OBJECT_LINK_METADATA: Record<ObjectLinkType, { icon: string; color:
|
||||
vex: { icon: 'shield', color: '#10b981', label: 'VEX' },
|
||||
attest: { icon: 'file-signature', color: '#D4920A', label: 'Attestation' },
|
||||
auth: { icon: 'key', color: '#ef4444', label: 'Auth' },
|
||||
docs: { icon: 'book', color: '#64748b', label: 'Docs' },
|
||||
docs: { icon: 'book', color: '#6B5A2E', label: 'Docs' },
|
||||
finding: { icon: 'alert-triangle', color: '#f97316', label: 'Finding' },
|
||||
scan: { icon: 'search', color: '#0ea5e9', label: 'Scan' },
|
||||
policy: { icon: 'shield-check', color: '#22c55e', label: 'Policy' },
|
||||
|
||||
@@ -149,7 +149,7 @@ import {
|
||||
.chip--vex { --chip-color: #10b981; --chip-bg: rgba(16, 185, 129, 0.1); --chip-border: rgba(16, 185, 129, 0.2); }
|
||||
.chip--attest { --chip-color: #D4920A; --chip-bg: rgba(245, 166, 35, 0.1); --chip-border: rgba(245, 166, 35, 0.2); }
|
||||
.chip--auth { --chip-color: #ef4444; --chip-bg: rgba(239, 68, 68, 0.1); --chip-border: rgba(239, 68, 68, 0.2); }
|
||||
.chip--docs { --chip-color: #64748b; --chip-bg: rgba(100, 116, 139, 0.1); --chip-border: rgba(100, 116, 139, 0.2); }
|
||||
.chip--docs { --chip-color: #6B5A2E; --chip-bg: rgba(100, 116, 139, 0.1); --chip-border: rgba(100, 116, 139, 0.2); }
|
||||
.chip--finding { --chip-color: #f97316; --chip-bg: rgba(249, 115, 22, 0.1); --chip-border: rgba(249, 115, 22, 0.2); }
|
||||
.chip--scan { --chip-color: #0ea5e9; --chip-bg: rgba(14, 165, 233, 0.1); --chip-border: rgba(14, 165, 233, 0.2); }
|
||||
.chip--policy { --chip-color: #22c55e; --chip-bg: rgba(34, 197, 94, 0.1); --chip-border: rgba(34, 197, 94, 0.2); }
|
||||
|
||||
@@ -392,7 +392,7 @@ type ViewMode = 'grid' | 'heatmap' | 'table';
|
||||
|
||||
.btn--primary {
|
||||
background: var(--primary, #3b82f6);
|
||||
color: white;
|
||||
color: #1C1200;
|
||||
|
||||
&:hover {
|
||||
background: var(--primary-hover, #2563eb);
|
||||
|
||||
@@ -531,7 +531,7 @@ type WizardStep = 'environment' | 'configure' | 'install' | 'verify' | 'complete
|
||||
|
||||
.btn--primary {
|
||||
background: var(--primary, #3b82f6);
|
||||
color: white;
|
||||
color: #1C1200;
|
||||
|
||||
&:hover:not(:disabled) {
|
||||
background: var(--primary-hover, #2563eb);
|
||||
|
||||
@@ -360,7 +360,7 @@ const ACTION_CONFIGS: Record<AgentAction, ActionConfig> = {
|
||||
|
||||
.btn--primary {
|
||||
background: var(--primary, #3b82f6);
|
||||
color: white;
|
||||
color: #1C1200;
|
||||
|
||||
&:hover:not(:disabled) {
|
||||
background: var(--primary-hover, #2563eb);
|
||||
|
||||
@@ -306,7 +306,7 @@ import { AgentHealthResult } from '../../models/agent.models';
|
||||
|
||||
.btn--primary {
|
||||
background: var(--primary, #3b82f6);
|
||||
color: white;
|
||||
color: #1C1200;
|
||||
|
||||
&:hover:not(:disabled) {
|
||||
background: var(--primary-hover, #2563eb);
|
||||
|
||||
@@ -532,12 +532,12 @@ const SEVERITY_RANK: Record<string, number> = {
|
||||
}
|
||||
.page-subtitle {
|
||||
margin: 0;
|
||||
color: var(--text-color-secondary, #64748b);
|
||||
color: var(--text-color-secondary, #6B5A2E);
|
||||
}
|
||||
.page-meta {
|
||||
margin: 0.5rem 0 0;
|
||||
font-size: 0.85rem;
|
||||
color: var(--text-color-muted, #94a3b8);
|
||||
color: var(--text-color-muted, #D4C9A8);
|
||||
}
|
||||
.page-actions {
|
||||
display: flex;
|
||||
@@ -552,7 +552,7 @@ const SEVERITY_RANK: Record<string, number> = {
|
||||
flex-wrap: wrap;
|
||||
padding: 1rem;
|
||||
background: var(--surface-card, #ffffff);
|
||||
border: 1px solid var(--surface-border, #e2e8f0);
|
||||
border: 1px solid var(--surface-border, rgba(212, 201, 168, 0.3));
|
||||
border-radius: 10px;
|
||||
}
|
||||
.filter-group {
|
||||
@@ -565,28 +565,28 @@ const SEVERITY_RANK: Record<string, number> = {
|
||||
font-size: 0.75rem;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.04em;
|
||||
color: var(--text-color-secondary, #64748b);
|
||||
color: var(--text-color-secondary, #6B5A2E);
|
||||
}
|
||||
.filter-group select {
|
||||
padding: 0.5rem 0.75rem;
|
||||
border-radius: 6px;
|
||||
border: 1px solid var(--surface-border, #e2e8f0);
|
||||
background: var(--surface-ground, #f8fafc);
|
||||
border: 1px solid var(--surface-border, rgba(212, 201, 168, 0.3));
|
||||
background: var(--surface-ground, #FFFCF5);
|
||||
font-size: 0.875rem;
|
||||
}
|
||||
|
||||
.btn {
|
||||
padding: 0.45rem 0.9rem;
|
||||
border-radius: 6px;
|
||||
border: 1px solid var(--surface-border, #e2e8f0);
|
||||
background: var(--surface-ground, #f8fafc);
|
||||
color: var(--text-color, #1e293b);
|
||||
border: 1px solid var(--surface-border, rgba(212, 201, 168, 0.3));
|
||||
background: var(--surface-ground, #FFFCF5);
|
||||
color: var(--text-color, #3D2E0A);
|
||||
font-size: 0.875rem;
|
||||
font-weight: 500;
|
||||
cursor: pointer;
|
||||
}
|
||||
.btn--secondary {
|
||||
background: var(--surface-ground, #f8fafc);
|
||||
background: var(--surface-ground, #FFFCF5);
|
||||
}
|
||||
.btn--ghost {
|
||||
background: transparent;
|
||||
@@ -621,7 +621,7 @@ const SEVERITY_RANK: Record<string, number> = {
|
||||
}
|
||||
.panel {
|
||||
background: var(--surface-card, #ffffff);
|
||||
border: 1px solid var(--surface-border, #e2e8f0);
|
||||
border: 1px solid var(--surface-border, rgba(212, 201, 168, 0.3));
|
||||
border-radius: 12px;
|
||||
padding: 1rem;
|
||||
display: flex;
|
||||
@@ -642,11 +642,11 @@ const SEVERITY_RANK: Record<string, number> = {
|
||||
.panel-subtitle {
|
||||
margin: 0.2rem 0 0;
|
||||
font-size: 0.85rem;
|
||||
color: var(--text-color-secondary, #64748b);
|
||||
color: var(--text-color-secondary, #6B5A2E);
|
||||
}
|
||||
.panel-meta {
|
||||
font-size: 0.75rem;
|
||||
color: var(--text-color-secondary, #64748b);
|
||||
color: var(--text-color-secondary, #6B5A2E);
|
||||
white-space: nowrap;
|
||||
}
|
||||
.panel-body {
|
||||
@@ -686,11 +686,11 @@ const SEVERITY_RANK: Record<string, number> = {
|
||||
}
|
||||
.metric-row__meta {
|
||||
font-size: 0.75rem;
|
||||
color: var(--text-color-secondary, #64748b);
|
||||
color: var(--text-color-secondary, #6B5A2E);
|
||||
}
|
||||
.metric-row__bar {
|
||||
height: 6px;
|
||||
background: var(--surface-ground, #f1f5f9);
|
||||
background: var(--surface-ground, #FFF9ED);
|
||||
border-radius: 999px;
|
||||
overflow: hidden;
|
||||
}
|
||||
@@ -704,7 +704,7 @@ const SEVERITY_RANK: Record<string, number> = {
|
||||
.metric-row__value {
|
||||
font-size: 0.85rem;
|
||||
font-weight: 600;
|
||||
color: var(--text-color, #1e293b);
|
||||
color: var(--text-color, #3D2E0A);
|
||||
}
|
||||
.metric-row__chips {
|
||||
display: flex;
|
||||
@@ -732,8 +732,8 @@ const SEVERITY_RANK: Record<string, number> = {
|
||||
align-items: center;
|
||||
padding: 0.15rem 0.4rem;
|
||||
border-radius: 999px;
|
||||
background: var(--surface-ground, #f1f5f9);
|
||||
color: var(--text-color-secondary, #64748b);
|
||||
background: var(--surface-ground, #FFF9ED);
|
||||
color: var(--text-color-secondary, #6B5A2E);
|
||||
font-size: 0.65rem;
|
||||
font-weight: 600;
|
||||
text-transform: uppercase;
|
||||
@@ -747,7 +747,7 @@ const SEVERITY_RANK: Record<string, number> = {
|
||||
gap: 0.75rem;
|
||||
}
|
||||
.coverage-stat {
|
||||
background: var(--surface-ground, #f8fafc);
|
||||
background: var(--surface-ground, #FFFCF5);
|
||||
border-radius: 8px;
|
||||
padding: 0.75rem;
|
||||
display: flex;
|
||||
@@ -760,7 +760,7 @@ const SEVERITY_RANK: Record<string, number> = {
|
||||
}
|
||||
.coverage-stat__label {
|
||||
font-size: 0.75rem;
|
||||
color: var(--text-color-secondary, #64748b);
|
||||
color: var(--text-color-secondary, #6B5A2E);
|
||||
}
|
||||
.coverage-list {
|
||||
display: flex;
|
||||
@@ -779,11 +779,11 @@ const SEVERITY_RANK: Record<string, number> = {
|
||||
}
|
||||
.coverage-row__meta {
|
||||
font-size: 0.75rem;
|
||||
color: var(--text-color-secondary, #64748b);
|
||||
color: var(--text-color-secondary, #6B5A2E);
|
||||
}
|
||||
.coverage-row__bar {
|
||||
height: 6px;
|
||||
background: var(--surface-ground, #f1f5f9);
|
||||
background: var(--surface-ground, #FFF9ED);
|
||||
border-radius: 999px;
|
||||
overflow: hidden;
|
||||
}
|
||||
@@ -819,7 +819,7 @@ const SEVERITY_RANK: Record<string, number> = {
|
||||
flex-direction: column;
|
||||
gap: 0.4rem;
|
||||
font-size: 0.75rem;
|
||||
color: var(--text-color-secondary, #64748b);
|
||||
color: var(--text-color-secondary, #6B5A2E);
|
||||
}
|
||||
.trend-row {
|
||||
display: flex;
|
||||
@@ -830,7 +830,7 @@ const SEVERITY_RANK: Record<string, number> = {
|
||||
.table-container {
|
||||
overflow-x: auto;
|
||||
border-radius: 8px;
|
||||
border: 1px solid var(--surface-border, #e2e8f0);
|
||||
border: 1px solid var(--surface-border, rgba(212, 201, 168, 0.3));
|
||||
}
|
||||
.data-table {
|
||||
width: 100%;
|
||||
@@ -841,39 +841,39 @@ const SEVERITY_RANK: Record<string, number> = {
|
||||
.data-table td {
|
||||
padding: 0.75rem;
|
||||
text-align: left;
|
||||
border-bottom: 1px solid var(--surface-border, #e2e8f0);
|
||||
border-bottom: 1px solid var(--surface-border, rgba(212, 201, 168, 0.3));
|
||||
font-size: 0.85rem;
|
||||
}
|
||||
.data-table th {
|
||||
background: var(--surface-ground, #f8fafc);
|
||||
background: var(--surface-ground, #FFFCF5);
|
||||
text-transform: uppercase;
|
||||
font-size: 0.7rem;
|
||||
letter-spacing: 0.04em;
|
||||
color: var(--text-color-secondary, #64748b);
|
||||
color: var(--text-color-secondary, #6B5A2E);
|
||||
}
|
||||
.table-primary {
|
||||
font-weight: 600;
|
||||
}
|
||||
.table-secondary {
|
||||
font-size: 0.75rem;
|
||||
color: var(--text-color-secondary, #64748b);
|
||||
color: var(--text-color-secondary, #6B5A2E);
|
||||
}
|
||||
|
||||
.empty-state {
|
||||
font-size: 0.85rem;
|
||||
color: var(--text-color-secondary, #64748b);
|
||||
color: var(--text-color-secondary, #6B5A2E);
|
||||
margin: 0;
|
||||
}
|
||||
.empty-callout {
|
||||
border-radius: 12px;
|
||||
border: 1px dashed var(--surface-border, #e2e8f0);
|
||||
border: 1px dashed var(--surface-border, rgba(212, 201, 168, 0.3));
|
||||
padding: 1.5rem;
|
||||
text-align: center;
|
||||
color: var(--text-color-secondary, #64748b);
|
||||
color: var(--text-color-secondary, #6B5A2E);
|
||||
}
|
||||
.empty-callout h3 {
|
||||
margin: 0 0 0.5rem;
|
||||
color: var(--text-color, #1e293b);
|
||||
color: var(--text-color, #3D2E0A);
|
||||
}
|
||||
|
||||
@media (max-width: 900px) {
|
||||
|
||||
@@ -299,7 +299,7 @@ import {
|
||||
|
||||
.btn-primary {
|
||||
background: var(--primary);
|
||||
color: white;
|
||||
color: #1C1200;
|
||||
}
|
||||
|
||||
.btn-secondary {
|
||||
|
||||
@@ -108,7 +108,7 @@ import { ComplianceReportSummary, ComplianceReportRequest, ComplianceReportForma
|
||||
.date-range input { padding: 0.5rem; border: 1px solid var(--border); border-radius: 4px; }
|
||||
.checkbox, .radio { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; }
|
||||
.format-options { display: flex; gap: 1.5rem; }
|
||||
.btn-primary { background: var(--primary); color: white; border: none; padding: 0.75rem 1.5rem; border-radius: 4px; cursor: pointer; font-size: 1rem; }
|
||||
.btn-primary { background: var(--primary); color: #1C1200; border: none; padding: 0.75rem 1.5rem; border-radius: 4px; cursor: pointer; font-size: 1rem; }
|
||||
.btn-primary:disabled { opacity: 0.6; cursor: not-allowed; }
|
||||
.report-preview { background: var(--surface-card); border-radius: 8px; border: 1px solid var(--border); overflow: hidden; }
|
||||
.preview-header { display: flex; justify-content: space-between; align-items: center; padding: 1rem 1.25rem; background: var(--surface-elevated); border-bottom: 1px solid var(--border); }
|
||||
|
||||
@@ -98,7 +98,7 @@ import { ProvenanceChain, ProvenanceStep } from '../../core/api/aoc.models';
|
||||
.validator-input { display: flex; gap: 0.75rem; margin-bottom: 2rem; }
|
||||
.validator-input select, .validator-input input { padding: 0.75rem; border: 1px solid var(--border); border-radius: 4px; font-size: 1rem; }
|
||||
.validator-input input { flex: 1; }
|
||||
.btn-primary { background: var(--primary); color: white; border: none; padding: 0.75rem 1.5rem; border-radius: 4px; cursor: pointer; }
|
||||
.btn-primary { background: var(--primary); color: #1C1200; border: none; padding: 0.75rem 1.5rem; border-radius: 4px; cursor: pointer; }
|
||||
.btn-primary:disabled { opacity: 0.6; cursor: not-allowed; }
|
||||
.chain-result { background: var(--surface-card); border-radius: 8px; border: 1px solid var(--border); overflow: hidden; }
|
||||
.chain-result.complete { border-color: var(--success); }
|
||||
|
||||
@@ -351,12 +351,12 @@ interface ReachabilityWitness {
|
||||
.status-badge--pending { background: var(--yellow-100, #fef9c3); color: var(--yellow-700, #a16207); }
|
||||
.status-badge--approved { background: var(--green-100, #dcfce7); color: var(--green-700, #15803d); }
|
||||
.status-badge--rejected { background: var(--red-100, #fee2e2); color: var(--red-700, #b91c1c); }
|
||||
.page-subtitle { margin: 0; color: var(--text-color-secondary, #64748b); font-size: 0.875rem; }
|
||||
.page-subtitle { margin: 0; color: var(--text-color-secondary, #6B5A2E); font-size: 0.875rem; }
|
||||
.digest {
|
||||
font-family: ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas, monospace;
|
||||
font-size: 0.75rem;
|
||||
padding: 0.125rem 0.375rem;
|
||||
background: var(--surface-ground, #f1f5f9);
|
||||
background: var(--surface-ground, #FFF9ED);
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
@@ -367,11 +367,11 @@ interface ReachabilityWitness {
|
||||
.panel {
|
||||
padding: 1.25rem;
|
||||
background: var(--surface-card, #ffffff);
|
||||
border: 1px solid var(--surface-border, #e2e8f0);
|
||||
border: 1px solid var(--surface-border, rgba(212, 201, 168, 0.3));
|
||||
border-radius: 8px;
|
||||
}
|
||||
.panel-title { margin: 0 0 0.25rem; font-size: 1rem; font-weight: 600; }
|
||||
.panel-subtitle { margin: 0 0 1rem; font-size: 0.875rem; color: var(--text-color-secondary, #64748b); }
|
||||
.panel-subtitle { margin: 0 0 1rem; font-size: 0.875rem; color: var(--text-color-secondary, #6B5A2E); }
|
||||
|
||||
.diff-summary { display: flex; gap: 1.5rem; margin-bottom: 1rem; }
|
||||
.diff-item { display: flex; align-items: center; gap: 0.5rem; font-size: 0.875rem; }
|
||||
@@ -393,12 +393,12 @@ interface ReachabilityWitness {
|
||||
.diff-table th, .diff-table td {
|
||||
padding: 0.75rem;
|
||||
text-align: left;
|
||||
border-bottom: 1px solid var(--surface-border, #e2e8f0);
|
||||
border-bottom: 1px solid var(--surface-border, rgba(212, 201, 168, 0.3));
|
||||
}
|
||||
.diff-table th {
|
||||
font-size: 0.75rem;
|
||||
font-weight: 600;
|
||||
color: var(--text-color-secondary, #64748b);
|
||||
color: var(--text-color-secondary, #6B5A2E);
|
||||
text-transform: uppercase;
|
||||
}
|
||||
.diff-row--added { background: var(--red-50, #fef2f2); }
|
||||
@@ -456,20 +456,20 @@ interface ReachabilityWitness {
|
||||
.comments-list { margin-bottom: 1rem; }
|
||||
.comment {
|
||||
padding: 0.75rem;
|
||||
background: var(--surface-ground, #f8fafc);
|
||||
background: var(--surface-ground, #FFFCF5);
|
||||
border-radius: 6px;
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
.comment-header { display: flex; justify-content: space-between; margin-bottom: 0.25rem; }
|
||||
.comment-author { font-weight: 500; font-size: 0.875rem; }
|
||||
.comment-time { font-size: 0.75rem; color: var(--text-color-secondary, #94a3b8); }
|
||||
.comment-time { font-size: 0.75rem; color: var(--text-color-secondary, #D4C9A8); }
|
||||
.comment-body { margin: 0; font-size: 0.875rem; }
|
||||
.no-comments { color: var(--text-color-secondary, #94a3b8); font-size: 0.875rem; }
|
||||
.no-comments { color: var(--text-color-secondary, #D4C9A8); font-size: 0.875rem; }
|
||||
.comment-form { display: flex; flex-direction: column; gap: 0.5rem; }
|
||||
.comment-input {
|
||||
width: 100%;
|
||||
padding: 0.5rem 0.75rem;
|
||||
border: 1px solid var(--surface-border, #e2e8f0);
|
||||
border: 1px solid var(--surface-border, rgba(212, 201, 168, 0.3));
|
||||
border-radius: 6px;
|
||||
font-size: 0.875rem;
|
||||
resize: vertical;
|
||||
@@ -479,11 +479,11 @@ interface ReachabilityWitness {
|
||||
.decision-panel {
|
||||
padding: 1.25rem;
|
||||
background: var(--surface-card, #ffffff);
|
||||
border: 1px solid var(--surface-border, #e2e8f0);
|
||||
border: 1px solid var(--surface-border, rgba(212, 201, 168, 0.3));
|
||||
border-radius: 8px;
|
||||
}
|
||||
.decision-panel h3 { margin: 0 0 1rem; font-size: 1rem; font-weight: 600; }
|
||||
.decision-info { margin-bottom: 1rem; font-size: 0.875rem; color: var(--text-color-secondary, #64748b); }
|
||||
.decision-info { margin-bottom: 1rem; font-size: 0.875rem; color: var(--text-color-secondary, #6B5A2E); }
|
||||
.decision-info p { margin: 0; }
|
||||
.decision-actions { display: flex; flex-direction: column; gap: 0.75rem; margin-bottom: 1rem; }
|
||||
.decision-options { margin-bottom: 1rem; }
|
||||
@@ -495,7 +495,7 @@ interface ReachabilityWitness {
|
||||
cursor: pointer;
|
||||
}
|
||||
.decision-result { margin-bottom: 1rem; }
|
||||
.decision-time { font-size: 0.75rem; color: var(--text-color-secondary, #94a3b8); }
|
||||
.decision-time { font-size: 0.75rem; color: var(--text-color-secondary, #D4C9A8); }
|
||||
.evidence-link h4 { margin: 0 0 0.5rem; font-size: 0.875rem; font-weight: 600; }
|
||||
|
||||
.btn {
|
||||
@@ -513,11 +513,11 @@ interface ReachabilityWitness {
|
||||
.btn--sm { padding: 0.25rem 0.5rem; font-size: 0.75rem; }
|
||||
.btn--lg { padding: 0.75rem 1.5rem; font-size: 1rem; }
|
||||
.btn--block { width: 100%; }
|
||||
.btn--secondary { background: var(--surface-ground, #f8fafc); border: 1px solid var(--surface-border, #e2e8f0); color: var(--text-color, #1e293b); }
|
||||
.btn--secondary { background: var(--surface-ground, #FFFCF5); border: 1px solid var(--surface-border, rgba(212, 201, 168, 0.3)); color: var(--text-color, #3D2E0A); }
|
||||
.btn--success { background: var(--green-600, #16a34a); border: none; color: white; }
|
||||
.btn--danger { background: var(--red-600, #dc2626); border: none; color: white; }
|
||||
.btn--link { background: transparent; border: none; color: var(--primary-color, #3b82f6); padding: 0; }
|
||||
.btn--primary { background: var(--primary-color, #3b82f6); border: none; color: white; }
|
||||
.btn--primary { background: var(--primary-color, #3b82f6); border: none; color: #1C1200; }
|
||||
|
||||
/* Witness Panel Styles (APPR-008 - THE MOAT) */
|
||||
.witness-panel {
|
||||
@@ -535,9 +535,9 @@ interface ReachabilityWitness {
|
||||
.witness-finding { margin-bottom: 1rem; }
|
||||
.finding-description {
|
||||
font-size: 0.875rem;
|
||||
color: var(--text-color-secondary, #64748b);
|
||||
color: var(--text-color-secondary, #6B5A2E);
|
||||
padding: 0.75rem;
|
||||
background: var(--surface-ground, #f8fafc);
|
||||
background: var(--surface-ground, #FFFCF5);
|
||||
border-radius: 6px;
|
||||
}
|
||||
|
||||
@@ -571,11 +571,11 @@ interface ReachabilityWitness {
|
||||
.state-indicator--uncertain .state-label { color: var(--yellow-700, #a16207); }
|
||||
.state-confidence {
|
||||
font-size: 0.875rem;
|
||||
color: var(--text-color-secondary, #64748b);
|
||||
color: var(--text-color-secondary, #6B5A2E);
|
||||
}
|
||||
.confidence-explanation {
|
||||
font-size: 0.8125rem;
|
||||
color: var(--text-color-secondary, #64748b);
|
||||
color: var(--text-color-secondary, #6B5A2E);
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
@@ -584,14 +584,14 @@ interface ReachabilityWitness {
|
||||
margin: 0 0 0.75rem;
|
||||
font-size: 0.875rem;
|
||||
font-weight: 600;
|
||||
color: var(--text-color-secondary, #64748b);
|
||||
color: var(--text-color-secondary, #6B5A2E);
|
||||
}
|
||||
.callpath-visualization {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 0.25rem;
|
||||
padding: 1rem;
|
||||
background: var(--surface-ground, #f8fafc);
|
||||
background: var(--surface-ground, #FFFCF5);
|
||||
border-radius: 8px;
|
||||
font-family: ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas, monospace;
|
||||
}
|
||||
@@ -613,10 +613,10 @@ interface ReachabilityWitness {
|
||||
}
|
||||
.node-info { display: flex; flex-direction: column; gap: 0.125rem; }
|
||||
.node-function { font-size: 0.8125rem; font-weight: 500; }
|
||||
.node-location { font-size: 0.6875rem; color: var(--text-color-secondary, #94a3b8); }
|
||||
.node-location { font-size: 0.6875rem; color: var(--text-color-secondary, #D4C9A8); }
|
||||
.callpath-arrow {
|
||||
text-align: center;
|
||||
color: var(--text-color-secondary, #94a3b8);
|
||||
color: var(--text-color-secondary, #D4C9A8);
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
@@ -629,7 +629,7 @@ interface ReachabilityWitness {
|
||||
}
|
||||
.analysis-item {
|
||||
padding: 0.75rem;
|
||||
background: var(--surface-ground, #f8fafc);
|
||||
background: var(--surface-ground, #FFFCF5);
|
||||
border-radius: 6px;
|
||||
}
|
||||
.analysis-item--full { grid-column: 1 / -1; }
|
||||
@@ -637,7 +637,7 @@ interface ReachabilityWitness {
|
||||
display: block;
|
||||
font-size: 0.6875rem;
|
||||
font-weight: 600;
|
||||
color: var(--text-color-secondary, #64748b);
|
||||
color: var(--text-color-secondary, #6B5A2E);
|
||||
text-transform: uppercase;
|
||||
margin-bottom: 0.25rem;
|
||||
}
|
||||
@@ -658,7 +658,7 @@ interface ReachabilityWitness {
|
||||
display: flex;
|
||||
gap: 0.5rem;
|
||||
padding-top: 1rem;
|
||||
border-top: 1px solid var(--surface-border, #e2e8f0);
|
||||
border-top: 1px solid var(--surface-border, rgba(212, 201, 168, 0.3));
|
||||
}
|
||||
|
||||
@media (max-width: 1024px) {
|
||||
|
||||
@@ -50,13 +50,13 @@ import { ActivatedRoute, RouterLink } from '@angular/router';
|
||||
|
||||
p {
|
||||
margin: 0;
|
||||
color: var(--text-color-secondary, #64748b);
|
||||
color: var(--text-color-secondary, #6B5A2E);
|
||||
}
|
||||
|
||||
.approval-detail__content {
|
||||
padding: 2rem;
|
||||
background: var(--surface-card, #ffffff);
|
||||
border: 1px solid var(--surface-border, #e2e8f0);
|
||||
border: 1px solid var(--surface-border, rgba(212, 201, 168, 0.3));
|
||||
border-radius: 8px;
|
||||
}
|
||||
`],
|
||||
|
||||
@@ -98,7 +98,7 @@ interface ApprovalRequest {
|
||||
|
||||
.page-header { margin-bottom: 1.5rem; }
|
||||
.page-title { margin: 0 0 0.25rem; font-size: 1.5rem; font-weight: 600; }
|
||||
.page-subtitle { margin: 0; color: var(--text-color-secondary, #64748b); }
|
||||
.page-subtitle { margin: 0; color: var(--text-color-secondary, #6B5A2E); }
|
||||
|
||||
.status-filter {
|
||||
display: flex;
|
||||
@@ -111,12 +111,12 @@ interface ApprovalRequest {
|
||||
gap: 0.5rem;
|
||||
padding: 0.5rem 1rem;
|
||||
background: var(--surface-card, #ffffff);
|
||||
border: 1px solid var(--surface-border, #e2e8f0);
|
||||
border: 1px solid var(--surface-border, rgba(212, 201, 168, 0.3));
|
||||
border-radius: 6px;
|
||||
font-size: 0.875rem;
|
||||
cursor: pointer;
|
||||
}
|
||||
.status-filter__btn:hover { background: var(--surface-hover, #f8fafc); }
|
||||
.status-filter__btn:hover { background: var(--surface-hover, #FFFCF5); }
|
||||
.status-filter__btn--active {
|
||||
background: var(--primary-color, #3b82f6);
|
||||
border-color: var(--primary-color, #3b82f6);
|
||||
@@ -135,7 +135,7 @@ interface ApprovalRequest {
|
||||
display: block;
|
||||
padding: 1rem;
|
||||
background: var(--surface-card, #ffffff);
|
||||
border: 1px solid var(--surface-border, #e2e8f0);
|
||||
border: 1px solid var(--surface-border, rgba(212, 201, 168, 0.3));
|
||||
border-radius: 8px;
|
||||
text-decoration: none;
|
||||
color: inherit;
|
||||
@@ -157,7 +157,7 @@ interface ApprovalRequest {
|
||||
margin-bottom: 0.75rem;
|
||||
}
|
||||
.approval-card__release { font-weight: 600; font-size: 1rem; }
|
||||
.approval-card__route { color: var(--text-color-secondary, #64748b); }
|
||||
.approval-card__route { color: var(--text-color-secondary, #6B5A2E); }
|
||||
.approval-card__status {
|
||||
margin-left: auto;
|
||||
padding: 0.125rem 0.5rem;
|
||||
@@ -179,10 +179,10 @@ interface ApprovalRequest {
|
||||
.approval-card__digest code {
|
||||
font-size: 0.75rem;
|
||||
padding: 0.125rem 0.375rem;
|
||||
background: var(--surface-ground, #f1f5f9);
|
||||
background: var(--surface-ground, #FFF9ED);
|
||||
border-radius: 4px;
|
||||
}
|
||||
.approval-card__meta { font-size: 0.75rem; color: var(--text-color-secondary, #94a3b8); }
|
||||
.approval-card__meta { font-size: 0.75rem; color: var(--text-color-secondary, #D4C9A8); }
|
||||
|
||||
.approval-card__indicators { display: flex; align-items: center; gap: 0.5rem; }
|
||||
.gate-badge {
|
||||
@@ -209,9 +209,9 @@ interface ApprovalRequest {
|
||||
.empty-state {
|
||||
padding: 3rem;
|
||||
text-align: center;
|
||||
color: var(--text-color-secondary, #64748b);
|
||||
color: var(--text-color-secondary, #6B5A2E);
|
||||
background: var(--surface-card, #ffffff);
|
||||
border: 1px solid var(--surface-border, #e2e8f0);
|
||||
border: 1px solid var(--surface-border, rgba(212, 201, 168, 0.3));
|
||||
border-radius: 8px;
|
||||
}
|
||||
`]
|
||||
|
||||
@@ -102,7 +102,7 @@ import { RouterLink } from '@angular/router';
|
||||
|
||||
.approvals__subtitle {
|
||||
margin: 0;
|
||||
color: var(--text-color-secondary, #64748b);
|
||||
color: var(--text-color-secondary, #6B5A2E);
|
||||
}
|
||||
|
||||
.approvals__filters {
|
||||
@@ -115,7 +115,7 @@ import { RouterLink } from '@angular/router';
|
||||
.filter-select,
|
||||
.filter-search {
|
||||
padding: 0.5rem 0.75rem;
|
||||
border: 1px solid var(--surface-border, #e2e8f0);
|
||||
border: 1px solid var(--surface-border, rgba(212, 201, 168, 0.3));
|
||||
border-radius: 6px;
|
||||
font-size: 0.875rem;
|
||||
background: var(--surface-card, #ffffff);
|
||||
@@ -138,7 +138,7 @@ import { RouterLink } from '@angular/router';
|
||||
|
||||
.approval-card {
|
||||
background: var(--surface-card, #ffffff);
|
||||
border: 1px solid var(--surface-border, #e2e8f0);
|
||||
border: 1px solid var(--surface-border, rgba(212, 201, 168, 0.3));
|
||||
border-radius: 8px;
|
||||
padding: 1.25rem;
|
||||
margin-bottom: 1rem;
|
||||
@@ -164,12 +164,12 @@ import { RouterLink } from '@angular/router';
|
||||
|
||||
.approval-card__flow {
|
||||
font-size: 0.875rem;
|
||||
color: var(--text-color-secondary, #64748b);
|
||||
color: var(--text-color-secondary, #6B5A2E);
|
||||
}
|
||||
|
||||
.approval-card__meta {
|
||||
font-size: 0.75rem;
|
||||
color: var(--text-color-secondary, #94a3b8);
|
||||
color: var(--text-color-secondary, #D4C9A8);
|
||||
margin-left: auto;
|
||||
}
|
||||
|
||||
@@ -177,7 +177,7 @@ import { RouterLink } from '@angular/router';
|
||||
font-size: 0.875rem;
|
||||
margin-bottom: 1rem;
|
||||
padding: 0.75rem;
|
||||
background: var(--surface-ground, #f8fafc);
|
||||
background: var(--surface-ground, #FFFCF5);
|
||||
border-radius: 6px;
|
||||
}
|
||||
|
||||
@@ -259,11 +259,11 @@ import { RouterLink } from '@angular/router';
|
||||
}
|
||||
|
||||
.btn--secondary {
|
||||
background: var(--surface-ground, #f1f5f9);
|
||||
color: var(--text-color, #1e293b);
|
||||
background: var(--surface-ground, #FFF9ED);
|
||||
color: var(--text-color, #3D2E0A);
|
||||
|
||||
&:hover {
|
||||
background: var(--surface-hover, #e2e8f0);
|
||||
background: var(--surface-hover, rgba(212, 201, 168, 0.3));
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -306,14 +306,14 @@ export interface GateContext {
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 1.25rem 1.5rem;
|
||||
border-bottom: 1px solid var(--color-border-primary, #e2e8f0);
|
||||
border-bottom: 1px solid var(--color-border-primary, rgba(212, 201, 168, 0.3));
|
||||
}
|
||||
|
||||
.modal__title {
|
||||
margin: 0;
|
||||
font-size: 1.125rem;
|
||||
font-weight: 600;
|
||||
color: var(--color-text-primary, #1e293b);
|
||||
color: var(--color-text-primary, #3D2E0A);
|
||||
}
|
||||
|
||||
.modal__close {
|
||||
@@ -322,14 +322,14 @@ export interface GateContext {
|
||||
background: none;
|
||||
border: none;
|
||||
border-radius: 6px;
|
||||
color: var(--color-text-secondary, #64748b);
|
||||
color: var(--color-text-secondary, #6B5A2E);
|
||||
cursor: pointer;
|
||||
transition: all 0.15s ease;
|
||||
}
|
||||
|
||||
.modal__close:hover {
|
||||
background: var(--color-surface-secondary, #f8fafc);
|
||||
color: var(--color-text-primary, #1e293b);
|
||||
background: var(--color-surface-secondary, #FFFCF5);
|
||||
color: var(--color-text-primary, #3D2E0A);
|
||||
}
|
||||
|
||||
.modal__body {
|
||||
@@ -343,8 +343,8 @@ export interface GateContext {
|
||||
justify-content: flex-end;
|
||||
gap: 0.75rem;
|
||||
padding: 1rem 1.5rem;
|
||||
border-top: 1px solid var(--color-border-primary, #e2e8f0);
|
||||
background: var(--color-surface-secondary, #f8fafc);
|
||||
border-top: 1px solid var(--color-border-primary, rgba(212, 201, 168, 0.3));
|
||||
background: var(--color-surface-secondary, #FFFCF5);
|
||||
border-radius: 0 0 12px 12px;
|
||||
}
|
||||
|
||||
@@ -354,7 +354,7 @@ export interface GateContext {
|
||||
align-items: flex-start;
|
||||
gap: 0.75rem;
|
||||
padding: 1rem;
|
||||
background: var(--color-surface-secondary, #f8fafc);
|
||||
background: var(--color-surface-secondary, #FFFCF5);
|
||||
border-radius: 8px;
|
||||
margin-bottom: 1.5rem;
|
||||
}
|
||||
@@ -385,12 +385,12 @@ export interface GateContext {
|
||||
|
||||
.gate-context__name {
|
||||
font-weight: 600;
|
||||
color: var(--color-text-primary, #1e293b);
|
||||
color: var(--color-text-primary, #3D2E0A);
|
||||
}
|
||||
|
||||
.gate-context__reason {
|
||||
font-size: 0.875rem;
|
||||
color: var(--color-text-secondary, #64748b);
|
||||
color: var(--color-text-secondary, #6B5A2E);
|
||||
}
|
||||
|
||||
/* Form */
|
||||
@@ -413,7 +413,7 @@ export interface GateContext {
|
||||
.form-label {
|
||||
font-size: 0.875rem;
|
||||
font-weight: 500;
|
||||
color: var(--color-text-primary, #1e293b);
|
||||
color: var(--color-text-primary, #3D2E0A);
|
||||
}
|
||||
|
||||
.required {
|
||||
@@ -422,7 +422,7 @@ export interface GateContext {
|
||||
|
||||
.form-hint {
|
||||
font-size: 0.75rem;
|
||||
color: var(--color-text-secondary, #64748b);
|
||||
color: var(--color-text-secondary, #6B5A2E);
|
||||
}
|
||||
|
||||
.form-hint .warning {
|
||||
@@ -433,10 +433,10 @@ export interface GateContext {
|
||||
.form-select,
|
||||
.form-textarea {
|
||||
padding: 0.625rem 0.875rem;
|
||||
border: 1px solid var(--color-border-primary, #e2e8f0);
|
||||
border: 1px solid var(--color-border-primary, rgba(212, 201, 168, 0.3));
|
||||
border-radius: 6px;
|
||||
font-size: 0.875rem;
|
||||
color: var(--color-text-primary, #1e293b);
|
||||
color: var(--color-text-primary, #3D2E0A);
|
||||
background: white;
|
||||
transition: border-color 0.15s ease, box-shadow 0.15s ease;
|
||||
}
|
||||
@@ -466,7 +466,7 @@ export interface GateContext {
|
||||
align-items: flex-start;
|
||||
gap: 0.75rem;
|
||||
padding: 0.875rem;
|
||||
border: 1px solid var(--color-border-primary, #e2e8f0);
|
||||
border: 1px solid var(--color-border-primary, rgba(212, 201, 168, 0.3));
|
||||
border-radius: 8px;
|
||||
cursor: pointer;
|
||||
transition: all 0.15s ease;
|
||||
@@ -494,12 +494,12 @@ export interface GateContext {
|
||||
|
||||
.radio-label strong {
|
||||
font-size: 0.875rem;
|
||||
color: var(--color-text-primary, #1e293b);
|
||||
color: var(--color-text-primary, #3D2E0A);
|
||||
}
|
||||
|
||||
.radio-label small {
|
||||
font-size: 0.75rem;
|
||||
color: var(--color-text-secondary, #64748b);
|
||||
color: var(--color-text-secondary, #6B5A2E);
|
||||
}
|
||||
|
||||
/* File Input */
|
||||
@@ -520,7 +520,7 @@ export interface GateContext {
|
||||
align-items: center;
|
||||
gap: 0.375rem;
|
||||
padding: 1.5rem;
|
||||
border: 2px dashed var(--color-border-primary, #e2e8f0);
|
||||
border: 2px dashed var(--color-border-primary, rgba(212, 201, 168, 0.3));
|
||||
border-radius: 8px;
|
||||
text-align: center;
|
||||
transition: all 0.15s ease;
|
||||
@@ -533,13 +533,13 @@ export interface GateContext {
|
||||
|
||||
.file-input__placeholder {
|
||||
font-size: 0.875rem;
|
||||
color: var(--color-text-secondary, #64748b);
|
||||
color: var(--color-text-secondary, #6B5A2E);
|
||||
}
|
||||
|
||||
.file-input__name {
|
||||
font-size: 0.875rem;
|
||||
font-weight: 500;
|
||||
color: var(--color-text-primary, #1e293b);
|
||||
color: var(--color-text-primary, #3D2E0A);
|
||||
}
|
||||
|
||||
.file-input__remove {
|
||||
@@ -627,7 +627,7 @@ export interface GateContext {
|
||||
|
||||
.btn--primary {
|
||||
background: var(--color-brand-600, #2563eb);
|
||||
color: white;
|
||||
color: #1C1200;
|
||||
}
|
||||
|
||||
.btn--primary:hover:not(:disabled) {
|
||||
@@ -635,13 +635,13 @@ export interface GateContext {
|
||||
}
|
||||
|
||||
.btn--secondary {
|
||||
background: var(--color-surface-secondary, #f8fafc);
|
||||
color: var(--color-text-primary, #1e293b);
|
||||
border: 1px solid var(--color-border-primary, #e2e8f0);
|
||||
background: var(--color-surface-secondary, #FFFCF5);
|
||||
color: var(--color-text-primary, #3D2E0A);
|
||||
border: 1px solid var(--color-border-primary, rgba(212, 201, 168, 0.3));
|
||||
}
|
||||
|
||||
.btn--secondary:hover:not(:disabled) {
|
||||
background: var(--color-surface-tertiary, #f1f5f9);
|
||||
background: var(--color-surface-tertiary, #FFF9ED);
|
||||
}
|
||||
|
||||
.spinner {
|
||||
|
||||
@@ -96,7 +96,7 @@ import { AuditAnomalyAlert } from '../../core/api/audit-log.models';
|
||||
.description { color: var(--text-secondary); margin: 0; }
|
||||
.filter-bar { display: flex; gap: 0.5rem; margin-bottom: 1.5rem; }
|
||||
.filter-bar button { padding: 0.5rem 1rem; background: var(--surface-card); border: 1px solid var(--border); border-radius: 4px; cursor: pointer; }
|
||||
.filter-bar button.active { background: var(--primary); color: white; border-color: var(--primary); }
|
||||
.filter-bar button.active { background: var(--primary); color: #1C1200; border-color: var(--primary); }
|
||||
.alerts-list { display: flex; flex-direction: column; gap: 1rem; margin-bottom: 2rem; }
|
||||
.alert-card { background: var(--surface-card); border: 1px solid var(--border); border-radius: 8px; padding: 1rem; }
|
||||
.alert-card.warning { border-left: 4px solid var(--warning); }
|
||||
@@ -113,7 +113,7 @@ import { AuditAnomalyAlert } from '../../core/api/audit-log.models';
|
||||
.alert-meta { display: flex; gap: 1.5rem; font-size: 0.8rem; color: var(--text-secondary); margin-bottom: 0.75rem; }
|
||||
.ack-info { font-size: 0.8rem; color: var(--text-secondary); font-style: italic; }
|
||||
.alert-actions { display: flex; gap: 0.75rem; }
|
||||
.btn-primary { background: var(--primary); color: white; border: none; padding: 0.5rem 1rem; border-radius: 4px; cursor: pointer; }
|
||||
.btn-primary { background: var(--primary); color: #1C1200; border: none; padding: 0.5rem 1rem; border-radius: 4px; cursor: pointer; }
|
||||
.btn-secondary { background: var(--surface-elevated); border: 1px solid var(--border); padding: 0.5rem 1rem; border-radius: 4px; text-decoration: none; color: inherit; }
|
||||
.no-alerts { text-align: center; padding: 3rem; color: var(--text-secondary); background: var(--surface-card); border-radius: 8px; }
|
||||
.anomaly-types h2 { margin: 0 0 1rem; font-size: 1.1rem; }
|
||||
|
||||
@@ -86,7 +86,7 @@ import { AuditEvent } from '../../core/api/audit-log.models';
|
||||
.description { color: var(--text-secondary); margin: 0; }
|
||||
.tabs { display: flex; gap: 0.5rem; margin-bottom: 1.5rem; }
|
||||
.tabs button { padding: 0.5rem 1rem; background: var(--surface-card); border: 1px solid var(--border); border-radius: 4px; cursor: pointer; }
|
||||
.tabs button.active { background: var(--primary); color: white; border-color: var(--primary); }
|
||||
.tabs button.active { background: var(--primary); color: #1C1200; border-color: var(--primary); }
|
||||
.events-table { width: 100%; border-collapse: collapse; background: var(--surface-card); border: 1px solid var(--border); border-radius: 8px; }
|
||||
.events-table th, .events-table td { padding: 0.75rem; text-align: left; border-bottom: 1px solid var(--border); }
|
||||
.events-table th { background: var(--surface-elevated); font-weight: 600; font-size: 0.85rem; }
|
||||
|
||||
@@ -190,7 +190,7 @@ import { AuditExportRequest, AuditExportResponse, AuditLogFilters, AuditModule,
|
||||
.options { display: flex; flex-direction: column; gap: 0.5rem; }
|
||||
.checkbox { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; }
|
||||
.actions { margin-top: 1.5rem; }
|
||||
.btn-primary { background: var(--primary); color: white; border: none; padding: 0.75rem 1.5rem; border-radius: 4px; cursor: pointer; font-size: 1rem; }
|
||||
.btn-primary { background: var(--primary); color: #1C1200; border: none; padding: 0.75rem 1.5rem; border-radius: 4px; cursor: pointer; font-size: 1rem; }
|
||||
.btn-primary:disabled { opacity: 0.6; cursor: not-allowed; }
|
||||
.exports-list { margin-bottom: 2rem; }
|
||||
.exports-list h2 { margin: 0 0 1rem; font-size: 1.1rem; }
|
||||
@@ -203,7 +203,7 @@ import { AuditExportRequest, AuditExportResponse, AuditLogFilters, AuditModule,
|
||||
.badge.processing { background: #dbeafe; color: #1e40af; }
|
||||
.badge.completed { background: #dcfce7; color: #166534; }
|
||||
.badge.failed { background: #fee2e2; color: #991b1b; }
|
||||
.btn-sm { display: inline-block; padding: 0.35rem 0.75rem; background: var(--primary); color: white; border-radius: 4px; text-decoration: none; font-size: 0.8rem; }
|
||||
.btn-sm { display: inline-block; padding: 0.35rem 0.75rem; background: var(--primary); color: #1C1200; border-radius: 4px; text-decoration: none; font-size: 0.8rem; }
|
||||
.btn-xs { padding: 0.25rem 0.5rem; font-size: 0.75rem; cursor: pointer; background: var(--surface-elevated); border: 1px solid var(--border); border-radius: 4px; }
|
||||
.compliance-info h2 { margin: 0 0 1rem; font-size: 1.1rem; }
|
||||
.info-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1rem; }
|
||||
|
||||
@@ -133,7 +133,7 @@ import { AuditStatsSummary, AuditEvent, AuditAnomalyAlert, AuditModule } from '.
|
||||
.page-header h1 { margin: 0 0 0.25rem; }
|
||||
.description { color: var(--text-secondary); margin: 0 0 1rem; }
|
||||
.header-actions { display: flex; gap: 0.75rem; }
|
||||
.btn-primary { background: var(--primary); color: white; border: none; padding: 0.5rem 1rem; border-radius: 4px; text-decoration: none; }
|
||||
.btn-primary { background: var(--primary); color: #1C1200; border: none; padding: 0.5rem 1rem; border-radius: 4px; text-decoration: none; }
|
||||
.btn-secondary { background: var(--surface-elevated); border: 1px solid var(--border); padding: 0.5rem 1rem; border-radius: 4px; text-decoration: none; color: inherit; }
|
||||
.stats-strip { display: flex; gap: 1rem; flex-wrap: wrap; margin-bottom: 2rem; }
|
||||
.stat-card { background: var(--surface-card); border: 1px solid var(--border); border-radius: 8px; padding: 1rem 1.5rem; min-width: 120px; text-align: center; }
|
||||
|
||||
@@ -254,7 +254,7 @@ import { AuditEvent, AuditLogFilters, AuditModule, AuditAction, AuditSeverity }
|
||||
.search-group { flex: 1; min-width: 200px; flex-direction: row; align-items: flex-end; }
|
||||
.search-group label { display: none; }
|
||||
.search-group input { flex: 1; }
|
||||
.btn-sm { padding: 0.5rem 0.75rem; cursor: pointer; background: var(--primary); color: white; border: none; border-radius: 4px; }
|
||||
.btn-sm { padding: 0.5rem 0.75rem; cursor: pointer; background: var(--primary); color: #1C1200; border: none; border-radius: 4px; }
|
||||
.btn-secondary { padding: 0.5rem 1rem; cursor: pointer; background: var(--surface-elevated); border: 1px solid var(--border); border-radius: 4px; align-self: flex-end; }
|
||||
.loading { text-align: center; padding: 3rem; color: var(--text-secondary); }
|
||||
.events-table { width: 100%; border-collapse: collapse; background: var(--surface-card); border: 1px solid var(--border); border-radius: 8px; overflow: hidden; }
|
||||
@@ -304,7 +304,7 @@ import { AuditEvent, AuditLogFilters, AuditModule, AuditAction, AuditSeverity }
|
||||
.detail-section { margin-top: 1rem; }
|
||||
.detail-section h4 { margin: 0 0 0.5rem; font-size: 0.9rem; }
|
||||
.json-block { background: var(--surface-elevated); padding: 0.75rem; border-radius: 4px; font-size: 0.75rem; overflow-x: auto; max-height: 200px; }
|
||||
.btn-primary { background: var(--primary); color: white; border: none; padding: 0.5rem 1rem; border-radius: 4px; cursor: pointer; margin-top: 1rem; }
|
||||
.btn-primary { background: var(--primary); color: #1C1200; border: none; padding: 0.5rem 1rem; border-radius: 4px; cursor: pointer; margin-top: 1rem; }
|
||||
.diff-modal-backdrop { position: fixed; inset: 0; background: rgba(0,0,0,0.5); display: flex; align-items: center; justify-content: center; z-index: 200; }
|
||||
.diff-modal { background: var(--surface-card); border-radius: 8px; width: 90%; max-width: 1000px; max-height: 80vh; overflow: hidden; display: flex; flex-direction: column; }
|
||||
.modal-header { display: flex; justify-content: space-between; align-items: center; padding: 1rem; border-bottom: 1px solid var(--border); }
|
||||
|
||||
@@ -86,7 +86,7 @@ import { AuditEvent } from '../../core/api/audit-log.models';
|
||||
.description { color: var(--text-secondary); margin: 0; }
|
||||
.event-categories { display: flex; gap: 0.5rem; margin-bottom: 1.5rem; }
|
||||
.event-categories button { padding: 0.5rem 1rem; background: var(--surface-card); border: 1px solid var(--border); border-radius: 4px; cursor: pointer; }
|
||||
.event-categories button.active { background: var(--primary); color: white; border-color: var(--primary); }
|
||||
.event-categories button.active { background: var(--primary); color: #1C1200; border-color: var(--primary); }
|
||||
.events-table { width: 100%; border-collapse: collapse; background: var(--surface-card); border: 1px solid var(--border); border-radius: 8px; }
|
||||
.events-table th, .events-table td { padding: 0.75rem; text-align: left; border-bottom: 1px solid var(--border); }
|
||||
.events-table th { background: var(--surface-elevated); font-weight: 600; font-size: 0.85rem; }
|
||||
|
||||
@@ -77,7 +77,7 @@ import { AuditTimelineEntry } from '../../core/api/audit-log.models';
|
||||
.date-filters { display: flex; align-items: center; gap: 0.5rem; }
|
||||
.date-filters input { padding: 0.5rem; border: 1px solid var(--border); border-radius: 4px; }
|
||||
.date-filters span { color: var(--text-secondary); }
|
||||
.btn-primary { background: var(--primary); color: white; border: none; padding: 0.75rem 1.5rem; border-radius: 4px; cursor: pointer; }
|
||||
.btn-primary { background: var(--primary); color: #1C1200; border: none; padding: 0.75rem 1.5rem; border-radius: 4px; cursor: pointer; }
|
||||
.btn-primary:disabled { opacity: 0.6; cursor: not-allowed; }
|
||||
.timeline { position: relative; }
|
||||
.timeline-entry { display: flex; gap: 1rem; margin-bottom: 1.5rem; }
|
||||
|
||||
@@ -23,7 +23,7 @@ import { AuthorityAuthService } from '../../core/auth/authority-auth.service';
|
||||
max-width: 420px;
|
||||
text-align: center;
|
||||
font-size: 1rem;
|
||||
color: #0f172a;
|
||||
color: #1C1200;
|
||||
}
|
||||
|
||||
.error {
|
||||
|
||||
@@ -637,12 +637,12 @@ type Tab = 'health' | 'bench' | 'cache' | 'config' | 'fingerprint';
|
||||
margin: 0 0 0.25rem 0;
|
||||
font-size: 1.5rem;
|
||||
font-weight: 600;
|
||||
color: #e2e8f0;
|
||||
color: rgba(212, 201, 168, 0.3);
|
||||
}
|
||||
|
||||
.binidx-ops__subtitle {
|
||||
margin: 0;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
}
|
||||
|
||||
.binidx-ops__status {
|
||||
@@ -663,17 +663,17 @@ type Tab = 'health' | 'bench' | 'cache' | 'config' | 'fingerprint';
|
||||
.status-badge--healthy { background: #14532d; color: #86efac; }
|
||||
.status-badge--degraded { background: #713f12; color: #fde047; }
|
||||
.status-badge--unhealthy { background: #450a0a; color: #fca5a5; }
|
||||
.status-badge--unknown { background: #1e293b; color: #94a3b8; }
|
||||
.status-badge--unknown { background: #3D2E0A; color: #D4C9A8; }
|
||||
|
||||
.status-timestamp {
|
||||
font-size: 0.75rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
}
|
||||
|
||||
.binidx-ops__tabs {
|
||||
display: flex;
|
||||
gap: 0;
|
||||
border-bottom: 1px solid #334155;
|
||||
border-bottom: 1px solid #3D2E0A;
|
||||
margin-bottom: 1.5rem;
|
||||
}
|
||||
|
||||
@@ -682,14 +682,14 @@ type Tab = 'health' | 'bench' | 'cache' | 'config' | 'fingerprint';
|
||||
background: transparent;
|
||||
border: none;
|
||||
border-bottom: 2px solid transparent;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
cursor: pointer;
|
||||
font-size: 0.875rem;
|
||||
transition: all 0.15s ease;
|
||||
}
|
||||
|
||||
.binidx-ops__tab:hover {
|
||||
color: #e2e8f0;
|
||||
color: rgba(212, 201, 168, 0.3);
|
||||
}
|
||||
|
||||
.binidx-ops__tab--active {
|
||||
@@ -704,7 +704,7 @@ type Tab = 'health' | 'bench' | 'cache' | 'config' | 'fingerprint';
|
||||
.loading-state, .empty-state {
|
||||
padding: 3rem;
|
||||
text-align: center;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
}
|
||||
|
||||
.error-state {
|
||||
@@ -750,7 +750,7 @@ type Tab = 'health' | 'bench' | 'cache' | 'config' | 'fingerprint';
|
||||
margin: 1.5rem 0 1rem 0;
|
||||
font-size: 1rem;
|
||||
font-weight: 600;
|
||||
color: #e2e8f0;
|
||||
color: rgba(212, 201, 168, 0.3);
|
||||
}
|
||||
|
||||
.section-title:first-child {
|
||||
@@ -769,8 +769,8 @@ type Tab = 'health' | 'bench' | 'cache' | 'config' | 'fingerprint';
|
||||
flex-direction: column;
|
||||
gap: 0.25rem;
|
||||
padding: 1rem;
|
||||
background: #1e293b;
|
||||
border: 1px solid #334155;
|
||||
background: #3D2E0A;
|
||||
border: 1px solid #3D2E0A;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
@@ -781,7 +781,7 @@ type Tab = 'health' | 'bench' | 'cache' | 'config' | 'fingerprint';
|
||||
.lifter-isa {
|
||||
font-family: ui-monospace, monospace;
|
||||
font-weight: 600;
|
||||
color: #e2e8f0;
|
||||
color: rgba(212, 201, 168, 0.3);
|
||||
}
|
||||
|
||||
.lifter-status {
|
||||
@@ -790,7 +790,7 @@ type Tab = 'health' | 'bench' | 'cache' | 'config' | 'fingerprint';
|
||||
|
||||
.lifter-pool, .lifter-last-used {
|
||||
font-size: 0.75rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
}
|
||||
|
||||
.health-table, .bench-table, .config-table {
|
||||
@@ -802,20 +802,20 @@ type Tab = 'health' | 'bench' | 'cache' | 'config' | 'fingerprint';
|
||||
.bench-table th, .bench-table td {
|
||||
padding: 0.75rem;
|
||||
text-align: left;
|
||||
border-bottom: 1px solid #334155;
|
||||
border-bottom: 1px solid #3D2E0A;
|
||||
}
|
||||
|
||||
.health-table th, .bench-table th {
|
||||
font-weight: 500;
|
||||
color: #94a3b8;
|
||||
background: #0f172a;
|
||||
color: #D4C9A8;
|
||||
background: #1C1200;
|
||||
}
|
||||
|
||||
.cache-status-row {
|
||||
display: flex;
|
||||
gap: 2rem;
|
||||
padding: 1rem;
|
||||
background: #1e293b;
|
||||
background: #3D2E0A;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
@@ -850,7 +850,7 @@ type Tab = 'health' | 'bench' | 'cache' | 'config' | 'fingerprint';
|
||||
|
||||
.bench-note {
|
||||
font-size: 0.8125rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
}
|
||||
|
||||
.latency-grid {
|
||||
@@ -864,20 +864,20 @@ type Tab = 'health' | 'bench' | 'cache' | 'config' | 'fingerprint';
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
padding: 1rem;
|
||||
background: #1e293b;
|
||||
background: #3D2E0A;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.latency-label {
|
||||
font-size: 0.75rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.latency-value {
|
||||
font-size: 1.25rem;
|
||||
font-weight: 600;
|
||||
color: #e2e8f0;
|
||||
color: rgba(212, 201, 168, 0.3);
|
||||
}
|
||||
|
||||
.status--success { color: #4ade80; }
|
||||
@@ -888,7 +888,7 @@ type Tab = 'health' | 'bench' | 'cache' | 'config' | 'fingerprint';
|
||||
gap: 2rem;
|
||||
margin-top: 1rem;
|
||||
font-size: 0.8125rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
}
|
||||
|
||||
/* Cache Tab */
|
||||
@@ -902,19 +902,19 @@ type Tab = 'health' | 'bench' | 'cache' | 'config' | 'fingerprint';
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding: 1rem;
|
||||
background: #1e293b;
|
||||
background: #3D2E0A;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.cache-label {
|
||||
font-size: 0.75rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
margin-bottom: 0.25rem;
|
||||
}
|
||||
|
||||
.cache-value {
|
||||
font-weight: 500;
|
||||
color: #e2e8f0;
|
||||
color: rgba(212, 201, 168, 0.3);
|
||||
}
|
||||
|
||||
.stats-grid {
|
||||
@@ -928,7 +928,7 @@ type Tab = 'health' | 'bench' | 'cache' | 'config' | 'fingerprint';
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
padding: 1.25rem;
|
||||
background: #1e293b;
|
||||
background: #3D2E0A;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
@@ -940,12 +940,12 @@ type Tab = 'health' | 'bench' | 'cache' | 'config' | 'fingerprint';
|
||||
.stat-value {
|
||||
font-size: 1.5rem;
|
||||
font-weight: 600;
|
||||
color: #e2e8f0;
|
||||
color: rgba(212, 201, 168, 0.3);
|
||||
}
|
||||
|
||||
.stat-label {
|
||||
font-size: 0.75rem;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
margin-top: 0.25rem;
|
||||
}
|
||||
|
||||
@@ -968,14 +968,14 @@ type Tab = 'health' | 'bench' | 'cache' | 'config' | 'fingerprint';
|
||||
}
|
||||
|
||||
.config-table {
|
||||
background: #1e293b;
|
||||
background: #3D2E0A;
|
||||
border-radius: 4px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.config-table td {
|
||||
padding: 0.75rem 1rem;
|
||||
border-bottom: 1px solid #334155;
|
||||
border-bottom: 1px solid #3D2E0A;
|
||||
}
|
||||
|
||||
.config-table tr:last-child td {
|
||||
@@ -983,12 +983,12 @@ type Tab = 'health' | 'bench' | 'cache' | 'config' | 'fingerprint';
|
||||
}
|
||||
|
||||
.config-table td:first-child {
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
width: 40%;
|
||||
}
|
||||
|
||||
.config-value {
|
||||
color: #e2e8f0;
|
||||
color: rgba(212, 201, 168, 0.3);
|
||||
}
|
||||
|
||||
.config-value.monospace {
|
||||
@@ -1016,7 +1016,7 @@ type Tab = 'health' | 'bench' | 'cache' | 'config' | 'fingerprint';
|
||||
.fingerprint-label {
|
||||
display: block;
|
||||
font-size: 0.75rem;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
margin-bottom: 0.375rem;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
@@ -1024,10 +1024,10 @@ type Tab = 'health' | 'bench' | 'cache' | 'config' | 'fingerprint';
|
||||
.fingerprint-input {
|
||||
width: 100%;
|
||||
padding: 0.625rem 0.875rem;
|
||||
background: #1e293b;
|
||||
border: 1px solid #334155;
|
||||
background: #3D2E0A;
|
||||
border: 1px solid #3D2E0A;
|
||||
border-radius: 4px;
|
||||
color: #e2e8f0;
|
||||
color: rgba(212, 201, 168, 0.3);
|
||||
font-family: ui-monospace, monospace;
|
||||
font-size: 0.875rem;
|
||||
}
|
||||
@@ -1039,10 +1039,10 @@ type Tab = 'health' | 'bench' | 'cache' | 'config' | 'fingerprint';
|
||||
|
||||
.fingerprint-select {
|
||||
padding: 0.625rem 0.875rem;
|
||||
background: #1e293b;
|
||||
border: 1px solid #334155;
|
||||
background: #3D2E0A;
|
||||
border: 1px solid #3D2E0A;
|
||||
border-radius: 4px;
|
||||
color: #e2e8f0;
|
||||
color: rgba(212, 201, 168, 0.3);
|
||||
font-size: 0.875rem;
|
||||
cursor: pointer;
|
||||
}
|
||||
@@ -1090,20 +1090,20 @@ type Tab = 'health' | 'bench' | 'cache' | 'config' | 'fingerprint';
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding: 1rem;
|
||||
background: #1e293b;
|
||||
background: #3D2E0A;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.fingerprint-stat-label {
|
||||
font-size: 0.75rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
margin-bottom: 0.25rem;
|
||||
}
|
||||
|
||||
.fingerprint-stat-value {
|
||||
font-size: 1.125rem;
|
||||
font-weight: 500;
|
||||
color: #e2e8f0;
|
||||
color: rgba(212, 201, 168, 0.3);
|
||||
}
|
||||
|
||||
.fingerprint-actions {
|
||||
@@ -1129,7 +1129,7 @@ type Tab = 'health' | 'bench' | 'cache' | 'config' | 'fingerprint';
|
||||
|
||||
.fingerprint-meta {
|
||||
font-size: 0.8125rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
}
|
||||
|
||||
.fingerprint-table {
|
||||
@@ -1142,13 +1142,13 @@ type Tab = 'health' | 'bench' | 'cache' | 'config' | 'fingerprint';
|
||||
.fingerprint-table td {
|
||||
padding: 0.75rem;
|
||||
text-align: left;
|
||||
border-bottom: 1px solid #334155;
|
||||
border-bottom: 1px solid #3D2E0A;
|
||||
}
|
||||
|
||||
.fingerprint-table th {
|
||||
font-weight: 500;
|
||||
color: #94a3b8;
|
||||
background: #0f172a;
|
||||
color: #D4C9A8;
|
||||
background: #1C1200;
|
||||
}
|
||||
|
||||
.fingerprint-table .monospace {
|
||||
@@ -1157,12 +1157,12 @@ type Tab = 'health' | 'bench' | 'cache' | 'config' | 'fingerprint';
|
||||
|
||||
.fingerprint-table .hash-cell {
|
||||
font-size: 0.8125rem;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
}
|
||||
|
||||
.table-overflow {
|
||||
font-size: 0.8125rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
|
||||
@@ -152,7 +152,7 @@ import { ChangeTraceService } from './services/change-trace.service';
|
||||
|
||||
.btn-primary {
|
||||
background: var(--color-primary, #2563eb);
|
||||
color: white;
|
||||
color: #1C1200;
|
||||
|
||||
&:hover:not(:disabled) {
|
||||
background: var(--color-primary-hover, #1d4ed8);
|
||||
|
||||
@@ -93,7 +93,7 @@ export class GraphMiniMapComponent implements AfterViewInit, OnDestroy {
|
||||
const height = rect.height;
|
||||
|
||||
// Clear
|
||||
this.ctx.fillStyle = '#f8fafc';
|
||||
this.ctx.fillStyle = '#FFFCF5';
|
||||
this.ctx.fillRect(0, 0, width, height);
|
||||
|
||||
const nodes = this.nodes();
|
||||
@@ -134,7 +134,7 @@ export class GraphMiniMapComponent implements AfterViewInit, OnDestroy {
|
||||
this.ctx.fillStyle = '#f59e0b';
|
||||
break;
|
||||
default:
|
||||
this.ctx.fillStyle = '#94a3b8';
|
||||
this.ctx.fillStyle = '#D4C9A8';
|
||||
}
|
||||
|
||||
this.ctx.fill();
|
||||
|
||||
@@ -366,7 +366,7 @@ import {
|
||||
|
||||
.btn-primary {
|
||||
background: var(--theme-brand-primary);
|
||||
color: white;
|
||||
color: #1C1200;
|
||||
}
|
||||
|
||||
.btn-primary:hover:not(:disabled) {
|
||||
|
||||
@@ -605,7 +605,7 @@ import {
|
||||
|
||||
.btn-primary {
|
||||
background: var(--theme-brand-primary);
|
||||
color: white;
|
||||
color: #1C1200;
|
||||
}
|
||||
|
||||
.btn-secondary {
|
||||
@@ -615,7 +615,7 @@ import {
|
||||
|
||||
.btn-danger {
|
||||
background: var(--theme-status-error);
|
||||
color: white;
|
||||
color: #1C1200;
|
||||
}
|
||||
|
||||
.btn-sm {
|
||||
|
||||
@@ -166,7 +166,7 @@ import { ConfigurationSection, ConfiguredIntegration, ConnectionStatus } from '.
|
||||
.btn-add {
|
||||
padding: 6px 14px;
|
||||
background: var(--theme-brand-primary);
|
||||
color: white;
|
||||
color: #1C1200;
|
||||
border: none;
|
||||
border-radius: 4px;
|
||||
font-size: 13px;
|
||||
@@ -286,7 +286,7 @@ import { ConfigurationSection, ConfiguredIntegration, ConnectionStatus } from '.
|
||||
font-weight: 600;
|
||||
padding: 1px 5px;
|
||||
background: var(--theme-brand-primary);
|
||||
color: white;
|
||||
color: #1C1200;
|
||||
border-radius: 3px;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
@@ -465,7 +465,7 @@ interface ThemeToken {
|
||||
|
||||
.btn-primary {
|
||||
background: var(--theme-brand-primary);
|
||||
color: white;
|
||||
color: #1C1200;
|
||||
}
|
||||
|
||||
.btn-primary:hover:not(:disabled) {
|
||||
|
||||
@@ -333,7 +333,7 @@ import { StellaOpsScopes } from '../../../core/auth/scopes';
|
||||
display: inline-block;
|
||||
padding: 2px 8px;
|
||||
background: var(--theme-brand-primary);
|
||||
color: white;
|
||||
color: #1C1200;
|
||||
border-radius: 4px;
|
||||
font-size: 12px;
|
||||
}
|
||||
@@ -357,7 +357,7 @@ import { StellaOpsScopes } from '../../../core/auth/scopes';
|
||||
|
||||
.status-badge.status-disabled {
|
||||
background: var(--theme-status-warning);
|
||||
color: white;
|
||||
color: #1C1200;
|
||||
}
|
||||
|
||||
.action-buttons {
|
||||
@@ -378,7 +378,7 @@ import { StellaOpsScopes } from '../../../core/auth/scopes';
|
||||
|
||||
.btn-primary {
|
||||
background: var(--theme-brand-primary);
|
||||
color: white;
|
||||
color: #1C1200;
|
||||
}
|
||||
|
||||
.btn-primary:hover:not(:disabled) {
|
||||
|
||||
@@ -472,7 +472,7 @@ interface RoleBundle {
|
||||
display: inline-block;
|
||||
padding: 2px 8px;
|
||||
background: var(--theme-brand-primary);
|
||||
color: white;
|
||||
color: #1C1200;
|
||||
border-radius: 4px;
|
||||
font-size: 12px;
|
||||
}
|
||||
@@ -495,7 +495,7 @@ interface RoleBundle {
|
||||
|
||||
.btn-primary {
|
||||
background: var(--theme-brand-primary);
|
||||
color: white;
|
||||
color: #1C1200;
|
||||
}
|
||||
|
||||
.btn-primary:hover:not(:disabled) {
|
||||
|
||||
@@ -101,13 +101,13 @@ import { FreshAuthService } from '../../../core/auth/fresh-auth.service';
|
||||
.admin-table td {
|
||||
padding: 12px;
|
||||
text-align: left;
|
||||
border-bottom: 1px solid #e2e8f0;
|
||||
border-bottom: 1px solid rgba(212, 201, 168, 0.3);
|
||||
}
|
||||
|
||||
.admin-table th {
|
||||
background: #f8fafc;
|
||||
background: #FFFCF5;
|
||||
font-weight: 600;
|
||||
color: #475569;
|
||||
color: #6B5A2E;
|
||||
}
|
||||
|
||||
.status-badge {
|
||||
@@ -132,7 +132,7 @@ import { FreshAuthService } from '../../../core/auth/fresh-auth.service';
|
||||
.empty-state {
|
||||
padding: 48px;
|
||||
text-align: center;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
}
|
||||
|
||||
.error {
|
||||
|
||||
@@ -250,7 +250,7 @@ import { StellaOpsScopes } from '../../../core/auth/scopes';
|
||||
display: inline-block;
|
||||
padding: 2px 8px;
|
||||
background: var(--theme-brand-primary);
|
||||
color: white;
|
||||
color: #1C1200;
|
||||
border-radius: 4px;
|
||||
font-size: 12px;
|
||||
}
|
||||
@@ -270,7 +270,7 @@ import { StellaOpsScopes } from '../../../core/auth/scopes';
|
||||
|
||||
.status-badge.status-disabled {
|
||||
background: var(--theme-status-warning);
|
||||
color: white;
|
||||
color: #1C1200;
|
||||
}
|
||||
|
||||
.action-buttons {
|
||||
@@ -291,7 +291,7 @@ import { StellaOpsScopes } from '../../../core/auth/scopes';
|
||||
|
||||
.btn-primary {
|
||||
background: var(--theme-brand-primary);
|
||||
color: white;
|
||||
color: #1C1200;
|
||||
}
|
||||
|
||||
.btn-primary:hover:not(:disabled) {
|
||||
|
||||
@@ -146,12 +146,12 @@ import { RouterLink } from '@angular/router';
|
||||
margin: 0 0 0.5rem;
|
||||
font-size: 1.75rem;
|
||||
font-weight: 600;
|
||||
color: var(--text-color, #1e293b);
|
||||
color: var(--text-color, #3D2E0A);
|
||||
}
|
||||
|
||||
.dashboard__subtitle {
|
||||
margin: 0;
|
||||
color: var(--text-color-secondary, #64748b);
|
||||
color: var(--text-color-secondary, #6B5A2E);
|
||||
}
|
||||
|
||||
.dashboard__actions {
|
||||
@@ -167,7 +167,7 @@ import { RouterLink } from '@angular/router';
|
||||
margin: 0 0 1rem;
|
||||
font-size: 1.125rem;
|
||||
font-weight: 600;
|
||||
color: var(--text-color, #1e293b);
|
||||
color: var(--text-color, #3D2E0A);
|
||||
}
|
||||
|
||||
.dashboard__grid {
|
||||
@@ -184,7 +184,7 @@ import { RouterLink } from '@angular/router';
|
||||
gap: 0.5rem;
|
||||
padding: 1.5rem;
|
||||
background: var(--surface-card, #ffffff);
|
||||
border: 1px solid var(--surface-border, #e2e8f0);
|
||||
border: 1px solid var(--surface-border, rgba(212, 201, 168, 0.3));
|
||||
border-radius: 8px;
|
||||
overflow-x: auto;
|
||||
}
|
||||
@@ -193,8 +193,8 @@ import { RouterLink } from '@angular/router';
|
||||
flex: 1;
|
||||
min-width: 120px;
|
||||
padding: 1rem;
|
||||
background: var(--surface-ground, #f8fafc);
|
||||
border: 1px solid var(--surface-border, #e2e8f0);
|
||||
background: var(--surface-ground, #FFFCF5);
|
||||
border: 1px solid var(--surface-border, rgba(212, 201, 168, 0.3));
|
||||
border-radius: 8px;
|
||||
text-align: center;
|
||||
}
|
||||
@@ -211,12 +211,12 @@ import { RouterLink } from '@angular/router';
|
||||
.pipeline__stage-name {
|
||||
display: block;
|
||||
font-weight: 600;
|
||||
color: var(--text-color, #1e293b);
|
||||
color: var(--text-color, #3D2E0A);
|
||||
}
|
||||
|
||||
.pipeline__stage-version {
|
||||
font-size: 0.875rem;
|
||||
color: var(--text-color-secondary, #64748b);
|
||||
color: var(--text-color-secondary, #6B5A2E);
|
||||
}
|
||||
|
||||
.pipeline__status-badge {
|
||||
@@ -240,20 +240,20 @@ import { RouterLink } from '@angular/router';
|
||||
.pipeline__arrow {
|
||||
flex-shrink: 0;
|
||||
font-size: 1.25rem;
|
||||
color: var(--text-color-secondary, #94a3b8);
|
||||
color: var(--text-color-secondary, #D4C9A8);
|
||||
}
|
||||
|
||||
.pipeline__hint {
|
||||
margin: 0.75rem 0 0;
|
||||
font-size: 0.875rem;
|
||||
color: var(--text-color-secondary, #64748b);
|
||||
color: var(--text-color-secondary, #6B5A2E);
|
||||
}
|
||||
|
||||
/* Cards */
|
||||
.card {
|
||||
padding: 1.5rem;
|
||||
background: var(--surface-card, #ffffff);
|
||||
border: 1px solid var(--surface-border, #e2e8f0);
|
||||
border: 1px solid var(--surface-border, rgba(212, 201, 168, 0.3));
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
@@ -266,7 +266,7 @@ import { RouterLink } from '@angular/router';
|
||||
.card__subtitle {
|
||||
margin: 0 0 1rem;
|
||||
font-size: 0.875rem;
|
||||
color: var(--text-color-secondary, #64748b);
|
||||
color: var(--text-color-secondary, #6B5A2E);
|
||||
}
|
||||
|
||||
.card__list {
|
||||
@@ -286,7 +286,7 @@ import { RouterLink } from '@angular/router';
|
||||
.table-container {
|
||||
overflow-x: auto;
|
||||
background: var(--surface-card, #ffffff);
|
||||
border: 1px solid var(--surface-border, #e2e8f0);
|
||||
border: 1px solid var(--surface-border, rgba(212, 201, 168, 0.3));
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
@@ -299,7 +299,7 @@ import { RouterLink } from '@angular/router';
|
||||
.table td {
|
||||
padding: 0.75rem 1rem;
|
||||
text-align: left;
|
||||
border-bottom: 1px solid var(--surface-border, #e2e8f0);
|
||||
border-bottom: 1px solid var(--surface-border, rgba(212, 201, 168, 0.3));
|
||||
}
|
||||
|
||||
.table th {
|
||||
@@ -307,8 +307,8 @@ import { RouterLink } from '@angular/router';
|
||||
font-weight: 600;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.05em;
|
||||
color: var(--text-color-secondary, #64748b);
|
||||
background: var(--surface-ground, #f8fafc);
|
||||
color: var(--text-color-secondary, #6B5A2E);
|
||||
background: var(--surface-ground, #FFFCF5);
|
||||
}
|
||||
|
||||
.table td {
|
||||
@@ -384,7 +384,7 @@ import { RouterLink } from '@angular/router';
|
||||
|
||||
.btn--primary {
|
||||
background: var(--primary-color, #3b82f6);
|
||||
color: white;
|
||||
color: #1C1200;
|
||||
|
||||
&:hover {
|
||||
background: var(--primary-600, #2563eb);
|
||||
@@ -392,11 +392,11 @@ import { RouterLink } from '@angular/router';
|
||||
}
|
||||
|
||||
.btn--secondary {
|
||||
background: var(--surface-ground, #f1f5f9);
|
||||
color: var(--text-color, #1e293b);
|
||||
background: var(--surface-ground, #FFF9ED);
|
||||
color: var(--text-color, #3D2E0A);
|
||||
|
||||
&:hover {
|
||||
background: var(--surface-hover, #e2e8f0);
|
||||
background: var(--surface-hover, rgba(212, 201, 168, 0.3));
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -260,7 +260,7 @@ export interface DashboardAiData {
|
||||
border-radius: 50%;
|
||||
font-size: 0.75rem;
|
||||
font-weight: 600;
|
||||
color: white;
|
||||
color: #1C1200;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
|
||||
@@ -416,7 +416,7 @@ import {
|
||||
|
||||
.btn:hover:not(:disabled) { background: var(--bg-tertiary); }
|
||||
.btn:disabled { opacity: 0.5; cursor: not-allowed; }
|
||||
.btn-primary { background: var(--color-primary); color: white; border-color: var(--color-primary); }
|
||||
.btn-primary { background: var(--color-primary); color: #1C1200; border-color: var(--color-primary); }
|
||||
.btn-sm { padding: 0.25rem 0.5rem; font-size: 0.75rem; }
|
||||
.btn-icon { padding: 0.5rem; }
|
||||
.spinning { animation: spin 1s linear infinite; }
|
||||
|
||||
@@ -353,7 +353,7 @@ import {
|
||||
|
||||
.btn:hover:not(:disabled) { background: var(--bg-tertiary); }
|
||||
.btn:disabled { opacity: 0.5; cursor: not-allowed; }
|
||||
.btn-primary { background: var(--color-primary); color: white; border-color: var(--color-primary); }
|
||||
.btn-primary { background: var(--color-primary); color: #1C1200; border-color: var(--color-primary); }
|
||||
.btn-secondary { background: var(--bg-secondary); }
|
||||
.btn-sm { padding: 0.25rem 0.5rem; font-size: 0.75rem; }
|
||||
.btn-close { background: none; border: none; font-size: 1.5rem; cursor: pointer; }
|
||||
|
||||
@@ -322,8 +322,8 @@ interface DeploymentArtifact {
|
||||
.header-main { flex: 1; }
|
||||
.header-title-row { display: flex; align-items: center; gap: 0.75rem; margin-bottom: 0.5rem; }
|
||||
.page-title { margin: 0; font-size: 1.5rem; font-weight: 600; font-family: ui-monospace, SFMono-Regular, monospace; }
|
||||
.header-meta { display: flex; flex-wrap: wrap; gap: 1rem; font-size: 0.875rem; color: var(--text-color-secondary, #64748b); }
|
||||
.header-meta strong { color: var(--text-color, #1e293b); }
|
||||
.header-meta { display: flex; flex-wrap: wrap; gap: 1rem; font-size: 0.875rem; color: var(--text-color-secondary, #6B5A2E); }
|
||||
.header-meta strong { color: var(--text-color, #3D2E0A); }
|
||||
.header-meta code { font-size: 0.625rem; }
|
||||
.header-actions { display: flex; gap: 0.5rem; flex-wrap: wrap; }
|
||||
|
||||
@@ -334,21 +334,21 @@ interface DeploymentArtifact {
|
||||
.status-badge--cancelled { background: var(--gray-100, #f3f4f6); color: var(--gray-600, #4b5563); }
|
||||
|
||||
/* Tabs */
|
||||
.tabs { display: flex; gap: 0.25rem; border-bottom: 1px solid var(--surface-border, #e2e8f0); margin-bottom: 1.5rem; overflow-x: auto; }
|
||||
.tab { padding: 0.75rem 1rem; background: transparent; border: none; border-bottom: 2px solid transparent; margin-bottom: -1px; font-size: 0.875rem; font-weight: 500; color: var(--text-color-secondary, #64748b); cursor: pointer; white-space: nowrap; }
|
||||
.tab:hover { color: var(--text-color, #1e293b); }
|
||||
.tabs { display: flex; gap: 0.25rem; border-bottom: 1px solid var(--surface-border, rgba(212, 201, 168, 0.3)); margin-bottom: 1.5rem; overflow-x: auto; }
|
||||
.tab { padding: 0.75rem 1rem; background: transparent; border: none; border-bottom: 2px solid transparent; margin-bottom: -1px; font-size: 0.875rem; font-weight: 500; color: var(--text-color-secondary, #6B5A2E); cursor: pointer; white-space: nowrap; }
|
||||
.tab:hover { color: var(--text-color, #3D2E0A); }
|
||||
.tab--active { color: var(--primary-color, #3b82f6); border-bottom-color: var(--primary-color, #3b82f6); }
|
||||
|
||||
/* Panel */
|
||||
.panel { padding: 1.25rem; background: var(--surface-card, #ffffff); border: 1px solid var(--surface-border, #e2e8f0); border-radius: 8px; }
|
||||
.panel { padding: 1.25rem; background: var(--surface-card, #ffffff); border: 1px solid var(--surface-border, rgba(212, 201, 168, 0.3)); border-radius: 8px; }
|
||||
.panel h3 { margin: 0; font-size: 1rem; font-weight: 600; }
|
||||
.panel-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.5rem; }
|
||||
|
||||
/* Workflow DAG (DEP-003) */
|
||||
.workflow-panel { }
|
||||
.workflow-summary { font-size: 0.75rem; color: var(--text-color-secondary, #64748b); }
|
||||
.workflow-summary { font-size: 0.75rem; color: var(--text-color-secondary, #6B5A2E); }
|
||||
.workflow-dag { display: flex; flex-direction: column; align-items: center; gap: 0; padding: 1rem 0; }
|
||||
.dag-node { display: flex; align-items: center; gap: 1rem; padding: 0.75rem 1.5rem; background: var(--surface-ground, #f8fafc); border: 2px solid var(--surface-border, #e2e8f0); border-radius: 8px; cursor: pointer; transition: all 0.15s; min-width: 250px; position: relative; }
|
||||
.dag-node { display: flex; align-items: center; gap: 1rem; padding: 0.75rem 1.5rem; background: var(--surface-ground, #FFFCF5); border: 2px solid var(--surface-border, rgba(212, 201, 168, 0.3)); border-radius: 8px; cursor: pointer; transition: all 0.15s; min-width: 250px; position: relative; }
|
||||
.dag-node:hover { border-color: var(--primary-color, #3b82f6); }
|
||||
.dag-node--selected { border-color: var(--primary-color, #3b82f6); box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.2); }
|
||||
.dag-node--complete { border-color: var(--green-300, #86efac); background: var(--green-50, #f0fdf4); }
|
||||
@@ -363,25 +363,25 @@ interface DeploymentArtifact {
|
||||
.dag-node--pending .dag-node__icon { background: var(--gray-100, #f3f4f6); color: var(--gray-400, #9ca3af); }
|
||||
.dag-node__content { flex: 1; }
|
||||
.dag-node__name { display: block; font-weight: 600; font-size: 0.875rem; }
|
||||
.dag-node__duration { display: block; font-size: 0.75rem; color: var(--text-color-secondary, #64748b); }
|
||||
.dag-connector { position: absolute; bottom: -40px; left: 50%; transform: translateX(-50%); color: var(--surface-border, #cbd5e1); z-index: 1; }
|
||||
.dag-node__duration { display: block; font-size: 0.75rem; color: var(--text-color-secondary, #6B5A2E); }
|
||||
.dag-connector { position: absolute; bottom: -40px; left: 50%; transform: translateX(-50%); color: var(--surface-border, rgba(212, 201, 168, 0.5)); z-index: 1; }
|
||||
.icon-spin { animation: spin 1s linear infinite; }
|
||||
@keyframes spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
|
||||
@keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.7; } }
|
||||
|
||||
.step-detail { margin-top: 1.5rem; padding: 1rem; background: var(--surface-ground, #f8fafc); border-radius: 8px; border: 1px solid var(--surface-border, #e2e8f0); }
|
||||
.step-detail { margin-top: 1.5rem; padding: 1rem; background: var(--surface-ground, #FFFCF5); border-radius: 8px; border: 1px solid var(--surface-border, rgba(212, 201, 168, 0.3)); }
|
||||
.step-detail__header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 0.5rem; }
|
||||
.step-detail__header h4 { margin: 0; font-size: 0.875rem; }
|
||||
.step-detail__status { font-size: 0.625rem; padding: 0.125rem 0.5rem; border-radius: 4px; font-weight: 600; }
|
||||
.step-detail__status--complete { background: var(--green-100, #dcfce7); color: var(--green-700, #15803d); }
|
||||
.step-detail__status--running { background: var(--blue-100, #dbeafe); color: var(--blue-700, #1d4ed8); }
|
||||
.step-detail__status--failed { background: var(--red-100, #fee2e2); color: var(--red-700, #b91c1c); }
|
||||
.step-detail__meta { font-size: 0.75rem; color: var(--text-color-secondary, #64748b); display: flex; gap: 1rem; margin-bottom: 0.75rem; }
|
||||
.step-detail__meta { font-size: 0.75rem; color: var(--text-color-secondary, #6B5A2E); display: flex; gap: 1rem; margin-bottom: 0.75rem; }
|
||||
.step-detail__logs { background: var(--gray-900, #111827); padding: 0.75rem; border-radius: 6px; max-height: 200px; overflow: auto; }
|
||||
.step-detail__logs pre { margin: 0; font-size: 0.625rem; color: var(--gray-100, #f3f4f6); font-family: ui-monospace, monospace; }
|
||||
|
||||
/* Artifacts Table (DEP-004) */
|
||||
.artifacts-count { font-size: 0.75rem; color: var(--text-color-secondary, #64748b); }
|
||||
.artifacts-count { font-size: 0.75rem; color: var(--text-color-secondary, #6B5A2E); }
|
||||
.artifacts-table { }
|
||||
.artifact-name { display: flex; align-items: center; gap: 0.5rem; }
|
||||
.artifact-icon { font-size: 1rem; }
|
||||
@@ -399,11 +399,11 @@ interface DeploymentArtifact {
|
||||
/* Logs (DEP-005) */
|
||||
.logs-panel { display: flex; flex-direction: column; }
|
||||
.logs-controls { display: flex; gap: 0.5rem; flex-wrap: wrap; align-items: center; }
|
||||
.logs-step-select { padding: 0.375rem 0.75rem; border: 1px solid var(--surface-border, #e2e8f0); border-radius: 6px; font-size: 0.75rem; }
|
||||
.logs-search { padding: 0.375rem 0.75rem; border: 1px solid var(--surface-border, #e2e8f0); border-radius: 6px; font-size: 0.75rem; width: 200px; }
|
||||
.logs-step-select { padding: 0.375rem 0.75rem; border: 1px solid var(--surface-border, rgba(212, 201, 168, 0.3)); border-radius: 6px; font-size: 0.75rem; }
|
||||
.logs-search { padding: 0.375rem 0.75rem; border: 1px solid var(--surface-border, rgba(212, 201, 168, 0.3)); border-radius: 6px; font-size: 0.75rem; width: 200px; }
|
||||
.log-viewer { background: var(--gray-900, #111827); border-radius: 8px; padding: 1rem; max-height: 500px; overflow: auto; flex: 1; }
|
||||
.log-content { margin: 0; font-size: 0.75rem; color: var(--gray-100, #f3f4f6); font-family: ui-monospace, monospace; white-space: pre-wrap; }
|
||||
.logs-footer { display: flex; justify-content: space-between; padding-top: 0.5rem; font-size: 0.75rem; color: var(--text-color-secondary, #64748b); }
|
||||
.logs-footer { display: flex; justify-content: space-between; padding-top: 0.5rem; font-size: 0.75rem; color: var(--text-color-secondary, #6B5A2E); }
|
||||
.logs-match-count { color: var(--yellow-600, #ca8a04); }
|
||||
|
||||
/* Targets */
|
||||
@@ -417,7 +417,7 @@ interface DeploymentArtifact {
|
||||
.evidence-info a { color: var(--primary-color, #3b82f6); }
|
||||
.evidence-summary { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1rem; }
|
||||
.evidence-item { display: flex; flex-direction: column; gap: 0.25rem; }
|
||||
.evidence-label { font-size: 0.625rem; text-transform: uppercase; color: var(--text-color-secondary, #94a3b8); }
|
||||
.evidence-label { font-size: 0.625rem; text-transform: uppercase; color: var(--text-color-secondary, #D4C9A8); }
|
||||
.evidence-item code { font-size: 0.625rem; }
|
||||
.evidence-badge { font-size: 0.625rem; padding: 0.125rem 0.5rem; border-radius: 4px; font-weight: 600; width: fit-content; }
|
||||
.evidence-badge--success { background: var(--green-100, #dcfce7); color: var(--green-700, #15803d); }
|
||||
@@ -425,15 +425,15 @@ interface DeploymentArtifact {
|
||||
|
||||
/* Data Table */
|
||||
.data-table { width: 100%; border-collapse: collapse; }
|
||||
.data-table th, .data-table td { padding: 0.75rem; text-align: left; border-bottom: 1px solid var(--surface-border, #e2e8f0); }
|
||||
.data-table th { font-size: 0.75rem; font-weight: 600; color: var(--text-color-secondary, #64748b); text-transform: uppercase; }
|
||||
.data-table th, .data-table td { padding: 0.75rem; text-align: left; border-bottom: 1px solid var(--surface-border, rgba(212, 201, 168, 0.3)); }
|
||||
.data-table th { font-size: 0.75rem; font-weight: 600; color: var(--text-color-secondary, #6B5A2E); text-transform: uppercase; }
|
||||
.data-table code { font-size: 0.625rem; }
|
||||
|
||||
/* Buttons */
|
||||
.btn { padding: 0.5rem 1rem; border-radius: 6px; font-size: 0.875rem; font-weight: 500; cursor: pointer; text-decoration: none; }
|
||||
.btn--sm { padding: 0.25rem 0.5rem; font-size: 0.75rem; }
|
||||
.btn--secondary { background: var(--surface-ground, #f8fafc); border: 1px solid var(--surface-border, #e2e8f0); color: var(--text-color, #1e293b); }
|
||||
.btn--secondary:hover { background: var(--surface-hover, #f1f5f9); }
|
||||
.btn--secondary { background: var(--surface-ground, #FFFCF5); border: 1px solid var(--surface-border, rgba(212, 201, 168, 0.3)); color: var(--text-color, #3D2E0A); }
|
||||
.btn--secondary:hover { background: var(--surface-hover, #FFF9ED); }
|
||||
.btn--secondary.active { background: var(--primary-color, #3b82f6); color: white; border-color: var(--primary-color, #3b82f6); }
|
||||
|
||||
@media (max-width: 768px) {
|
||||
|
||||
@@ -82,18 +82,18 @@ interface Deployment {
|
||||
.deployments-page { max-width: 1400px; margin: 0 auto; }
|
||||
.page-header { margin-bottom: 1.5rem; }
|
||||
.page-title { margin: 0 0 0.25rem; font-size: 1.5rem; font-weight: 600; }
|
||||
.page-subtitle { margin: 0; color: var(--text-color-secondary, #64748b); }
|
||||
.page-subtitle { margin: 0; color: var(--text-color-secondary, #6B5A2E); }
|
||||
|
||||
.table-container {
|
||||
background: var(--surface-card, #ffffff);
|
||||
border: 1px solid var(--surface-border, #e2e8f0);
|
||||
border: 1px solid var(--surface-border, rgba(212, 201, 168, 0.3));
|
||||
border-radius: 8px;
|
||||
overflow: hidden;
|
||||
}
|
||||
.data-table { width: 100%; border-collapse: collapse; }
|
||||
.data-table th, .data-table td { padding: 0.75rem 1rem; text-align: left; border-bottom: 1px solid var(--surface-border, #e2e8f0); }
|
||||
.data-table th { background: var(--surface-ground, #f8fafc); font-size: 0.75rem; font-weight: 600; color: var(--text-color-secondary, #64748b); text-transform: uppercase; }
|
||||
.data-table tbody tr:hover { background: var(--surface-hover, #f8fafc); }
|
||||
.data-table th, .data-table td { padding: 0.75rem 1rem; text-align: left; border-bottom: 1px solid var(--surface-border, rgba(212, 201, 168, 0.3)); }
|
||||
.data-table th { background: var(--surface-ground, #FFFCF5); font-size: 0.75rem; font-weight: 600; color: var(--text-color-secondary, #6B5A2E); text-transform: uppercase; }
|
||||
.data-table tbody tr:hover { background: var(--surface-hover, #FFFCF5); }
|
||||
.data-table a { color: var(--primary-color, #3b82f6); text-decoration: none; }
|
||||
|
||||
.deployment-link { font-family: ui-monospace, SFMono-Regular, monospace; font-weight: 500; }
|
||||
@@ -114,7 +114,7 @@ interface Deployment {
|
||||
}
|
||||
@keyframes spin { to { transform: rotate(360deg); } }
|
||||
|
||||
.btn { padding: 0.25rem 0.5rem; border-radius: 6px; font-size: 0.75rem; font-weight: 500; text-decoration: none; background: var(--surface-ground, #f8fafc); border: 1px solid var(--surface-border, #e2e8f0); color: var(--text-color, #1e293b); }
|
||||
.btn { padding: 0.25rem 0.5rem; border-radius: 6px; font-size: 0.75rem; font-weight: 500; text-decoration: none; background: var(--surface-ground, #FFFCF5); border: 1px solid var(--surface-border, rgba(212, 201, 168, 0.3)); color: var(--text-color, #3D2E0A); }
|
||||
`]
|
||||
})
|
||||
export class DeploymentsListPageComponent {
|
||||
|
||||
@@ -40,7 +40,7 @@ import { Evidence } from '../../models/doctor.models';
|
||||
`,
|
||||
styles: [`
|
||||
.evidence-viewer {
|
||||
background: var(--bg-tertiary, #f8fafc);
|
||||
background: var(--bg-tertiary, #FFFCF5);
|
||||
border-radius: 6px;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
@@ -55,7 +55,7 @@ import { Evidence } from '../../models/doctor.models';
|
||||
transition: background 0.15s ease;
|
||||
|
||||
&:hover {
|
||||
background: var(--bg-hover, #f1f5f9);
|
||||
background: var(--bg-hover, #FFF9ED);
|
||||
}
|
||||
|
||||
h4 {
|
||||
@@ -67,7 +67,7 @@ import { Evidence } from '../../models/doctor.models';
|
||||
|
||||
.toggle-icon {
|
||||
font-size: 0.75rem;
|
||||
color: var(--text-tertiary, #94a3b8);
|
||||
color: var(--text-tertiary, #D4C9A8);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -78,12 +78,12 @@ import { Evidence } from '../../models/doctor.models';
|
||||
.evidence-description {
|
||||
margin: 0 0 0.75rem 0;
|
||||
font-size: 0.875rem;
|
||||
color: var(--text-secondary, #64748b);
|
||||
color: var(--text-secondary, #6B5A2E);
|
||||
}
|
||||
|
||||
.evidence-data {
|
||||
background: white;
|
||||
border: 1px solid var(--border, #e2e8f0);
|
||||
border: 1px solid var(--border, rgba(212, 201, 168, 0.3));
|
||||
border-radius: 6px;
|
||||
overflow: hidden;
|
||||
|
||||
@@ -93,7 +93,7 @@ import { Evidence } from '../../models/doctor.models';
|
||||
}
|
||||
|
||||
tr:not(:last-child) {
|
||||
border-bottom: 1px solid var(--border, #e2e8f0);
|
||||
border-bottom: 1px solid var(--border, rgba(212, 201, 168, 0.3));
|
||||
}
|
||||
|
||||
td {
|
||||
@@ -105,15 +105,15 @@ import { Evidence } from '../../models/doctor.models';
|
||||
width: 30%;
|
||||
font-weight: 500;
|
||||
color: var(--text-primary, #1a1a2e);
|
||||
background: var(--bg-secondary, #f8fafc);
|
||||
border-right: 1px solid var(--border, #e2e8f0);
|
||||
background: var(--bg-secondary, #FFFCF5);
|
||||
border-right: 1px solid var(--border, rgba(212, 201, 168, 0.3));
|
||||
}
|
||||
|
||||
.data-value {
|
||||
code {
|
||||
font-family: 'JetBrains Mono', 'Fira Code', monospace;
|
||||
font-size: 0.75rem;
|
||||
color: var(--text-secondary, #64748b);
|
||||
color: var(--text-secondary, #6B5A2E);
|
||||
word-break: break-all;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -118,7 +118,7 @@ type ExportFormat = 'json' | 'markdown' | 'text' | 'dsse';
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 1rem 1.5rem;
|
||||
border-bottom: 1px solid var(--border, #e2e8f0);
|
||||
border-bottom: 1px solid var(--border, rgba(212, 201, 168, 0.3));
|
||||
|
||||
h2 {
|
||||
margin: 0;
|
||||
@@ -132,7 +132,7 @@ type ExportFormat = 'json' | 'markdown' | 'text' | 'dsse';
|
||||
border: none;
|
||||
background: transparent;
|
||||
font-size: 1.5rem;
|
||||
color: var(--text-secondary, #64748b);
|
||||
color: var(--text-secondary, #6B5A2E);
|
||||
cursor: pointer;
|
||||
border-radius: 4px;
|
||||
display: flex;
|
||||
@@ -140,7 +140,7 @@ type ExportFormat = 'json' | 'markdown' | 'text' | 'dsse';
|
||||
justify-content: center;
|
||||
|
||||
&:hover {
|
||||
background: var(--bg-hover, #f1f5f9);
|
||||
background: var(--bg-hover, #FFF9ED);
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -163,13 +163,13 @@ type ExportFormat = 'json' | 'markdown' | 'text' | 'dsse';
|
||||
align-items: flex-start;
|
||||
gap: 0.75rem;
|
||||
padding: 0.75rem;
|
||||
border: 1px solid var(--border, #e2e8f0);
|
||||
border: 1px solid var(--border, rgba(212, 201, 168, 0.3));
|
||||
border-radius: 8px;
|
||||
cursor: pointer;
|
||||
transition: all 0.15s ease;
|
||||
|
||||
&:hover {
|
||||
background: var(--bg-hover, #f8fafc);
|
||||
background: var(--bg-hover, #FFFCF5);
|
||||
}
|
||||
|
||||
&:has(input:checked) {
|
||||
@@ -192,7 +192,7 @@ type ExportFormat = 'json' | 'markdown' | 'text' | 'dsse';
|
||||
|
||||
small {
|
||||
font-size: 0.75rem;
|
||||
color: var(--text-secondary, #64748b);
|
||||
color: var(--text-secondary, #6B5A2E);
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -206,11 +206,11 @@ type ExportFormat = 'json' | 'markdown' | 'text' | 'dsse';
|
||||
|
||||
.dsse-note {
|
||||
padding: 0.75rem;
|
||||
border: 1px dashed var(--border, #e2e8f0);
|
||||
border: 1px dashed var(--border, rgba(212, 201, 168, 0.3));
|
||||
border-radius: 8px;
|
||||
margin-bottom: 1.5rem;
|
||||
font-size: 0.8125rem;
|
||||
color: var(--text-secondary, #64748b);
|
||||
color: var(--text-secondary, #6B5A2E);
|
||||
}
|
||||
|
||||
.checkbox-option {
|
||||
@@ -239,11 +239,11 @@ type ExportFormat = 'json' | 'markdown' | 'text' | 'dsse';
|
||||
.preview-content {
|
||||
margin: 0;
|
||||
padding: 1rem;
|
||||
background: var(--bg-code, #1e293b);
|
||||
background: var(--bg-code, #3D2E0A);
|
||||
border-radius: 8px;
|
||||
font-family: 'JetBrains Mono', 'Fira Code', monospace;
|
||||
font-size: 0.75rem;
|
||||
color: var(--text-code, #e2e8f0);
|
||||
color: var(--text-code, rgba(212, 201, 168, 0.3));
|
||||
max-height: 200px;
|
||||
overflow: auto;
|
||||
white-space: pre-wrap;
|
||||
@@ -255,7 +255,7 @@ type ExportFormat = 'json' | 'markdown' | 'text' | 'dsse';
|
||||
justify-content: flex-end;
|
||||
gap: 0.75rem;
|
||||
padding: 1rem 1.5rem;
|
||||
border-top: 1px solid var(--border, #e2e8f0);
|
||||
border-top: 1px solid var(--border, rgba(212, 201, 168, 0.3));
|
||||
}
|
||||
|
||||
.btn {
|
||||
@@ -269,18 +269,18 @@ type ExportFormat = 'json' | 'markdown' | 'text' | 'dsse';
|
||||
|
||||
.btn-outline {
|
||||
background: transparent;
|
||||
border: 1px solid var(--border, #e2e8f0);
|
||||
border: 1px solid var(--border, rgba(212, 201, 168, 0.3));
|
||||
color: var(--text-primary, #1a1a2e);
|
||||
|
||||
&:hover {
|
||||
background: var(--bg-hover, #f1f5f9);
|
||||
background: var(--bg-hover, #FFF9ED);
|
||||
}
|
||||
}
|
||||
|
||||
.btn-primary {
|
||||
background: var(--primary, #3b82f6);
|
||||
border: 1px solid var(--primary, #3b82f6);
|
||||
color: white;
|
||||
color: #1C1200;
|
||||
|
||||
&:hover {
|
||||
background: var(--primary-dark, #2563eb);
|
||||
|
||||
@@ -73,7 +73,7 @@ import { Remediation, RemediationStep } from '../../models/doctor.models';
|
||||
margin-top: 1rem;
|
||||
padding: 1rem;
|
||||
background: white;
|
||||
border: 1px solid var(--border, #e2e8f0);
|
||||
border: 1px solid var(--border, rgba(212, 201, 168, 0.3));
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
@@ -96,15 +96,15 @@ import { Remediation, RemediationStep } from '../../models/doctor.models';
|
||||
.run-fix-btn {
|
||||
padding: 0.25rem 0.625rem;
|
||||
font-size: 0.75rem;
|
||||
background: var(--bg-secondary, #f1f5f9);
|
||||
border: 1px solid var(--border, #e2e8f0);
|
||||
background: var(--bg-secondary, #FFF9ED);
|
||||
border: 1px solid var(--border, rgba(212, 201, 168, 0.3));
|
||||
border-radius: 4px;
|
||||
cursor: pointer;
|
||||
color: var(--text-secondary, #64748b);
|
||||
color: var(--text-secondary, #6B5A2E);
|
||||
transition: all 0.15s ease;
|
||||
|
||||
&:hover {
|
||||
background: var(--bg-hover, #e2e8f0);
|
||||
background: var(--bg-hover, rgba(212, 201, 168, 0.3));
|
||||
color: var(--text-primary, #1a1a2e);
|
||||
}
|
||||
}
|
||||
@@ -125,9 +125,9 @@ import { Remediation, RemediationStep } from '../../models/doctor.models';
|
||||
}
|
||||
|
||||
&:disabled {
|
||||
background: var(--bg-secondary, #f1f5f9);
|
||||
border-color: var(--border, #e2e8f0);
|
||||
color: var(--text-secondary, #64748b);
|
||||
background: var(--bg-secondary, #FFF9ED);
|
||||
border-color: var(--border, rgba(212, 201, 168, 0.3));
|
||||
color: var(--text-secondary, #6B5A2E);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -197,14 +197,14 @@ import { Remediation, RemediationStep } from '../../models/doctor.models';
|
||||
.verification-command {
|
||||
margin: 0;
|
||||
padding: 0.75rem;
|
||||
background: var(--bg-code, #1e293b);
|
||||
background: var(--bg-code, #3D2E0A);
|
||||
border-radius: 6px;
|
||||
overflow-x: auto;
|
||||
|
||||
code {
|
||||
font-family: 'JetBrains Mono', 'Fira Code', monospace;
|
||||
font-size: 0.8125rem;
|
||||
color: var(--text-code, #e2e8f0);
|
||||
color: var(--text-code, rgba(212, 201, 168, 0.3));
|
||||
white-space: pre-wrap;
|
||||
word-break: break-all;
|
||||
}
|
||||
@@ -214,7 +214,7 @@ import { Remediation, RemediationStep } from '../../models/doctor.models';
|
||||
display: inline-block;
|
||||
margin-top: 0.25rem;
|
||||
font-size: 0.6875rem;
|
||||
color: var(--text-tertiary, #94a3b8);
|
||||
color: var(--text-tertiary, #D4C9A8);
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.025em;
|
||||
}
|
||||
@@ -222,7 +222,7 @@ import { Remediation, RemediationStep } from '../../models/doctor.models';
|
||||
.verification-section {
|
||||
margin-top: 1.5rem;
|
||||
padding-top: 1rem;
|
||||
border-top: 1px solid var(--border, #e2e8f0);
|
||||
border-top: 1px solid var(--border, rgba(212, 201, 168, 0.3));
|
||||
|
||||
.verification-header {
|
||||
display: flex;
|
||||
|
||||
@@ -48,7 +48,7 @@ import { DoctorSeverity, DoctorSummary } from '../../models/doctor.models';
|
||||
align-items: center;
|
||||
gap: 1.5rem;
|
||||
padding: 1rem 1.5rem;
|
||||
background: var(--bg-secondary, #f8fafc);
|
||||
background: var(--bg-secondary, #FFFCF5);
|
||||
border-radius: 8px;
|
||||
margin-bottom: 1.5rem;
|
||||
border-left: 4px solid var(--success, #22c55e);
|
||||
@@ -78,7 +78,7 @@ import { DoctorSeverity, DoctorSummary } from '../../models/doctor.models';
|
||||
|
||||
.label {
|
||||
font-size: 0.75rem;
|
||||
color: var(--text-secondary, #64748b);
|
||||
color: var(--text-secondary, #6B5A2E);
|
||||
margin-top: 0.25rem;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.025em;
|
||||
@@ -88,10 +88,10 @@ import { DoctorSeverity, DoctorSummary } from '../../models/doctor.models';
|
||||
&.info .count { color: var(--info, #3b82f6); }
|
||||
&.warnings .count { color: var(--warning, #f59e0b); }
|
||||
&.failed .count { color: var(--error, #ef4444); }
|
||||
&.skipped .count { color: var(--text-tertiary, #94a3b8); }
|
||||
&.skipped .count { color: var(--text-tertiary, #D4C9A8); }
|
||||
&.total .count { color: var(--text-primary, #1a1a2e); }
|
||||
&.duration .count {
|
||||
color: var(--text-secondary, #64748b);
|
||||
color: var(--text-secondary, #6B5A2E);
|
||||
font-family: monospace;
|
||||
font-size: 1.25rem;
|
||||
}
|
||||
@@ -100,7 +100,7 @@ import { DoctorSeverity, DoctorSummary } from '../../models/doctor.models';
|
||||
.summary-divider {
|
||||
width: 1px;
|
||||
height: 40px;
|
||||
background: var(--border, #e2e8f0);
|
||||
background: var(--border, rgba(212, 201, 168, 0.3));
|
||||
}
|
||||
|
||||
@media (max-width: 640px) {
|
||||
|
||||
@@ -373,16 +373,16 @@ interface GateSummary {
|
||||
.header-main { flex: 1; }
|
||||
.header-title-row { display: flex; align-items: center; gap: 0.75rem; margin-bottom: 0.5rem; }
|
||||
.page-title { margin: 0; font-size: 1.5rem; font-weight: 600; }
|
||||
.stage-badge { padding: 0.25rem 0.75rem; background: var(--surface-ground, #f1f5f9); border-radius: 4px; font-size: 0.75rem; font-weight: 500; }
|
||||
.stage-badge { padding: 0.25rem 0.75rem; background: var(--surface-ground, #FFF9ED); border-radius: 4px; font-size: 0.75rem; font-weight: 500; }
|
||||
.freeze-badge { padding: 0.25rem 0.5rem; background: var(--blue-100, #dbeafe); color: var(--blue-700, #1d4ed8); border-radius: 4px; font-size: 0.625rem; font-weight: 700; text-transform: uppercase; }
|
||||
.header-meta { display: flex; gap: 1.5rem; color: var(--text-color-secondary, #64748b); font-size: 0.875rem; }
|
||||
.meta-item strong { color: var(--text-color, #1e293b); }
|
||||
.header-meta { display: flex; gap: 1.5rem; color: var(--text-color-secondary, #6B5A2E); font-size: 0.875rem; }
|
||||
.meta-item strong { color: var(--text-color, #3D2E0A); }
|
||||
.header-actions { display: flex; gap: 0.5rem; }
|
||||
|
||||
/* Tabs */
|
||||
.tabs { display: flex; gap: 0.25rem; border-bottom: 1px solid var(--surface-border, #e2e8f0); margin-bottom: 1.5rem; }
|
||||
.tab { padding: 0.75rem 1rem; background: transparent; border: none; border-bottom: 2px solid transparent; margin-bottom: -1px; font-size: 0.875rem; font-weight: 500; color: var(--text-color-secondary, #64748b); cursor: pointer; }
|
||||
.tab:hover { color: var(--text-color, #1e293b); }
|
||||
.tabs { display: flex; gap: 0.25rem; border-bottom: 1px solid var(--surface-border, rgba(212, 201, 168, 0.3)); margin-bottom: 1.5rem; }
|
||||
.tab { padding: 0.75rem 1rem; background: transparent; border: none; border-bottom: 2px solid transparent; margin-bottom: -1px; font-size: 0.875rem; font-weight: 500; color: var(--text-color-secondary, #6B5A2E); cursor: pointer; }
|
||||
.tab:hover { color: var(--text-color, #3D2E0A); }
|
||||
.tab--active { color: var(--primary-color, #3b82f6); border-bottom-color: var(--primary-color, #3b82f6); }
|
||||
|
||||
/* Overview Layout */
|
||||
@@ -391,7 +391,7 @@ interface GateSummary {
|
||||
.overview-sidebar { display: flex; flex-direction: column; gap: 1.5rem; }
|
||||
|
||||
/* Panel */
|
||||
.panel { padding: 1.25rem; background: var(--surface-card, #ffffff); border: 1px solid var(--surface-border, #e2e8f0); border-radius: 8px; }
|
||||
.panel { padding: 1.25rem; background: var(--surface-card, #ffffff); border: 1px solid var(--surface-border, rgba(212, 201, 168, 0.3)); border-radius: 8px; }
|
||||
.panel--compact { padding: 1rem; }
|
||||
.panel h3 { margin: 0; font-size: 0.875rem; font-weight: 600; }
|
||||
.panel-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; }
|
||||
@@ -401,28 +401,28 @@ interface GateSummary {
|
||||
/* Release Timeline */
|
||||
.release-timeline { display: flex; flex-direction: column; gap: 0; margin-bottom: 1rem; }
|
||||
.timeline-entry { display: flex; align-items: flex-start; gap: 0.75rem; position: relative; padding-bottom: 0.75rem; }
|
||||
.timeline-node { width: 12px; height: 12px; border-radius: 50%; background: var(--surface-border, #e2e8f0); border: 2px solid var(--surface-card, #ffffff); box-shadow: 0 0 0 2px var(--surface-border, #e2e8f0); flex-shrink: 0; margin-top: 0.25rem; }
|
||||
.timeline-node { width: 12px; height: 12px; border-radius: 50%; background: var(--surface-border, rgba(212, 201, 168, 0.3)); border: 2px solid var(--surface-card, #ffffff); box-shadow: 0 0 0 2px var(--surface-border, rgba(212, 201, 168, 0.3)); flex-shrink: 0; margin-top: 0.25rem; }
|
||||
.timeline-entry--current .timeline-node { background: var(--primary-color, #3b82f6); box-shadow: 0 0 0 2px var(--primary-color, #3b82f6); }
|
||||
.timeline-line { position: absolute; left: 5px; top: 14px; bottom: -2px; width: 2px; background: var(--surface-border, #e2e8f0); }
|
||||
.timeline-line { position: absolute; left: 5px; top: 14px; bottom: -2px; width: 2px; background: var(--surface-border, rgba(212, 201, 168, 0.3)); }
|
||||
.timeline-content { display: flex; align-items: center; gap: 0.5rem; flex-wrap: wrap; }
|
||||
.timeline-version { font-weight: 600; font-size: 0.875rem; color: var(--primary-color, #3b82f6); text-decoration: none; }
|
||||
.timeline-version:hover { text-decoration: underline; }
|
||||
.current-badge { font-size: 0.625rem; padding: 0.125rem 0.375rem; background: var(--green-100, #dcfce7); color: var(--green-700, #15803d); border-radius: 4px; font-weight: 600; }
|
||||
.timeline-date { font-size: 0.75rem; color: var(--text-color-secondary, #94a3b8); }
|
||||
.last-promotion { font-size: 0.75rem; color: var(--text-color-secondary, #64748b); padding-top: 0.5rem; border-top: 1px solid var(--surface-border, #e2e8f0); display: flex; justify-content: space-between; }
|
||||
.timeline-date { font-size: 0.75rem; color: var(--text-color-secondary, #D4C9A8); }
|
||||
.last-promotion { font-size: 0.75rem; color: var(--text-color-secondary, #6B5A2E); padding-top: 0.5rem; border-top: 1px solid var(--surface-border, rgba(212, 201, 168, 0.3)); display: flex; justify-content: space-between; }
|
||||
.promotion-link { color: var(--primary-color, #3b82f6); text-decoration: none; }
|
||||
|
||||
/* Risk Snapshot */
|
||||
.risk-content { display: flex; flex-direction: column; gap: 0.75rem; }
|
||||
.risk-row { display: flex; justify-content: space-between; align-items: center; }
|
||||
.risk-label { font-size: 0.75rem; color: var(--text-color-secondary, #64748b); }
|
||||
.risk-label { font-size: 0.75rem; color: var(--text-color-secondary, #6B5A2E); }
|
||||
.gate-badges { display: flex; gap: 0.5rem; flex-wrap: wrap; }
|
||||
.gate-badge { font-size: 0.625rem; padding: 0.125rem 0.5rem; border-radius: 4px; font-weight: 600; }
|
||||
.gate-badge--pass { background: var(--green-100, #dcfce7); color: var(--green-700, #15803d); }
|
||||
.gate-badge--warn { background: var(--yellow-100, #fef9c3); color: var(--yellow-700, #a16207); }
|
||||
.gate-badge--block { background: var(--red-100, #fee2e2); color: var(--red-700, #b91c1c); }
|
||||
.coverage-display { display: flex; align-items: center; gap: 0.5rem; }
|
||||
.coverage-bar { width: 100px; height: 6px; background: var(--surface-ground, #e2e8f0); border-radius: 3px; overflow: hidden; }
|
||||
.coverage-bar { width: 100px; height: 6px; background: var(--surface-ground, rgba(212, 201, 168, 0.3)); border-radius: 3px; overflow: hidden; }
|
||||
.coverage-bar__fill { height: 100%; background: var(--green-500, #22c55e); }
|
||||
.coverage-percent { font-size: 0.875rem; font-weight: 600; }
|
||||
.findings-counts { display: flex; gap: 0.75rem; }
|
||||
@@ -442,14 +442,14 @@ interface GateSummary {
|
||||
.targets-preview { display: flex; flex-direction: column; gap: 0.5rem; }
|
||||
.target-preview-item { display: flex; align-items: center; gap: 0.5rem; font-size: 0.8125rem; }
|
||||
.target-name { flex: 1; font-weight: 500; }
|
||||
.target-version { font-size: 0.75rem; color: var(--text-color-secondary, #94a3b8); }
|
||||
.targets-more { font-size: 0.75rem; color: var(--text-color-secondary, #94a3b8); text-align: center; padding-top: 0.5rem; }
|
||||
.target-version { font-size: 0.75rem; color: var(--text-color-secondary, #D4C9A8); }
|
||||
.targets-more { font-size: 0.75rem; color: var(--text-color-secondary, #D4C9A8); text-align: center; padding-top: 0.5rem; }
|
||||
|
||||
/* Quick Stats */
|
||||
.quick-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.5rem; margin-top: 0.75rem; }
|
||||
.stat-item { text-align: center; }
|
||||
.stat-value { display: block; font-size: 1rem; font-weight: 700; color: var(--text-color, #1e293b); }
|
||||
.stat-label { font-size: 0.625rem; color: var(--text-color-secondary, #94a3b8); text-transform: uppercase; }
|
||||
.stat-value { display: block; font-size: 1rem; font-weight: 700; color: var(--text-color, #3D2E0A); }
|
||||
.stat-label { font-size: 0.625rem; color: var(--text-color-secondary, #D4C9A8); text-transform: uppercase; }
|
||||
|
||||
/* Drift Badge */
|
||||
.drift-badge { padding: 0.125rem 0.5rem; border-radius: 4px; font-size: 0.75rem; font-weight: 500; text-transform: capitalize; }
|
||||
@@ -458,8 +458,8 @@ interface GateSummary {
|
||||
|
||||
/* Data Table */
|
||||
.data-table { width: 100%; border-collapse: collapse; }
|
||||
.data-table th, .data-table td { padding: 0.75rem; text-align: left; border-bottom: 1px solid var(--surface-border, #e2e8f0); }
|
||||
.data-table th { font-size: 0.75rem; font-weight: 600; color: var(--text-color-secondary, #64748b); text-transform: uppercase; }
|
||||
.data-table th, .data-table td { padding: 0.75rem; text-align: left; border-bottom: 1px solid var(--surface-border, rgba(212, 201, 168, 0.3)); }
|
||||
.data-table th { font-size: 0.75rem; font-weight: 600; color: var(--text-color-secondary, #6B5A2E); text-transform: uppercase; }
|
||||
|
||||
/* Status Dot */
|
||||
.status-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; margin-right: 0.5rem; }
|
||||
@@ -474,16 +474,16 @@ interface GateSummary {
|
||||
|
||||
/* Buttons */
|
||||
.btn { padding: 0.5rem 1rem; border-radius: 6px; font-size: 0.875rem; font-weight: 500; cursor: pointer; text-decoration: none; }
|
||||
.btn--primary { background: var(--primary-color, #3b82f6); border: none; color: white; }
|
||||
.btn--primary { background: var(--primary-color, #3b82f6); border: none; color: #1C1200; }
|
||||
.btn--primary:hover { background: var(--primary-color-dark, #2563eb); }
|
||||
.btn--secondary { background: var(--surface-ground, #f8fafc); border: 1px solid var(--surface-border, #e2e8f0); color: var(--text-color, #1e293b); }
|
||||
.btn--secondary:hover { background: var(--surface-hover, #f1f5f9); }
|
||||
.btn--secondary { background: var(--surface-ground, #FFFCF5); border: 1px solid var(--surface-border, rgba(212, 201, 168, 0.3)); color: var(--text-color, #3D2E0A); }
|
||||
.btn--secondary:hover { background: var(--surface-hover, #FFF9ED); }
|
||||
.btn--sm { padding: 0.25rem 0.5rem; font-size: 0.75rem; }
|
||||
|
||||
/* Sprint: SPRINT_20260118_008 - Additional styles for new tabs */
|
||||
|
||||
/* Panel subtitle */
|
||||
.panel-subtitle { margin: -0.5rem 0 1rem; font-size: 0.875rem; color: var(--text-color-secondary, #64748b); }
|
||||
.panel-subtitle { margin: -0.5rem 0 1rem; font-size: 0.875rem; color: var(--text-color-secondary, #6B5A2E); }
|
||||
|
||||
/* Status badge */
|
||||
.status-badge { display: inline-block; padding: 0.125rem 0.5rem; border-radius: 4px; font-size: 0.75rem; font-weight: 500; text-transform: capitalize; }
|
||||
@@ -503,17 +503,17 @@ interface GateSummary {
|
||||
|
||||
/* Evidence grid */
|
||||
.evidence-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 1rem; }
|
||||
.evidence-card { background: var(--surface-ground, #f8fafc); border: 1px solid var(--surface-border, #e2e8f0); border-radius: 8px; overflow: hidden; }
|
||||
.evidence-card-header { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1rem; background: var(--surface-card, #ffffff); border-bottom: 1px solid var(--surface-border, #e2e8f0); }
|
||||
.evidence-type-badge { font-size: 0.625rem; font-weight: 600; text-transform: uppercase; color: var(--text-color-secondary, #64748b); }
|
||||
.evidence-card { background: var(--surface-ground, #FFFCF5); border: 1px solid var(--surface-border, rgba(212, 201, 168, 0.3)); border-radius: 8px; overflow: hidden; }
|
||||
.evidence-card-header { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1rem; background: var(--surface-card, #ffffff); border-bottom: 1px solid var(--surface-border, rgba(212, 201, 168, 0.3)); }
|
||||
.evidence-type-badge { font-size: 0.625rem; font-weight: 600; text-transform: uppercase; color: var(--text-color-secondary, #6B5A2E); }
|
||||
.evidence-badges { display: flex; gap: 0.25rem; }
|
||||
.badge { padding: 0.125rem 0.375rem; border-radius: 3px; font-size: 0.625rem; font-weight: 600; }
|
||||
.badge--signed { background: var(--blue-100, #dbeafe); color: var(--blue-700, #1d4ed8); }
|
||||
.badge--verified { background: var(--green-100, #dcfce7); color: var(--green-700, #15803d); }
|
||||
.evidence-card-body { padding: 1rem; }
|
||||
.evidence-card-body h4 { margin: 0 0 0.25rem; font-size: 0.875rem; font-weight: 600; }
|
||||
.evidence-meta { margin: 0; font-size: 0.75rem; color: var(--text-color-secondary, #94a3b8); }
|
||||
.evidence-card-footer { display: flex; gap: 0.5rem; padding: 0.75rem 1rem; background: var(--surface-card, #ffffff); border-top: 1px solid var(--surface-border, #e2e8f0); }
|
||||
.evidence-meta { margin: 0; font-size: 0.75rem; color: var(--text-color-secondary, #D4C9A8); }
|
||||
.evidence-card-footer { display: flex; gap: 0.5rem; padding: 0.75rem 1rem; background: var(--surface-card, #ffffff); border-top: 1px solid var(--surface-border, rgba(212, 201, 168, 0.3)); }
|
||||
|
||||
@media (max-width: 1024px) {
|
||||
.overview-layout { grid-template-columns: 1fr; }
|
||||
|
||||
@@ -71,7 +71,7 @@ interface Environment {
|
||||
.environments-page { max-width: 1400px; margin: 0 auto; }
|
||||
.page-header { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 1.5rem; }
|
||||
.page-title { margin: 0 0 0.25rem; font-size: 1.5rem; font-weight: 600; }
|
||||
.page-subtitle { margin: 0; color: var(--text-color-secondary, #64748b); }
|
||||
.page-subtitle { margin: 0; color: var(--text-color-secondary, #6B5A2E); }
|
||||
|
||||
.env-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 1rem; }
|
||||
|
||||
@@ -79,7 +79,7 @@ interface Environment {
|
||||
display: block;
|
||||
padding: 1.25rem;
|
||||
background: var(--surface-card, #ffffff);
|
||||
border: 1px solid var(--surface-border, #e2e8f0);
|
||||
border: 1px solid var(--surface-border, rgba(212, 201, 168, 0.3));
|
||||
border-radius: 8px;
|
||||
text-decoration: none;
|
||||
color: inherit;
|
||||
@@ -89,11 +89,11 @@ interface Environment {
|
||||
|
||||
.env-card__header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; }
|
||||
.env-card__header h3 { margin: 0; font-size: 1rem; font-weight: 600; }
|
||||
.stage-badge { padding: 0.125rem 0.5rem; background: var(--surface-ground, #f1f5f9); border-radius: 4px; font-size: 0.75rem; font-weight: 500; }
|
||||
.stage-badge { padding: 0.125rem 0.5rem; background: var(--surface-ground, #FFF9ED); border-radius: 4px; font-size: 0.75rem; font-weight: 500; }
|
||||
|
||||
.env-card__body { display: flex; flex-direction: column; gap: 0.75rem; margin-bottom: 1rem; }
|
||||
.env-metric { display: flex; justify-content: space-between; }
|
||||
.metric-label { font-size: 0.75rem; color: var(--text-color-secondary, #64748b); }
|
||||
.metric-label { font-size: 0.75rem; color: var(--text-color-secondary, #6B5A2E); }
|
||||
.metric-value { font-size: 0.875rem; font-weight: 500; }
|
||||
|
||||
.drift-badge { padding: 0.25rem 0.5rem; border-radius: 4px; font-size: 0.75rem; font-weight: 500; }
|
||||
@@ -102,7 +102,7 @@ interface Environment {
|
||||
.drift-badge--unknown { background: var(--gray-100, #f3f4f6); color: var(--gray-600, #4b5563); }
|
||||
|
||||
.btn { padding: 0.5rem 1rem; border-radius: 6px; font-size: 0.875rem; font-weight: 500; cursor: pointer; }
|
||||
.btn--primary { background: var(--primary-color, #3b82f6); border: none; color: white; }
|
||||
.btn--primary { background: var(--primary-color, #3b82f6); border: none; color: #1C1200; }
|
||||
`]
|
||||
})
|
||||
export class EnvironmentsListPageComponent {
|
||||
|
||||
@@ -158,7 +158,7 @@ interface EvidencePacket {
|
||||
margin-bottom: 1.5rem;
|
||||
}
|
||||
.page-title { margin: 0 0 0.25rem; font-size: 1.5rem; font-weight: 600; }
|
||||
.page-subtitle { margin: 0; color: var(--text-color-secondary, #64748b); }
|
||||
.page-subtitle { margin: 0; color: var(--text-color-secondary, #6B5A2E); }
|
||||
.page-actions { display: flex; gap: 0.75rem; }
|
||||
|
||||
.filter-bar {
|
||||
@@ -166,7 +166,7 @@ interface EvidencePacket {
|
||||
gap: 0.75rem;
|
||||
padding: 1rem;
|
||||
background: var(--surface-card, #ffffff);
|
||||
border: 1px solid var(--surface-border, #e2e8f0);
|
||||
border: 1px solid var(--surface-border, rgba(212, 201, 168, 0.3));
|
||||
border-radius: 8px;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
@@ -179,26 +179,26 @@ interface EvidencePacket {
|
||||
left: 0.75rem;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
color: var(--text-color-secondary, #94a3b8);
|
||||
color: var(--text-color-secondary, #D4C9A8);
|
||||
}
|
||||
.filter-bar__input {
|
||||
width: 100%;
|
||||
padding: 0.5rem 0.75rem 0.5rem 2.25rem;
|
||||
border: 1px solid var(--surface-border, #e2e8f0);
|
||||
border: 1px solid var(--surface-border, rgba(212, 201, 168, 0.3));
|
||||
border-radius: 6px;
|
||||
font-size: 0.875rem;
|
||||
}
|
||||
.filter-bar__select {
|
||||
padding: 0.5rem 2rem 0.5rem 0.75rem;
|
||||
border: 1px solid var(--surface-border, #e2e8f0);
|
||||
border: 1px solid var(--surface-border, rgba(212, 201, 168, 0.3));
|
||||
border-radius: 6px;
|
||||
font-size: 0.875rem;
|
||||
background: var(--surface-ground, #f8fafc);
|
||||
background: var(--surface-ground, #FFFCF5);
|
||||
}
|
||||
|
||||
.table-container {
|
||||
background: var(--surface-card, #ffffff);
|
||||
border: 1px solid var(--surface-border, #e2e8f0);
|
||||
border: 1px solid var(--surface-border, rgba(212, 201, 168, 0.3));
|
||||
border-radius: 8px;
|
||||
overflow: hidden;
|
||||
}
|
||||
@@ -206,16 +206,16 @@ interface EvidencePacket {
|
||||
.data-table th, .data-table td {
|
||||
padding: 0.75rem 1rem;
|
||||
text-align: left;
|
||||
border-bottom: 1px solid var(--surface-border, #e2e8f0);
|
||||
border-bottom: 1px solid var(--surface-border, rgba(212, 201, 168, 0.3));
|
||||
}
|
||||
.data-table th {
|
||||
background: var(--surface-ground, #f8fafc);
|
||||
background: var(--surface-ground, #FFFCF5);
|
||||
font-size: 0.75rem;
|
||||
font-weight: 600;
|
||||
color: var(--text-color-secondary, #64748b);
|
||||
color: var(--text-color-secondary, #6B5A2E);
|
||||
text-transform: uppercase;
|
||||
}
|
||||
.data-table tbody tr:hover { background: var(--surface-hover, #f8fafc); }
|
||||
.data-table tbody tr:hover { background: var(--surface-hover, #FFFCF5); }
|
||||
|
||||
.evidence-link {
|
||||
color: var(--primary-color, #3b82f6);
|
||||
@@ -248,7 +248,7 @@ interface EvidencePacket {
|
||||
text-decoration: none;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
.text-muted { color: var(--text-color-secondary, #94a3b8); }
|
||||
.text-muted { color: var(--text-color-secondary, #D4C9A8); }
|
||||
|
||||
.action-buttons { display: flex; gap: 0.25rem; }
|
||||
.btn {
|
||||
@@ -257,17 +257,17 @@ interface EvidencePacket {
|
||||
font-size: 0.875rem;
|
||||
font-weight: 500;
|
||||
cursor: pointer;
|
||||
background: var(--surface-ground, #f8fafc);
|
||||
border: 1px solid var(--surface-border, #e2e8f0);
|
||||
color: var(--text-color, #1e293b);
|
||||
background: var(--surface-ground, #FFFCF5);
|
||||
border: 1px solid var(--surface-border, rgba(212, 201, 168, 0.3));
|
||||
color: var(--text-color, #3D2E0A);
|
||||
}
|
||||
.btn--sm { padding: 0.25rem 0.5rem; font-size: 0.75rem; }
|
||||
.btn--secondary { background: var(--surface-ground, #f8fafc); border: 1px solid var(--surface-border, #e2e8f0); color: var(--text-color, #1e293b); }
|
||||
.btn--secondary { background: var(--surface-ground, #FFFCF5); border: 1px solid var(--surface-border, rgba(212, 201, 168, 0.3)); color: var(--text-color, #3D2E0A); }
|
||||
|
||||
.empty-state {
|
||||
text-align: center;
|
||||
padding: 3rem !important;
|
||||
color: var(--text-color-secondary, #64748b);
|
||||
color: var(--text-color-secondary, #6B5A2E);
|
||||
}
|
||||
`]
|
||||
})
|
||||
|
||||
@@ -224,7 +224,7 @@ import { ActivatedRoute, RouterLink } from '@angular/router';
|
||||
font-size: 0.75rem;
|
||||
font-weight: 600;
|
||||
}
|
||||
.page-subtitle { margin: 0; color: var(--text-color-secondary, #64748b); }
|
||||
.page-subtitle { margin: 0; color: var(--text-color-secondary, #6B5A2E); }
|
||||
|
||||
.summary-cards {
|
||||
display: grid;
|
||||
@@ -235,10 +235,10 @@ import { ActivatedRoute, RouterLink } from '@angular/router';
|
||||
.summary-card {
|
||||
padding: 1rem;
|
||||
background: var(--surface-card, #ffffff);
|
||||
border: 1px solid var(--surface-border, #e2e8f0);
|
||||
border: 1px solid var(--surface-border, rgba(212, 201, 168, 0.3));
|
||||
border-radius: 8px;
|
||||
}
|
||||
.summary-label { display: block; font-size: 0.75rem; color: var(--text-color-secondary, #64748b); margin-bottom: 0.25rem; }
|
||||
.summary-label { display: block; font-size: 0.75rem; color: var(--text-color-secondary, #6B5A2E); margin-bottom: 0.25rem; }
|
||||
.summary-value { font-size: 0.875rem; font-weight: 500; }
|
||||
.summary-value code {
|
||||
font-size: 0.75rem;
|
||||
@@ -251,7 +251,7 @@ import { ActivatedRoute, RouterLink } from '@angular/router';
|
||||
.tabs {
|
||||
display: flex;
|
||||
gap: 0.25rem;
|
||||
border-bottom: 1px solid var(--surface-border, #e2e8f0);
|
||||
border-bottom: 1px solid var(--surface-border, rgba(212, 201, 168, 0.3));
|
||||
margin-bottom: 1.5rem;
|
||||
}
|
||||
.tab {
|
||||
@@ -262,10 +262,10 @@ import { ActivatedRoute, RouterLink } from '@angular/router';
|
||||
margin-bottom: -1px;
|
||||
font-size: 0.875rem;
|
||||
font-weight: 500;
|
||||
color: var(--text-color-secondary, #64748b);
|
||||
color: var(--text-color-secondary, #6B5A2E);
|
||||
cursor: pointer;
|
||||
}
|
||||
.tab:hover { color: var(--text-color, #1e293b); }
|
||||
.tab:hover { color: var(--text-color, #3D2E0A); }
|
||||
.tab--active {
|
||||
color: var(--primary-color, #3b82f6);
|
||||
border-bottom-color: var(--primary-color, #3b82f6);
|
||||
@@ -274,14 +274,14 @@ import { ActivatedRoute, RouterLink } from '@angular/router';
|
||||
.panel {
|
||||
padding: 1.5rem;
|
||||
background: var(--surface-card, #ffffff);
|
||||
border: 1px solid var(--surface-border, #e2e8f0);
|
||||
border: 1px solid var(--surface-border, rgba(212, 201, 168, 0.3));
|
||||
border-radius: 8px;
|
||||
}
|
||||
.panel h3 { margin: 0 0 1rem; font-size: 1rem; font-weight: 600; }
|
||||
.section-subtitle { margin: 0 0 1rem; font-size: 0.875rem; color: var(--text-color-secondary, #64748b); }
|
||||
.section-subtitle { margin: 0 0 1rem; font-size: 0.875rem; color: var(--text-color-secondary, #6B5A2E); }
|
||||
|
||||
.details-list { display: grid; grid-template-columns: auto 1fr; gap: 0.5rem 1rem; margin: 0; }
|
||||
.details-list dt { font-weight: 500; color: var(--text-color-secondary, #64748b); font-size: 0.875rem; }
|
||||
.details-list dt { font-weight: 500; color: var(--text-color-secondary, #6B5A2E); font-size: 0.875rem; }
|
||||
.details-list dd { margin: 0; font-size: 0.875rem; }
|
||||
.details-list code { font-size: 0.75rem; word-break: break-all; }
|
||||
|
||||
@@ -289,12 +289,12 @@ import { ActivatedRoute, RouterLink } from '@angular/router';
|
||||
.data-table th, .data-table td {
|
||||
padding: 0.75rem;
|
||||
text-align: left;
|
||||
border-bottom: 1px solid var(--surface-border, #e2e8f0);
|
||||
border-bottom: 1px solid var(--surface-border, rgba(212, 201, 168, 0.3));
|
||||
}
|
||||
.data-table th {
|
||||
font-size: 0.75rem;
|
||||
font-weight: 600;
|
||||
color: var(--text-color-secondary, #64748b);
|
||||
color: var(--text-color-secondary, #6B5A2E);
|
||||
text-transform: uppercase;
|
||||
}
|
||||
.data-table code { font-size: 0.75rem; }
|
||||
@@ -311,22 +311,22 @@ import { ActivatedRoute, RouterLink } from '@angular/router';
|
||||
.verification-result--pending { background: var(--gray-50, #f9fafb); border: 1px solid var(--gray-200, #e5e7eb); }
|
||||
.verification-icon { font-size: 1.5rem; }
|
||||
.verification-result strong { display: block; margin-bottom: 0.25rem; }
|
||||
.verification-result p { margin: 0; font-size: 0.875rem; color: var(--text-color-secondary, #64748b); }
|
||||
.verification-result p { margin: 0; font-size: 0.875rem; color: var(--text-color-secondary, #6B5A2E); }
|
||||
|
||||
.proof-chain { margin-bottom: 1.5rem; }
|
||||
.chain-node {
|
||||
padding: 1rem;
|
||||
background: var(--surface-ground, #f8fafc);
|
||||
border: 1px solid var(--surface-border, #e2e8f0);
|
||||
background: var(--surface-ground, #FFFCF5);
|
||||
border: 1px solid var(--surface-border, rgba(212, 201, 168, 0.3));
|
||||
border-radius: 8px;
|
||||
}
|
||||
.chain-node__header { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 0.5rem; }
|
||||
.chain-node__icon { font-size: 1.25rem; }
|
||||
.chain-node__type { font-weight: 600; font-size: 0.875rem; }
|
||||
.chain-node__hash { display: block; font-size: 0.625rem; color: var(--text-color-secondary, #64748b); margin-bottom: 0.25rem; }
|
||||
.chain-node__time { font-size: 0.75rem; color: var(--text-color-secondary, #94a3b8); }
|
||||
.chain-node__hash { display: block; font-size: 0.625rem; color: var(--text-color-secondary, #6B5A2E); margin-bottom: 0.25rem; }
|
||||
.chain-node__time { font-size: 0.75rem; color: var(--text-color-secondary, #D4C9A8); }
|
||||
.chain-connector { display: flex; justify-content: center; padding: 0.5rem 0; }
|
||||
.chain-arrow { color: var(--text-color-secondary, #94a3b8); font-size: 1.25rem; }
|
||||
.chain-arrow { color: var(--text-color-secondary, #D4C9A8); font-size: 1.25rem; }
|
||||
.proof-actions { display: flex; gap: 0.75rem; }
|
||||
|
||||
.btn {
|
||||
@@ -337,8 +337,8 @@ import { ActivatedRoute, RouterLink } from '@angular/router';
|
||||
cursor: pointer;
|
||||
}
|
||||
.btn--sm { padding: 0.25rem 0.5rem; font-size: 0.75rem; }
|
||||
.btn--primary { background: var(--primary-color, #3b82f6); border: none; color: white; }
|
||||
.btn--secondary { background: var(--surface-ground, #f8fafc); border: 1px solid var(--surface-border, #e2e8f0); color: var(--text-color, #1e293b); }
|
||||
.btn--primary { background: var(--primary-color, #3b82f6); border: none; color: #1C1200; }
|
||||
.btn--secondary { background: var(--surface-ground, #FFFCF5); border: 1px solid var(--surface-border, rgba(212, 201, 168, 0.3)); color: var(--text-color, #3D2E0A); }
|
||||
`]
|
||||
})
|
||||
export class EvidencePacketPageComponent implements OnInit {
|
||||
|
||||
@@ -356,7 +356,7 @@ export interface AuditBundleConfig {
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 1.25rem 1.5rem;
|
||||
border-bottom: 1px solid #e2e8f0;
|
||||
border-bottom: 1px solid rgba(212, 201, 168, 0.3);
|
||||
}
|
||||
|
||||
.modal__title {
|
||||
@@ -371,13 +371,13 @@ export interface AuditBundleConfig {
|
||||
background: none;
|
||||
border: none;
|
||||
border-radius: 6px;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.modal__close:hover {
|
||||
background: #f8fafc;
|
||||
color: #1e293b;
|
||||
background: #FFFCF5;
|
||||
color: #3D2E0A;
|
||||
}
|
||||
|
||||
.modal__body {
|
||||
@@ -390,8 +390,8 @@ export interface AuditBundleConfig {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
padding: 1rem 1.5rem;
|
||||
border-top: 1px solid #e2e8f0;
|
||||
background: #f8fafc;
|
||||
border-top: 1px solid rgba(212, 201, 168, 0.3);
|
||||
background: #FFFCF5;
|
||||
border-radius: 0 0 12px 12px;
|
||||
}
|
||||
|
||||
@@ -408,7 +408,7 @@ export interface AuditBundleConfig {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
}
|
||||
|
||||
.step--active {
|
||||
@@ -445,7 +445,7 @@ export interface AuditBundleConfig {
|
||||
.step__connector {
|
||||
width: 40px;
|
||||
height: 2px;
|
||||
background: #e2e8f0;
|
||||
background: rgba(212, 201, 168, 0.3);
|
||||
}
|
||||
|
||||
/* Form elements */
|
||||
@@ -464,7 +464,7 @@ export interface AuditBundleConfig {
|
||||
.form-label {
|
||||
font-size: 0.875rem;
|
||||
font-weight: 500;
|
||||
color: #1e293b;
|
||||
color: #3D2E0A;
|
||||
}
|
||||
|
||||
.required {
|
||||
@@ -474,7 +474,7 @@ export interface AuditBundleConfig {
|
||||
.form-input,
|
||||
.form-textarea {
|
||||
padding: 0.625rem 0.875rem;
|
||||
border: 1px solid #e2e8f0;
|
||||
border: 1px solid rgba(212, 201, 168, 0.3);
|
||||
border-radius: 6px;
|
||||
font-size: 0.875rem;
|
||||
}
|
||||
@@ -496,7 +496,7 @@ export interface AuditBundleConfig {
|
||||
.selection-count {
|
||||
font-size: 0.875rem;
|
||||
font-weight: 500;
|
||||
color: #1e293b;
|
||||
color: #3D2E0A;
|
||||
}
|
||||
|
||||
.selection-actions {
|
||||
@@ -522,7 +522,7 @@ export interface AuditBundleConfig {
|
||||
display: flex;
|
||||
gap: 0.25rem;
|
||||
padding: 0.25rem;
|
||||
background: #f8fafc;
|
||||
background: #FFFCF5;
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
@@ -534,17 +534,17 @@ export interface AuditBundleConfig {
|
||||
border-radius: 6px;
|
||||
font-size: 0.75rem;
|
||||
font-weight: 500;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.filter-tab:hover {
|
||||
color: #1e293b;
|
||||
color: #3D2E0A;
|
||||
}
|
||||
|
||||
.filter-tab--active {
|
||||
background: white;
|
||||
color: #1e293b;
|
||||
color: #3D2E0A;
|
||||
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
|
||||
}
|
||||
|
||||
@@ -552,7 +552,7 @@ export interface AuditBundleConfig {
|
||||
.items-list {
|
||||
max-height: 280px;
|
||||
overflow-y: auto;
|
||||
border: 1px solid #e2e8f0;
|
||||
border: 1px solid rgba(212, 201, 168, 0.3);
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
@@ -561,7 +561,7 @@ export interface AuditBundleConfig {
|
||||
align-items: center;
|
||||
gap: 0.75rem;
|
||||
padding: 0.75rem;
|
||||
border-bottom: 1px solid #f1f5f9;
|
||||
border-bottom: 1px solid #FFF9ED;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
@@ -570,7 +570,7 @@ export interface AuditBundleConfig {
|
||||
}
|
||||
|
||||
.item-row:hover {
|
||||
background: #f8fafc;
|
||||
background: #FFFCF5;
|
||||
}
|
||||
|
||||
.item-row--selected {
|
||||
@@ -604,19 +604,19 @@ export interface AuditBundleConfig {
|
||||
.item-row__name {
|
||||
font-size: 0.8125rem;
|
||||
font-weight: 500;
|
||||
color: #1e293b;
|
||||
color: #3D2E0A;
|
||||
}
|
||||
|
||||
.item-row__meta {
|
||||
font-size: 0.6875rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
}
|
||||
|
||||
.item-row__digest {
|
||||
font-size: 0.6875rem;
|
||||
font-family: monospace;
|
||||
color: #64748b;
|
||||
background: #f1f5f9;
|
||||
color: #6B5A2E;
|
||||
background: #FFF9ED;
|
||||
padding: 0.125rem 0.375rem;
|
||||
border-radius: 4px;
|
||||
}
|
||||
@@ -624,13 +624,13 @@ export interface AuditBundleConfig {
|
||||
.empty-state {
|
||||
padding: 2rem;
|
||||
text-align: center;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
}
|
||||
|
||||
/* Summary */
|
||||
.summary-box {
|
||||
padding: 1rem;
|
||||
background: #f8fafc;
|
||||
background: #FFFCF5;
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
@@ -649,7 +649,7 @@ export interface AuditBundleConfig {
|
||||
}
|
||||
|
||||
.summary-box dt {
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
}
|
||||
|
||||
.summary-box dd {
|
||||
@@ -673,7 +673,7 @@ export interface AuditBundleConfig {
|
||||
align-items: flex-start;
|
||||
gap: 0.75rem;
|
||||
padding: 0.75rem;
|
||||
border: 1px solid #e2e8f0;
|
||||
border: 1px solid rgba(212, 201, 168, 0.3);
|
||||
border-radius: 8px;
|
||||
cursor: pointer;
|
||||
}
|
||||
@@ -704,7 +704,7 @@ export interface AuditBundleConfig {
|
||||
|
||||
.radio-label small {
|
||||
font-size: 0.75rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
}
|
||||
|
||||
/* Buttons */
|
||||
@@ -727,7 +727,7 @@ export interface AuditBundleConfig {
|
||||
|
||||
.btn--primary {
|
||||
background: #2563eb;
|
||||
color: white;
|
||||
color: #1C1200;
|
||||
}
|
||||
|
||||
.btn--primary:hover:not(:disabled) {
|
||||
@@ -735,13 +735,13 @@ export interface AuditBundleConfig {
|
||||
}
|
||||
|
||||
.btn--secondary {
|
||||
background: #f8fafc;
|
||||
color: #1e293b;
|
||||
border: 1px solid #e2e8f0;
|
||||
background: #FFFCF5;
|
||||
color: #3D2E0A;
|
||||
border: 1px solid rgba(212, 201, 168, 0.3);
|
||||
}
|
||||
|
||||
.btn--secondary:hover:not(:disabled) {
|
||||
background: #f1f5f9;
|
||||
background: #FFF9ED;
|
||||
}
|
||||
|
||||
.spinner {
|
||||
|
||||
@@ -320,8 +320,8 @@ type ExportStep = 'select' | 'configure' | 'building' | 'ready';
|
||||
styles: [`
|
||||
.airgap-export {
|
||||
padding: 1.5rem;
|
||||
color: #e2e8f0;
|
||||
background: #0f172a;
|
||||
color: rgba(212, 201, 168, 0.3);
|
||||
background: #1C1200;
|
||||
min-height: calc(100vh - 120px);
|
||||
}
|
||||
|
||||
@@ -336,7 +336,7 @@ type ExportStep = 'select' | 'configure' | 'building' | 'ready';
|
||||
|
||||
.subtitle {
|
||||
margin: 0;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
font-size: 0.875rem;
|
||||
}
|
||||
}
|
||||
@@ -345,13 +345,13 @@ type ExportStep = 'select' | 'configure' | 'building' | 'ready';
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
text-decoration: none;
|
||||
font-size: 0.875rem;
|
||||
transition: color 0.15s;
|
||||
|
||||
&:hover {
|
||||
color: #e2e8f0;
|
||||
color: rgba(212, 201, 168, 0.3);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -398,7 +398,7 @@ type ExportStep = 'select' | 'configure' | 'building' | 'ready';
|
||||
justify-content: center;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
background: #334155;
|
||||
background: #3D2E0A;
|
||||
border-radius: 50%;
|
||||
font-size: 0.75rem;
|
||||
font-weight: 600;
|
||||
@@ -428,7 +428,7 @@ type ExportStep = 'select' | 'configure' | 'building' | 'ready';
|
||||
|
||||
> p {
|
||||
margin: 0 0 1.5rem;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -437,13 +437,13 @@ type ExportStep = 'select' | 'configure' | 'building' | 'ready';
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
padding: 2rem;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
}
|
||||
|
||||
.loading-spinner {
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
border: 3px solid #334155;
|
||||
border: 3px solid #3D2E0A;
|
||||
border-top-color: #3b82f6;
|
||||
border-radius: 50%;
|
||||
animation: spin 1s linear infinite;
|
||||
@@ -466,7 +466,7 @@ type ExportStep = 'select' | 'configure' | 'building' | 'ready';
|
||||
gap: 1rem;
|
||||
align-items: center;
|
||||
padding: 1rem;
|
||||
background: #0f172a;
|
||||
background: #1C1200;
|
||||
border: 1px solid #1f2933;
|
||||
border-radius: 6px;
|
||||
cursor: pointer;
|
||||
@@ -479,7 +479,7 @@ type ExportStep = 'select' | 'configure' | 'building' | 'ready';
|
||||
}
|
||||
|
||||
&:hover:not(.feed-option--disabled) {
|
||||
border-color: #334155;
|
||||
border-color: #3D2E0A;
|
||||
}
|
||||
|
||||
&--selected {
|
||||
@@ -526,7 +526,7 @@ type ExportStep = 'select' | 'configure' | 'building' | 'ready';
|
||||
align-items: flex-end;
|
||||
gap: 0.25rem;
|
||||
font-size: 0.75rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
}
|
||||
|
||||
.feed-status {
|
||||
@@ -546,7 +546,7 @@ type ExportStep = 'select' | 'configure' | 'building' | 'ready';
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
padding: 1rem;
|
||||
background: #0f172a;
|
||||
background: #1C1200;
|
||||
border-radius: 6px;
|
||||
font-size: 0.875rem;
|
||||
}
|
||||
@@ -591,10 +591,10 @@ type ExportStep = 'select' | 'configure' | 'building' | 'ready';
|
||||
|
||||
.form-input {
|
||||
padding: 0.625rem 1rem;
|
||||
background: #0f172a;
|
||||
border: 1px solid #334155;
|
||||
background: #1C1200;
|
||||
border: 1px solid #3D2E0A;
|
||||
border-radius: 6px;
|
||||
color: #e2e8f0;
|
||||
color: rgba(212, 201, 168, 0.3);
|
||||
font-size: 0.875rem;
|
||||
|
||||
&:focus {
|
||||
@@ -614,12 +614,12 @@ type ExportStep = 'select' | 'configure' | 'building' | 'ready';
|
||||
|
||||
.form-hint {
|
||||
font-size: 0.75rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
}
|
||||
|
||||
.selected-feeds-summary {
|
||||
padding: 1rem;
|
||||
background: #0f172a;
|
||||
background: #1C1200;
|
||||
border-radius: 6px;
|
||||
margin-bottom: 1.5rem;
|
||||
|
||||
@@ -629,7 +629,7 @@ type ExportStep = 'select' | 'configure' | 'building' | 'ready';
|
||||
font-weight: 600;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.05em;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -676,7 +676,7 @@ type ExportStep = 'select' | 'configure' | 'building' | 'ready';
|
||||
|
||||
.progress-bar-container {
|
||||
height: 8px;
|
||||
background: #334155;
|
||||
background: #3D2E0A;
|
||||
border-radius: 4px;
|
||||
overflow: hidden;
|
||||
margin-bottom: 1rem;
|
||||
@@ -700,7 +700,7 @@ type ExportStep = 'select' | 'configure' | 'building' | 'ready';
|
||||
}
|
||||
|
||||
.progress-status {
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
}
|
||||
|
||||
.step-content--ready {
|
||||
@@ -714,7 +714,7 @@ type ExportStep = 'select' | 'configure' | 'building' | 'ready';
|
||||
|
||||
.bundle-details {
|
||||
text-align: left;
|
||||
background: #0f172a;
|
||||
background: #1C1200;
|
||||
border-radius: 6px;
|
||||
padding: 1.25rem;
|
||||
margin: 1.5rem 0;
|
||||
@@ -734,7 +734,7 @@ type ExportStep = 'select' | 'configure' | 'building' | 'ready';
|
||||
|
||||
.detail-label {
|
||||
font-size: 0.8125rem;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
}
|
||||
|
||||
.detail-value {
|
||||
@@ -755,7 +755,7 @@ type ExportStep = 'select' | 'configure' | 'building' | 'ready';
|
||||
|
||||
.checksum-section {
|
||||
text-align: left;
|
||||
background: #0f172a;
|
||||
background: #1C1200;
|
||||
border-radius: 6px;
|
||||
padding: 1.25rem;
|
||||
margin-bottom: 1.5rem;
|
||||
@@ -764,7 +764,7 @@ type ExportStep = 'select' | 'configure' | 'building' | 'ready';
|
||||
margin: 0 0 0.75rem;
|
||||
font-size: 0.8125rem;
|
||||
font-weight: 600;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -776,7 +776,7 @@ type ExportStep = 'select' | 'configure' | 'building' | 'ready';
|
||||
|
||||
.checksum-label {
|
||||
font-size: 0.75rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
min-width: 60px;
|
||||
}
|
||||
|
||||
@@ -784,23 +784,23 @@ type ExportStep = 'select' | 'configure' | 'building' | 'ready';
|
||||
flex: 1;
|
||||
font-family: 'JetBrains Mono', monospace;
|
||||
font-size: 0.75rem;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
word-break: break-all;
|
||||
}
|
||||
|
||||
.copy-btn {
|
||||
padding: 0.25rem 0.625rem;
|
||||
background: #1f2933;
|
||||
border: 1px solid #334155;
|
||||
border: 1px solid #3D2E0A;
|
||||
border-radius: 4px;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
font-size: 0.75rem;
|
||||
cursor: pointer;
|
||||
transition: all 0.15s;
|
||||
|
||||
&:hover {
|
||||
background: #334155;
|
||||
color: #e2e8f0;
|
||||
background: #3D2E0A;
|
||||
color: rgba(212, 201, 168, 0.3);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -850,12 +850,12 @@ type ExportStep = 'select' | 'configure' | 'building' | 'ready';
|
||||
|
||||
&--secondary {
|
||||
background: transparent;
|
||||
border: 1px solid #334155;
|
||||
color: #94a3b8;
|
||||
border: 1px solid #3D2E0A;
|
||||
color: #D4C9A8;
|
||||
|
||||
&:hover:not(:disabled) {
|
||||
background: #1f2933;
|
||||
color: #e2e8f0;
|
||||
color: rgba(212, 201, 168, 0.3);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -321,8 +321,8 @@ type ImportStep = 'upload' | 'validate' | 'review' | 'import' | 'complete';
|
||||
styles: [`
|
||||
.airgap-import {
|
||||
padding: 1.5rem;
|
||||
color: #e2e8f0;
|
||||
background: #0f172a;
|
||||
color: rgba(212, 201, 168, 0.3);
|
||||
background: #1C1200;
|
||||
min-height: calc(100vh - 120px);
|
||||
}
|
||||
|
||||
@@ -337,7 +337,7 @@ type ImportStep = 'upload' | 'validate' | 'review' | 'import' | 'complete';
|
||||
|
||||
.subtitle {
|
||||
margin: 0;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
font-size: 0.875rem;
|
||||
}
|
||||
}
|
||||
@@ -346,13 +346,13 @@ type ImportStep = 'upload' | 'validate' | 'review' | 'import' | 'complete';
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
text-decoration: none;
|
||||
font-size: 0.875rem;
|
||||
transition: color 0.15s;
|
||||
|
||||
&:hover {
|
||||
color: #e2e8f0;
|
||||
color: rgba(212, 201, 168, 0.3);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -401,7 +401,7 @@ type ImportStep = 'upload' | 'validate' | 'review' | 'import' | 'complete';
|
||||
justify-content: center;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
background: #334155;
|
||||
background: #3D2E0A;
|
||||
border-radius: 50%;
|
||||
font-size: 0.75rem;
|
||||
font-weight: 600;
|
||||
@@ -432,13 +432,13 @@ type ImportStep = 'upload' | 'validate' | 'review' | 'import' | 'complete';
|
||||
|
||||
> p {
|
||||
margin: 0 0 1.5rem;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
}
|
||||
}
|
||||
|
||||
// Drop Zone
|
||||
.drop-zone {
|
||||
border: 2px dashed #334155;
|
||||
border: 2px dashed #3D2E0A;
|
||||
border-radius: 8px;
|
||||
padding: 3rem 2rem;
|
||||
text-align: center;
|
||||
@@ -457,7 +457,7 @@ type ImportStep = 'upload' | 'validate' | 'review' | 'import' | 'complete';
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 1rem;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
}
|
||||
|
||||
.drop-zone-text {
|
||||
@@ -468,7 +468,7 @@ type ImportStep = 'upload' | 'validate' | 'review' | 'import' | 'complete';
|
||||
.drop-zone-hint {
|
||||
margin: 0;
|
||||
font-size: 0.75rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
}
|
||||
|
||||
.file-input-label {
|
||||
@@ -511,7 +511,7 @@ type ImportStep = 'upload' | 'validate' | 'review' | 'import' | 'complete';
|
||||
|
||||
.file-size {
|
||||
font-size: 0.75rem;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
}
|
||||
|
||||
.remove-file {
|
||||
@@ -522,14 +522,14 @@ type ImportStep = 'upload' | 'validate' | 'review' | 'import' | 'complete';
|
||||
height: 32px;
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
cursor: pointer;
|
||||
border-radius: 4px;
|
||||
transition: all 0.15s;
|
||||
|
||||
&:hover {
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
color: #e2e8f0;
|
||||
color: rgba(212, 201, 168, 0.3);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -553,7 +553,7 @@ type ImportStep = 'upload' | 'validate' | 'review' | 'import' | 'complete';
|
||||
}
|
||||
|
||||
.progress-ring-bg {
|
||||
stroke: #334155;
|
||||
stroke: #3D2E0A;
|
||||
}
|
||||
|
||||
.progress-ring-fill {
|
||||
@@ -573,7 +573,7 @@ type ImportStep = 'upload' | 'validate' | 'review' | 'import' | 'complete';
|
||||
|
||||
.validation-status p {
|
||||
margin: 0;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
}
|
||||
|
||||
// Validation Result
|
||||
@@ -638,7 +638,7 @@ type ImportStep = 'upload' | 'validate' | 'review' | 'import' | 'complete';
|
||||
font-weight: 600;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.05em;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -681,7 +681,7 @@ type ImportStep = 'upload' | 'validate' | 'review' | 'import' | 'complete';
|
||||
.stat-label {
|
||||
font-size: 0.6875rem;
|
||||
text-transform: uppercase;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
}
|
||||
|
||||
.validation-errors,
|
||||
@@ -728,7 +728,7 @@ type ImportStep = 'upload' | 'validate' | 'review' | 'import' | 'complete';
|
||||
|
||||
.progress-bar-container {
|
||||
height: 8px;
|
||||
background: #334155;
|
||||
background: #3D2E0A;
|
||||
border-radius: 4px;
|
||||
overflow: hidden;
|
||||
margin-bottom: 1rem;
|
||||
@@ -753,7 +753,7 @@ type ImportStep = 'upload' | 'validate' | 'review' | 'import' | 'complete';
|
||||
}
|
||||
|
||||
.progress-status {
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
}
|
||||
|
||||
.import-stats {
|
||||
@@ -811,12 +811,12 @@ type ImportStep = 'upload' | 'validate' | 'review' | 'import' | 'complete';
|
||||
|
||||
&--secondary {
|
||||
background: transparent;
|
||||
border: 1px solid #334155;
|
||||
color: #94a3b8;
|
||||
border: 1px solid #3D2E0A;
|
||||
color: #D4C9A8;
|
||||
|
||||
&:hover {
|
||||
background: #1f2933;
|
||||
color: #e2e8f0;
|
||||
color: rgba(212, 201, 168, 0.3);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -282,8 +282,8 @@ type TabMode = 'mirrors' | 'airgap' | 'version-locks';
|
||||
styles: [`
|
||||
.feed-mirror-dashboard {
|
||||
padding: 1.5rem;
|
||||
color: #e2e8f0;
|
||||
background: #0f172a;
|
||||
color: rgba(212, 201, 168, 0.3);
|
||||
background: #1C1200;
|
||||
min-height: calc(100vh - 120px);
|
||||
}
|
||||
|
||||
@@ -305,7 +305,7 @@ type TabMode = 'mirrors' | 'airgap' | 'version-locks';
|
||||
|
||||
.subtitle {
|
||||
margin: 0;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
font-size: 0.875rem;
|
||||
}
|
||||
}
|
||||
@@ -332,7 +332,7 @@ type TabMode = 'mirrors' | 'airgap' | 'version-locks';
|
||||
background: transparent;
|
||||
border: none;
|
||||
border-bottom: 2px solid transparent;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
font-size: 0.875rem;
|
||||
font-weight: 500;
|
||||
cursor: pointer;
|
||||
@@ -340,7 +340,7 @@ type TabMode = 'mirrors' | 'airgap' | 'version-locks';
|
||||
margin-bottom: -1px;
|
||||
|
||||
&:hover {
|
||||
color: #e2e8f0;
|
||||
color: rgba(212, 201, 168, 0.3);
|
||||
background: rgba(255, 255, 255, 0.02);
|
||||
}
|
||||
|
||||
@@ -358,7 +358,7 @@ type TabMode = 'mirrors' | 'airgap' | 'version-locks';
|
||||
min-width: 18px;
|
||||
height: 18px;
|
||||
padding: 0 5px;
|
||||
background: #334155;
|
||||
background: #3D2E0A;
|
||||
border-radius: 9px;
|
||||
font-size: 0.6875rem;
|
||||
font-weight: 600;
|
||||
@@ -383,7 +383,7 @@ type TabMode = 'mirrors' | 'airgap' | 'version-locks';
|
||||
background: #111827;
|
||||
border: 1px solid #1f2933;
|
||||
border-radius: 8px;
|
||||
border-left: 3px solid #334155;
|
||||
border-left: 3px solid #3D2E0A;
|
||||
|
||||
.stat-value {
|
||||
font-size: 1.5rem;
|
||||
@@ -394,7 +394,7 @@ type TabMode = 'mirrors' | 'airgap' | 'version-locks';
|
||||
.stat-label {
|
||||
font-size: 0.6875rem;
|
||||
text-transform: uppercase;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
letter-spacing: 0.05em;
|
||||
}
|
||||
|
||||
@@ -425,7 +425,7 @@ type TabMode = 'mirrors' | 'airgap' | 'version-locks';
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 4rem 2rem;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
|
||||
p {
|
||||
margin: 1rem 0 0;
|
||||
@@ -436,7 +436,7 @@ type TabMode = 'mirrors' | 'airgap' | 'version-locks';
|
||||
.loading-spinner {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
border: 3px solid #334155;
|
||||
border: 3px solid #3D2E0A;
|
||||
border-top-color: #3b82f6;
|
||||
border-radius: 50%;
|
||||
animation: spin 1s linear infinite;
|
||||
@@ -470,8 +470,8 @@ type TabMode = 'mirrors' | 'airgap' | 'version-locks';
|
||||
transition: all 0.15s;
|
||||
|
||||
&:hover {
|
||||
border-color: #334155;
|
||||
background: #1e293b;
|
||||
border-color: #3D2E0A;
|
||||
background: #3D2E0A;
|
||||
}
|
||||
|
||||
&--import {
|
||||
@@ -497,7 +497,7 @@ type TabMode = 'mirrors' | 'airgap' | 'version-locks';
|
||||
height: 56px;
|
||||
background: #1f2933;
|
||||
border-radius: 8px;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
transition: color 0.15s;
|
||||
}
|
||||
|
||||
@@ -511,7 +511,7 @@ type TabMode = 'mirrors' | 'airgap' | 'version-locks';
|
||||
p {
|
||||
margin: 0;
|
||||
font-size: 0.8125rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -538,21 +538,21 @@ type TabMode = 'mirrors' | 'airgap' | 'version-locks';
|
||||
|
||||
.bundle-count {
|
||||
font-size: 0.75rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
}
|
||||
|
||||
.loading-placeholder,
|
||||
.empty-bundles {
|
||||
padding: 2rem;
|
||||
text-align: center;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
}
|
||||
|
||||
.empty-hint {
|
||||
display: block;
|
||||
margin-top: 0.5rem;
|
||||
font-size: 0.8125rem;
|
||||
color: #475569;
|
||||
color: #6B5A2E;
|
||||
}
|
||||
|
||||
.bundles-grid {
|
||||
@@ -563,7 +563,7 @@ type TabMode = 'mirrors' | 'airgap' | 'version-locks';
|
||||
|
||||
.bundle-card {
|
||||
padding: 1rem;
|
||||
background: #0f172a;
|
||||
background: #1C1200;
|
||||
border: 1px solid #1f2933;
|
||||
border-radius: 6px;
|
||||
|
||||
@@ -594,7 +594,7 @@ type TabMode = 'mirrors' | 'airgap' | 'version-locks';
|
||||
|
||||
&--ready { background: rgba(34, 197, 94, 0.2); color: #22c55e; }
|
||||
&--building { background: rgba(59, 130, 246, 0.2); color: #3b82f6; }
|
||||
&--pending { background: rgba(148, 163, 184, 0.2); color: #94a3b8; }
|
||||
&--pending { background: rgba(148, 163, 184, 0.2); color: #D4C9A8; }
|
||||
&--error { background: rgba(239, 68, 68, 0.2); color: #ef4444; }
|
||||
&--expired { background: rgba(234, 179, 8, 0.2); color: #eab308; }
|
||||
}
|
||||
@@ -602,7 +602,7 @@ type TabMode = 'mirrors' | 'airgap' | 'version-locks';
|
||||
.bundle-description {
|
||||
margin: 0 0 0.75rem;
|
||||
font-size: 0.8125rem;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
}
|
||||
|
||||
.bundle-feeds {
|
||||
@@ -631,7 +631,7 @@ type TabMode = 'mirrors' | 'airgap' | 'version-locks';
|
||||
gap: 1rem;
|
||||
flex-wrap: wrap;
|
||||
font-size: 0.75rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
}
|
||||
|
||||
.meta-item {
|
||||
|
||||
@@ -306,7 +306,7 @@ import { FEED_MIRROR_API } from '../../core/api/feed-mirror.client';
|
||||
|
||||
.subtitle {
|
||||
margin: 0;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
font-size: 0.8125rem;
|
||||
}
|
||||
}
|
||||
@@ -339,12 +339,12 @@ import { FEED_MIRROR_API } from '../../core/api/feed-mirror.client';
|
||||
|
||||
&--secondary {
|
||||
background: transparent;
|
||||
border: 1px solid #334155;
|
||||
color: #94a3b8;
|
||||
border: 1px solid #3D2E0A;
|
||||
color: #D4C9A8;
|
||||
|
||||
&:hover:not(:disabled) {
|
||||
background: #1f2933;
|
||||
color: #e2e8f0;
|
||||
color: rgba(212, 201, 168, 0.3);
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -354,13 +354,13 @@ import { FEED_MIRROR_API } from '../../core/api/feed-mirror.client';
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
padding: 3rem;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
}
|
||||
|
||||
.loading-spinner {
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
border: 3px solid #334155;
|
||||
border: 3px solid #3D2E0A;
|
||||
border-top-color: #3b82f6;
|
||||
border-radius: 50%;
|
||||
animation: spin 1s linear infinite;
|
||||
@@ -387,7 +387,7 @@ import { FEED_MIRROR_API } from '../../core/api/feed-mirror.client';
|
||||
padding: 0.875rem 1rem;
|
||||
font-size: 0.6875rem;
|
||||
text-transform: uppercase;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
font-weight: 500;
|
||||
border-bottom: 1px solid #1f2933;
|
||||
letter-spacing: 0.05em;
|
||||
@@ -454,7 +454,7 @@ import { FEED_MIRROR_API } from '../../core/api/feed-mirror.client';
|
||||
.version-code {
|
||||
font-family: 'JetBrains Mono', monospace;
|
||||
font-size: 0.8125rem;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
}
|
||||
|
||||
.locked-date {
|
||||
@@ -463,7 +463,7 @@ import { FEED_MIRROR_API } from '../../core/api/feed-mirror.client';
|
||||
}
|
||||
|
||||
.no-version {
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
@@ -476,16 +476,16 @@ import { FEED_MIRROR_API } from '../../core/api/feed-mirror.client';
|
||||
|
||||
.created-by {
|
||||
font-size: 0.6875rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
}
|
||||
|
||||
.notes-text {
|
||||
font-size: 0.8125rem;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
}
|
||||
|
||||
.no-notes {
|
||||
color: #475569;
|
||||
color: #6B5A2E;
|
||||
}
|
||||
|
||||
.action-buttons {
|
||||
@@ -501,15 +501,15 @@ import { FEED_MIRROR_API } from '../../core/api/feed-mirror.client';
|
||||
height: 28px;
|
||||
padding: 0;
|
||||
background: transparent;
|
||||
border: 1px solid #334155;
|
||||
border: 1px solid #3D2E0A;
|
||||
border-radius: 4px;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
cursor: pointer;
|
||||
transition: all 0.15s;
|
||||
|
||||
&:hover {
|
||||
background: #1f2933;
|
||||
color: #e2e8f0;
|
||||
color: rgba(212, 201, 168, 0.3);
|
||||
}
|
||||
|
||||
&--active {
|
||||
@@ -534,7 +534,7 @@ import { FEED_MIRROR_API } from '../../core/api/feed-mirror.client';
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 0.75rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
|
||||
p {
|
||||
margin: 0;
|
||||
@@ -544,7 +544,7 @@ import { FEED_MIRROR_API } from '../../core/api/feed-mirror.client';
|
||||
|
||||
.empty-hint {
|
||||
font-size: 0.8125rem;
|
||||
color: #475569;
|
||||
color: #6B5A2E;
|
||||
max-width: 400px;
|
||||
text-align: center;
|
||||
}
|
||||
@@ -559,20 +559,20 @@ import { FEED_MIRROR_API } from '../../core/api/feed-mirror.client';
|
||||
margin: 0 0 0.75rem;
|
||||
font-size: 0.875rem;
|
||||
font-weight: 600;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
}
|
||||
|
||||
ul {
|
||||
margin: 0;
|
||||
padding-left: 1.25rem;
|
||||
font-size: 0.8125rem;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
|
||||
li {
|
||||
margin-bottom: 0.5rem;
|
||||
|
||||
strong {
|
||||
color: #e2e8f0;
|
||||
color: rgba(212, 201, 168, 0.3);
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -617,11 +617,11 @@ import { FEED_MIRROR_API } from '../../core/api/feed-mirror.client';
|
||||
padding: 0;
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
cursor: pointer;
|
||||
|
||||
&:hover {
|
||||
color: #e2e8f0;
|
||||
color: rgba(212, 201, 168, 0.3);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -647,17 +647,17 @@ import { FEED_MIRROR_API } from '../../core/api/feed-mirror.client';
|
||||
label {
|
||||
font-size: 0.8125rem;
|
||||
font-weight: 500;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
}
|
||||
}
|
||||
|
||||
.form-select,
|
||||
.form-input {
|
||||
padding: 0.625rem 1rem;
|
||||
background: #0f172a;
|
||||
border: 1px solid #334155;
|
||||
background: #1C1200;
|
||||
border: 1px solid #3D2E0A;
|
||||
border-radius: 6px;
|
||||
color: #e2e8f0;
|
||||
color: rgba(212, 201, 168, 0.3);
|
||||
font-size: 0.875rem;
|
||||
|
||||
&:focus {
|
||||
|
||||
@@ -181,11 +181,11 @@ interface FreshnessWarning {
|
||||
|
||||
.header-subtitle {
|
||||
font-size: 0.75rem;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
}
|
||||
|
||||
.expand-icon {
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
transition: transform 0.2s;
|
||||
|
||||
&.rotated {
|
||||
@@ -241,7 +241,7 @@ interface FreshnessWarning {
|
||||
&--osv { background: rgba(34, 197, 94, 0.2); color: #22c55e; }
|
||||
&--epss { background: rgba(249, 115, 22, 0.2); color: #f97316; }
|
||||
&--kev { background: rgba(239, 68, 68, 0.2); color: #ef4444; }
|
||||
&--custom { background: rgba(100, 116, 139, 0.2); color: #94a3b8; }
|
||||
&--custom { background: rgba(100, 116, 139, 0.2); color: #D4C9A8; }
|
||||
}
|
||||
|
||||
.warning-content {
|
||||
@@ -258,7 +258,7 @@ interface FreshnessWarning {
|
||||
|
||||
.warning-age {
|
||||
font-size: 0.6875rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
}
|
||||
|
||||
.severity-badge {
|
||||
@@ -288,11 +288,11 @@ interface FreshnessWarning {
|
||||
.recommendation {
|
||||
margin: 0;
|
||||
font-size: 0.8125rem;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
line-height: 1.5;
|
||||
|
||||
strong {
|
||||
color: #e2e8f0;
|
||||
color: rgba(212, 201, 168, 0.3);
|
||||
}
|
||||
}
|
||||
`],
|
||||
|
||||
@@ -294,16 +294,16 @@ import { SnapshotActionsComponent } from './snapshot-actions.component';
|
||||
gap: 0.5rem;
|
||||
padding: 0.5rem 1rem;
|
||||
background: transparent;
|
||||
border: 1px solid #334155;
|
||||
border: 1px solid #3D2E0A;
|
||||
border-radius: 6px;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
font-size: 0.875rem;
|
||||
cursor: pointer;
|
||||
transition: all 0.15s;
|
||||
|
||||
&:hover {
|
||||
background: #1f2933;
|
||||
color: #e2e8f0;
|
||||
color: rgba(212, 201, 168, 0.3);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -350,7 +350,7 @@ import { SnapshotActionsComponent } from './snapshot-actions.component';
|
||||
.feed-type--osv { background: rgba(34, 197, 94, 0.2); color: #22c55e; }
|
||||
.feed-type--epss { background: rgba(249, 115, 22, 0.2); color: #f97316; }
|
||||
.feed-type--kev { background: rgba(239, 68, 68, 0.2); color: #ef4444; }
|
||||
.feed-type--custom { background: rgba(100, 116, 139, 0.2); color: #94a3b8; }
|
||||
.feed-type--custom { background: rgba(100, 116, 139, 0.2); color: #D4C9A8; }
|
||||
|
||||
.toggle-switch {
|
||||
display: flex;
|
||||
@@ -367,7 +367,7 @@ import { SnapshotActionsComponent } from './snapshot-actions.component';
|
||||
position: relative;
|
||||
width: 44px;
|
||||
height: 24px;
|
||||
background: #334155;
|
||||
background: #3D2E0A;
|
||||
border-radius: 12px;
|
||||
transition: background 0.2s;
|
||||
|
||||
@@ -394,7 +394,7 @@ import { SnapshotActionsComponent } from './snapshot-actions.component';
|
||||
|
||||
.toggle-label {
|
||||
font-size: 0.875rem;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
}
|
||||
|
||||
.info-grid {
|
||||
@@ -413,7 +413,7 @@ import { SnapshotActionsComponent } from './snapshot-actions.component';
|
||||
.info-label {
|
||||
font-size: 0.6875rem;
|
||||
text-transform: uppercase;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
letter-spacing: 0.05em;
|
||||
}
|
||||
|
||||
@@ -424,7 +424,7 @@ import { SnapshotActionsComponent } from './snapshot-actions.component';
|
||||
.info-code {
|
||||
font-family: 'JetBrains Mono', monospace;
|
||||
font-size: 0.8125rem;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
word-break: break-all;
|
||||
}
|
||||
|
||||
@@ -442,8 +442,8 @@ import { SnapshotActionsComponent } from './snapshot-actions.component';
|
||||
.status--syncing { background: rgba(59, 130, 246, 0.2); color: #3b82f6; }
|
||||
.status--stale { background: rgba(234, 179, 8, 0.2); color: #eab308; }
|
||||
.status--error { background: rgba(239, 68, 68, 0.2); color: #ef4444; }
|
||||
.status--disabled { background: rgba(100, 116, 139, 0.2); color: #64748b; }
|
||||
.status--pending { background: rgba(148, 163, 184, 0.2); color: #94a3b8; }
|
||||
.status--disabled { background: rgba(100, 116, 139, 0.2); color: #6B5A2E; }
|
||||
.status--pending { background: rgba(148, 163, 184, 0.2); color: #D4C9A8; }
|
||||
|
||||
.error-banner {
|
||||
display: flex;
|
||||
@@ -518,11 +518,11 @@ import { SnapshotActionsComponent } from './snapshot-actions.component';
|
||||
|
||||
&--secondary {
|
||||
background: #1f2933;
|
||||
color: #e2e8f0;
|
||||
border: 1px solid #334155;
|
||||
color: rgba(212, 201, 168, 0.3);
|
||||
border: 1px solid #3D2E0A;
|
||||
|
||||
&:hover:not(:disabled) {
|
||||
background: #334155;
|
||||
background: #3D2E0A;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -560,16 +560,16 @@ import { SnapshotActionsComponent } from './snapshot-actions.component';
|
||||
|
||||
label {
|
||||
font-size: 0.8125rem;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
}
|
||||
}
|
||||
|
||||
.form-input {
|
||||
padding: 0.625rem 1rem;
|
||||
background: #0f172a;
|
||||
border: 1px solid #334155;
|
||||
background: #1C1200;
|
||||
border: 1px solid #3D2E0A;
|
||||
border-radius: 6px;
|
||||
color: #e2e8f0;
|
||||
color: rgba(212, 201, 168, 0.3);
|
||||
font-size: 0.875rem;
|
||||
|
||||
&:focus {
|
||||
@@ -605,12 +605,12 @@ import { SnapshotActionsComponent } from './snapshot-actions.component';
|
||||
|
||||
&--secondary {
|
||||
background: transparent;
|
||||
border: 1px solid #334155;
|
||||
color: #94a3b8;
|
||||
border: 1px solid #3D2E0A;
|
||||
color: #D4C9A8;
|
||||
|
||||
&:hover {
|
||||
background: #1f2933;
|
||||
color: #e2e8f0;
|
||||
color: rgba(212, 201, 168, 0.3);
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -640,7 +640,7 @@ import { SnapshotActionsComponent } from './snapshot-actions.component';
|
||||
|
||||
.snapshot-count {
|
||||
font-size: 0.75rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
}
|
||||
|
||||
.loading-container {
|
||||
@@ -648,7 +648,7 @@ import { SnapshotActionsComponent } from './snapshot-actions.component';
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
padding: 2rem;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
|
||||
p {
|
||||
margin: 0.5rem 0 0;
|
||||
@@ -659,7 +659,7 @@ import { SnapshotActionsComponent } from './snapshot-actions.component';
|
||||
.loading-spinner {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
border: 2px solid #334155;
|
||||
border: 2px solid #3D2E0A;
|
||||
border-top-color: #3b82f6;
|
||||
border-radius: 50%;
|
||||
animation: spin 1s linear infinite;
|
||||
@@ -678,7 +678,7 @@ import { SnapshotActionsComponent } from './snapshot-actions.component';
|
||||
padding: 0.75rem 1rem;
|
||||
font-size: 0.6875rem;
|
||||
text-transform: uppercase;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
font-weight: 500;
|
||||
border-bottom: 1px solid #1f2933;
|
||||
}
|
||||
@@ -738,12 +738,12 @@ import { SnapshotActionsComponent } from './snapshot-actions.component';
|
||||
|
||||
.no-expiry {
|
||||
font-size: 0.75rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
}
|
||||
|
||||
.no-data {
|
||||
text-align: center;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
padding: 2rem !important;
|
||||
}
|
||||
|
||||
@@ -767,7 +767,7 @@ import { SnapshotActionsComponent } from './snapshot-actions.component';
|
||||
.retention-label {
|
||||
font-size: 0.6875rem;
|
||||
text-transform: uppercase;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
}
|
||||
|
||||
.retention-value {
|
||||
|
||||
@@ -194,11 +194,11 @@ import { FEED_MIRROR_API } from '../../core/api/feed-mirror.client';
|
||||
background: #111827;
|
||||
border: 1px solid #1f2933;
|
||||
border-radius: 6px;
|
||||
color: #e2e8f0;
|
||||
color: rgba(212, 201, 168, 0.3);
|
||||
font-size: 0.875rem;
|
||||
|
||||
&::placeholder {
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
}
|
||||
|
||||
&:focus {
|
||||
@@ -212,10 +212,10 @@ import { FEED_MIRROR_API } from '../../core/api/feed-mirror.client';
|
||||
background: #111827;
|
||||
border: 1px solid #1f2933;
|
||||
border-radius: 6px;
|
||||
color: #e2e8f0;
|
||||
color: rgba(212, 201, 168, 0.3);
|
||||
font-size: 0.875rem;
|
||||
appearance: none;
|
||||
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
|
||||
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%236B5A2E' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
|
||||
background-repeat: no-repeat;
|
||||
background-position: right 0.75rem center;
|
||||
cursor: pointer;
|
||||
@@ -232,15 +232,15 @@ import { FEED_MIRROR_API } from '../../core/api/feed-mirror.client';
|
||||
gap: 0.5rem;
|
||||
padding: 0.625rem 1rem;
|
||||
background: #1f2933;
|
||||
border: 1px solid #334155;
|
||||
border: 1px solid #3D2E0A;
|
||||
border-radius: 6px;
|
||||
color: #e2e8f0;
|
||||
color: rgba(212, 201, 168, 0.3);
|
||||
font-size: 0.875rem;
|
||||
cursor: pointer;
|
||||
transition: all 0.15s;
|
||||
|
||||
&:hover {
|
||||
background: #334155;
|
||||
background: #3D2E0A;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -259,8 +259,8 @@ import { FEED_MIRROR_API } from '../../core/api/feed-mirror.client';
|
||||
transition: all 0.15s;
|
||||
|
||||
&:hover {
|
||||
border-color: #334155;
|
||||
background: #1e293b;
|
||||
border-color: #3D2E0A;
|
||||
background: #3D2E0A;
|
||||
}
|
||||
|
||||
&:focus {
|
||||
@@ -286,11 +286,11 @@ import { FEED_MIRROR_API } from '../../core/api/feed-mirror.client';
|
||||
}
|
||||
|
||||
.status-border--disabled {
|
||||
border-left: 3px solid #64748b;
|
||||
border-left: 3px solid #6B5A2E;
|
||||
}
|
||||
|
||||
.status-border--pending {
|
||||
border-left: 3px solid #94a3b8;
|
||||
border-left: 3px solid #D4C9A8;
|
||||
}
|
||||
|
||||
.mirror-header {
|
||||
@@ -355,7 +355,7 @@ import { FEED_MIRROR_API } from '../../core/api/feed-mirror.client';
|
||||
|
||||
.feed-type--custom {
|
||||
background: rgba(100, 116, 139, 0.2);
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
}
|
||||
|
||||
.status-badge {
|
||||
@@ -391,12 +391,12 @@ import { FEED_MIRROR_API } from '../../core/api/feed-mirror.client';
|
||||
|
||||
.status--disabled {
|
||||
background: rgba(100, 116, 139, 0.2);
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
}
|
||||
|
||||
.status--pending {
|
||||
background: rgba(148, 163, 184, 0.2);
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
}
|
||||
|
||||
.status-spinner {
|
||||
@@ -427,17 +427,17 @@ import { FEED_MIRROR_API } from '../../core/api/feed-mirror.client';
|
||||
.stat-label {
|
||||
font-size: 0.625rem;
|
||||
text-transform: uppercase;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
}
|
||||
|
||||
.mirror-sync-info {
|
||||
font-size: 0.75rem;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
|
||||
.sync-label {
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
margin-right: 0.25rem;
|
||||
}
|
||||
|
||||
@@ -484,7 +484,7 @@ import { FEED_MIRROR_API } from '../../core/api/feed-mirror.client';
|
||||
align-items: center;
|
||||
gap: 0.375rem;
|
||||
padding: 0.375rem 0.75rem;
|
||||
border: 1px solid #334155;
|
||||
border: 1px solid #3D2E0A;
|
||||
border-radius: 4px;
|
||||
font-size: 0.75rem;
|
||||
font-weight: 500;
|
||||
@@ -508,10 +508,10 @@ import { FEED_MIRROR_API } from '../../core/api/feed-mirror.client';
|
||||
|
||||
&--view {
|
||||
background: #1f2933;
|
||||
color: #e2e8f0;
|
||||
color: rgba(212, 201, 168, 0.3);
|
||||
|
||||
&:hover:not(:disabled) {
|
||||
background: #334155;
|
||||
background: #3D2E0A;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -529,7 +529,7 @@ import { FEED_MIRROR_API } from '../../core/api/feed-mirror.client';
|
||||
grid-column: 1 / -1;
|
||||
text-align: center;
|
||||
padding: 3rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
|
||||
p {
|
||||
margin: 0;
|
||||
|
||||
@@ -180,7 +180,7 @@ import { OfflineSyncStatus, OfflineSyncState } from '../../core/api/feed-mirror.
|
||||
|
||||
&--unknown {
|
||||
background: rgba(100, 116, 139, 0.2);
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
}
|
||||
|
||||
&--loading {
|
||||
@@ -244,7 +244,7 @@ import { OfflineSyncStatus, OfflineSyncState } from '../../core/api/feed-mirror.
|
||||
|
||||
.status-time {
|
||||
font-size: 0.6875rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
}
|
||||
|
||||
.expand-btn {
|
||||
@@ -257,12 +257,12 @@ import { OfflineSyncStatus, OfflineSyncState } from '../../core/api/feed-mirror.
|
||||
margin-left: auto;
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
cursor: pointer;
|
||||
transition: color 0.15s;
|
||||
|
||||
&:hover {
|
||||
color: #e2e8f0;
|
||||
color: rgba(212, 201, 168, 0.3);
|
||||
}
|
||||
|
||||
svg {
|
||||
@@ -296,7 +296,7 @@ import { OfflineSyncStatus, OfflineSyncState } from '../../core/api/feed-mirror.
|
||||
.detail-label {
|
||||
font-size: 0.625rem;
|
||||
text-transform: uppercase;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
letter-spacing: 0.05em;
|
||||
}
|
||||
|
||||
@@ -328,7 +328,7 @@ import { OfflineSyncStatus, OfflineSyncState } from '../../core/api/feed-mirror.
|
||||
display: block;
|
||||
font-size: 0.6875rem;
|
||||
text-transform: uppercase;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
|
||||
@@ -336,7 +336,7 @@ import { OfflineSyncStatus, OfflineSyncState } from '../../core/api/feed-mirror.
|
||||
margin: 0;
|
||||
padding-left: 1rem;
|
||||
font-size: 0.75rem;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
|
||||
li {
|
||||
margin-bottom: 0.25rem;
|
||||
|
||||
@@ -119,16 +119,16 @@ import { FeedSnapshot } from '../../core/api/feed-mirror.models';
|
||||
height: 28px;
|
||||
padding: 0;
|
||||
background: transparent;
|
||||
border: 1px solid #334155;
|
||||
border: 1px solid #3D2E0A;
|
||||
border-radius: 4px;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
cursor: pointer;
|
||||
transition: all 0.15s;
|
||||
|
||||
&:hover:not(:disabled) {
|
||||
background: #1f2933;
|
||||
color: #e2e8f0;
|
||||
border-color: #475569;
|
||||
color: rgba(212, 201, 168, 0.3);
|
||||
border-color: #6B5A2E;
|
||||
}
|
||||
|
||||
&:disabled {
|
||||
@@ -163,8 +163,8 @@ import { FeedSnapshot } from '../../core/api/feed-mirror.models';
|
||||
min-width: 160px;
|
||||
margin-top: 4px;
|
||||
padding: 0.375rem;
|
||||
background: #1e293b;
|
||||
border: 1px solid #334155;
|
||||
background: #3D2E0A;
|
||||
border: 1px solid #3D2E0A;
|
||||
border-radius: 6px;
|
||||
box-shadow: 0 10px 40px rgba(0, 0, 0, 0.4);
|
||||
}
|
||||
@@ -178,7 +178,7 @@ import { FeedSnapshot } from '../../core/api/feed-mirror.models';
|
||||
background: transparent;
|
||||
border: none;
|
||||
border-radius: 4px;
|
||||
color: #e2e8f0;
|
||||
color: rgba(212, 201, 168, 0.3);
|
||||
font-size: 0.8125rem;
|
||||
text-align: left;
|
||||
cursor: pointer;
|
||||
@@ -205,7 +205,7 @@ import { FeedSnapshot } from '../../core/api/feed-mirror.models';
|
||||
.menu-divider {
|
||||
height: 1px;
|
||||
margin: 0.375rem 0;
|
||||
background: #334155;
|
||||
background: #3D2E0A;
|
||||
border: none;
|
||||
}
|
||||
`],
|
||||
|
||||
@@ -178,7 +178,7 @@ interface SnapshotSelection {
|
||||
.subtitle {
|
||||
margin: 0;
|
||||
font-size: 0.8125rem;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -220,12 +220,12 @@ interface SnapshotSelection {
|
||||
|
||||
&--secondary {
|
||||
background: transparent;
|
||||
border: 1px solid #334155;
|
||||
color: #94a3b8;
|
||||
border: 1px solid #3D2E0A;
|
||||
color: #D4C9A8;
|
||||
|
||||
&:hover:not(:disabled) {
|
||||
background: #1f2933;
|
||||
color: #e2e8f0;
|
||||
color: rgba(212, 201, 168, 0.3);
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -238,7 +238,7 @@ interface SnapshotSelection {
|
||||
|
||||
.feed-card {
|
||||
padding: 1rem;
|
||||
background: #0f172a;
|
||||
background: #1C1200;
|
||||
border: 1px solid #1f2933;
|
||||
border-radius: 6px;
|
||||
transition: all 0.15s;
|
||||
@@ -269,7 +269,7 @@ interface SnapshotSelection {
|
||||
&--osv { background: rgba(34, 197, 94, 0.2); color: #22c55e; }
|
||||
&--epss { background: rgba(249, 115, 22, 0.2); color: #f97316; }
|
||||
&--kev { background: rgba(239, 68, 68, 0.2); color: #ef4444; }
|
||||
&--custom { background: rgba(100, 116, 139, 0.2); color: #94a3b8; }
|
||||
&--custom { background: rgba(100, 116, 139, 0.2); color: #D4C9A8; }
|
||||
}
|
||||
|
||||
.feed-name {
|
||||
@@ -284,7 +284,7 @@ interface SnapshotSelection {
|
||||
.loading-placeholder {
|
||||
padding: 0.5rem;
|
||||
font-size: 0.75rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
@@ -292,9 +292,9 @@ interface SnapshotSelection {
|
||||
width: 100%;
|
||||
padding: 0.5rem 0.75rem;
|
||||
background: #111827;
|
||||
border: 1px solid #334155;
|
||||
border: 1px solid #3D2E0A;
|
||||
border-radius: 5px;
|
||||
color: #e2e8f0;
|
||||
color: rgba(212, 201, 168, 0.3);
|
||||
font-size: 0.8125rem;
|
||||
cursor: pointer;
|
||||
|
||||
@@ -305,7 +305,7 @@ interface SnapshotSelection {
|
||||
|
||||
option {
|
||||
background: #111827;
|
||||
color: #e2e8f0;
|
||||
color: rgba(212, 201, 168, 0.3);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -324,7 +324,7 @@ interface SnapshotSelection {
|
||||
.checksum-label {
|
||||
font-size: 0.625rem;
|
||||
text-transform: uppercase;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
letter-spacing: 0.05em;
|
||||
min-width: 50px;
|
||||
}
|
||||
@@ -333,7 +333,7 @@ interface SnapshotSelection {
|
||||
flex: 1;
|
||||
font-family: 'JetBrains Mono', monospace;
|
||||
font-size: 0.6875rem;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
word-break: break-all;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
@@ -346,16 +346,16 @@ interface SnapshotSelection {
|
||||
justify-content: center;
|
||||
padding: 0.25rem;
|
||||
background: transparent;
|
||||
border: 1px solid #334155;
|
||||
border: 1px solid #3D2E0A;
|
||||
border-radius: 3px;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
cursor: pointer;
|
||||
transition: all 0.15s;
|
||||
|
||||
&:hover {
|
||||
background: #1f2933;
|
||||
color: #e2e8f0;
|
||||
border-color: #475569;
|
||||
color: rgba(212, 201, 168, 0.3);
|
||||
border-color: #6B5A2E;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -370,7 +370,7 @@ interface SnapshotSelection {
|
||||
|
||||
.selection-summary {
|
||||
font-size: 0.8125rem;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
|
||||
strong {
|
||||
color: #3b82f6;
|
||||
|
||||
@@ -112,7 +112,7 @@ import {
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
border-radius: 50%;
|
||||
background: #64748b;
|
||||
background: #6B5A2E;
|
||||
|
||||
&--online {
|
||||
background: #22c55e;
|
||||
@@ -154,12 +154,12 @@ import {
|
||||
|
||||
.status-text {
|
||||
font-weight: 500;
|
||||
color: #e2e8f0;
|
||||
color: rgba(212, 201, 168, 0.3);
|
||||
}
|
||||
|
||||
.sync-time {
|
||||
font-size: 0.6875rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
}
|
||||
|
||||
.details-toggle {
|
||||
@@ -169,12 +169,12 @@ import {
|
||||
padding: 0;
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
cursor: pointer;
|
||||
transition: color 0.15s;
|
||||
|
||||
&:hover {
|
||||
color: #e2e8f0;
|
||||
color: rgba(212, 201, 168, 0.3);
|
||||
}
|
||||
|
||||
svg {
|
||||
@@ -208,7 +208,7 @@ import {
|
||||
}
|
||||
|
||||
.detail-label {
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
}
|
||||
|
||||
.detail-value {
|
||||
|
||||
@@ -351,8 +351,8 @@ import { SnapshotSelectorComponent } from './snapshot-selector.component';
|
||||
styles: [`
|
||||
.version-lock-page {
|
||||
padding: 1.5rem;
|
||||
color: #e2e8f0;
|
||||
background: #0f172a;
|
||||
color: rgba(212, 201, 168, 0.3);
|
||||
background: #1C1200;
|
||||
min-height: calc(100vh - 120px);
|
||||
}
|
||||
|
||||
@@ -364,14 +364,14 @@ import { SnapshotSelectorComponent } from './snapshot-selector.component';
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
text-decoration: none;
|
||||
font-size: 0.875rem;
|
||||
margin-bottom: 1rem;
|
||||
transition: color 0.15s;
|
||||
|
||||
&:hover {
|
||||
color: #e2e8f0;
|
||||
color: rgba(212, 201, 168, 0.3);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -391,7 +391,7 @@ import { SnapshotSelectorComponent } from './snapshot-selector.component';
|
||||
|
||||
.subtitle {
|
||||
margin: 0;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
font-size: 0.875rem;
|
||||
}
|
||||
}
|
||||
@@ -424,12 +424,12 @@ import { SnapshotSelectorComponent } from './snapshot-selector.component';
|
||||
|
||||
&--secondary {
|
||||
background: transparent;
|
||||
border: 1px solid #334155;
|
||||
color: #94a3b8;
|
||||
border: 1px solid #3D2E0A;
|
||||
color: #D4C9A8;
|
||||
|
||||
&:hover:not(:disabled) {
|
||||
background: #1f2933;
|
||||
color: #e2e8f0;
|
||||
color: rgba(212, 201, 168, 0.3);
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -439,13 +439,13 @@ import { SnapshotSelectorComponent } from './snapshot-selector.component';
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
padding: 4rem 2rem;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
}
|
||||
|
||||
.loading-spinner {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
border: 3px solid #334155;
|
||||
border: 3px solid #3D2E0A;
|
||||
border-top-color: #3b82f6;
|
||||
border-radius: 50%;
|
||||
animation: spin 1s linear infinite;
|
||||
@@ -472,7 +472,7 @@ import { SnapshotSelectorComponent } from './snapshot-selector.component';
|
||||
padding: 0.875rem 1rem;
|
||||
font-size: 0.6875rem;
|
||||
text-transform: uppercase;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
font-weight: 500;
|
||||
border-bottom: 1px solid #1f2933;
|
||||
letter-spacing: 0.05em;
|
||||
@@ -524,11 +524,11 @@ import { SnapshotSelectorComponent } from './snapshot-selector.component';
|
||||
.version-code {
|
||||
font-family: 'JetBrains Mono', monospace;
|
||||
font-size: 0.8125rem;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
}
|
||||
|
||||
.locked-date { font-size: 0.8125rem; color: #eab308; }
|
||||
.no-version { color: #64748b; font-style: italic; }
|
||||
.no-version { color: #6B5A2E; font-style: italic; }
|
||||
|
||||
.created-info {
|
||||
display: flex;
|
||||
@@ -537,9 +537,9 @@ import { SnapshotSelectorComponent } from './snapshot-selector.component';
|
||||
font-size: 0.8125rem;
|
||||
}
|
||||
|
||||
.created-by { font-size: 0.6875rem; color: #64748b; }
|
||||
.notes-text { font-size: 0.8125rem; color: #94a3b8; }
|
||||
.no-notes { color: #475569; }
|
||||
.created-by { font-size: 0.6875rem; color: #6B5A2E; }
|
||||
.notes-text { font-size: 0.8125rem; color: #D4C9A8; }
|
||||
.no-notes { color: #6B5A2E; }
|
||||
|
||||
.action-buttons {
|
||||
display: flex;
|
||||
@@ -554,15 +554,15 @@ import { SnapshotSelectorComponent } from './snapshot-selector.component';
|
||||
height: 28px;
|
||||
padding: 0;
|
||||
background: transparent;
|
||||
border: 1px solid #334155;
|
||||
border: 1px solid #3D2E0A;
|
||||
border-radius: 4px;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
cursor: pointer;
|
||||
transition: all 0.15s;
|
||||
|
||||
&:hover {
|
||||
background: #1f2933;
|
||||
color: #e2e8f0;
|
||||
color: rgba(212, 201, 168, 0.3);
|
||||
}
|
||||
|
||||
&--active {
|
||||
@@ -585,14 +585,14 @@ import { SnapshotSelectorComponent } from './snapshot-selector.component';
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 0.75rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
|
||||
p { margin: 0; font-size: 0.9375rem; }
|
||||
}
|
||||
|
||||
.empty-hint {
|
||||
font-size: 0.8125rem;
|
||||
color: #475569;
|
||||
color: #6B5A2E;
|
||||
max-width: 400px;
|
||||
text-align: center;
|
||||
}
|
||||
@@ -633,7 +633,7 @@ import { SnapshotSelectorComponent } from './snapshot-selector.component';
|
||||
height: 32px;
|
||||
background: #1f2933;
|
||||
border-radius: 6px;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
@@ -644,12 +644,12 @@ import { SnapshotSelectorComponent } from './snapshot-selector.component';
|
||||
|
||||
strong {
|
||||
font-size: 0.8125rem;
|
||||
color: #e2e8f0;
|
||||
color: rgba(212, 201, 168, 0.3);
|
||||
}
|
||||
|
||||
span {
|
||||
font-size: 0.75rem;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
line-height: 1.4;
|
||||
}
|
||||
}
|
||||
@@ -689,10 +689,10 @@ import { SnapshotSelectorComponent } from './snapshot-selector.component';
|
||||
padding: 0;
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
cursor: pointer;
|
||||
|
||||
&:hover { color: #e2e8f0; }
|
||||
&:hover { color: rgba(212, 201, 168, 0.3); }
|
||||
}
|
||||
|
||||
.modal-body {
|
||||
@@ -717,17 +717,17 @@ import { SnapshotSelectorComponent } from './snapshot-selector.component';
|
||||
label {
|
||||
font-size: 0.8125rem;
|
||||
font-weight: 500;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
}
|
||||
}
|
||||
|
||||
.form-select,
|
||||
.form-input {
|
||||
padding: 0.625rem 1rem;
|
||||
background: #0f172a;
|
||||
border: 1px solid #334155;
|
||||
background: #1C1200;
|
||||
border: 1px solid #3D2E0A;
|
||||
border-radius: 6px;
|
||||
color: #e2e8f0;
|
||||
color: rgba(212, 201, 168, 0.3);
|
||||
font-size: 0.875rem;
|
||||
|
||||
&:focus {
|
||||
|
||||
@@ -176,7 +176,7 @@ const VIEWPORT_PADDING = 100;
|
||||
markerHeight="6"
|
||||
orient="auto-start-reverse"
|
||||
>
|
||||
<path d="M 0 0 L 10 5 L 0 10 z" fill="#94a3b8" />
|
||||
<path d="M 0 0 L 10 5 L 0 10 z" fill="#D4C9A8" />
|
||||
</marker>
|
||||
<marker
|
||||
id="arrow-vuln"
|
||||
@@ -311,7 +311,7 @@ const VIEWPORT_PADDING = 100;
|
||||
[attr.x]="32"
|
||||
[attr.y]="node.height / 2 + 12"
|
||||
font-size="10"
|
||||
fill="#64748b"
|
||||
fill="#6B5A2E"
|
||||
>
|
||||
{{ node.version || node.severity || '' }}
|
||||
</text>
|
||||
@@ -402,7 +402,7 @@ const VIEWPORT_PADDING = 100;
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 600px;
|
||||
background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
|
||||
background: linear-gradient(135deg, #FFFCF5 0%, #FFF9ED 100%);
|
||||
border-radius: 0.75rem;
|
||||
overflow: hidden;
|
||||
cursor: grab;
|
||||
@@ -446,7 +446,7 @@ const VIEWPORT_PADDING = 100;
|
||||
justify-content: center;
|
||||
border: none;
|
||||
background: transparent;
|
||||
color: #475569;
|
||||
color: #6B5A2E;
|
||||
font-size: 1rem;
|
||||
font-weight: 600;
|
||||
cursor: pointer;
|
||||
@@ -454,8 +454,8 @@ const VIEWPORT_PADDING = 100;
|
||||
transition: all 0.15s ease;
|
||||
|
||||
&:hover {
|
||||
background: #f1f5f9;
|
||||
color: #1e293b;
|
||||
background: #FFF9ED;
|
||||
color: #3D2E0A;
|
||||
}
|
||||
|
||||
&:focus-visible {
|
||||
@@ -474,7 +474,7 @@ const VIEWPORT_PADDING = 100;
|
||||
min-width: 48px;
|
||||
text-align: center;
|
||||
font-size: 0.75rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
font-variant-numeric: tabular-nums;
|
||||
}
|
||||
|
||||
@@ -495,20 +495,20 @@ const VIEWPORT_PADDING = 100;
|
||||
padding: 0.5rem 0.75rem;
|
||||
border: none;
|
||||
background: transparent;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
font-size: 0.75rem;
|
||||
font-weight: 500;
|
||||
cursor: pointer;
|
||||
transition: all 0.15s ease;
|
||||
|
||||
&:hover {
|
||||
background: #f1f5f9;
|
||||
color: #1e293b;
|
||||
background: #FFF9ED;
|
||||
color: #3D2E0A;
|
||||
}
|
||||
|
||||
&--active {
|
||||
background: #F5A623;
|
||||
color: white;
|
||||
color: #1C1200;
|
||||
|
||||
&:hover {
|
||||
background: #E09115;
|
||||
@@ -533,18 +533,18 @@ const VIEWPORT_PADDING = 100;
|
||||
padding: 0.375rem 0.75rem;
|
||||
border-radius: 0.375rem;
|
||||
font-size: 0.6875rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
.canvas-info__sep {
|
||||
color: #cbd5e1;
|
||||
color: rgba(212, 201, 168, 0.5);
|
||||
}
|
||||
|
||||
/* Edges */
|
||||
.edge {
|
||||
fill: none;
|
||||
stroke: #94a3b8;
|
||||
stroke: #D4C9A8;
|
||||
stroke-width: 1.5;
|
||||
transition: stroke 0.15s ease, stroke-width 0.15s ease;
|
||||
|
||||
@@ -610,7 +610,7 @@ const VIEWPORT_PADDING = 100;
|
||||
}
|
||||
|
||||
.node-name {
|
||||
fill: #1e293b;
|
||||
fill: #3D2E0A;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
@@ -1155,7 +1155,7 @@ export class GraphCanvasComponent implements OnChanges, AfterViewInit, OnDestroy
|
||||
case 'asset': return '#93c5fd';
|
||||
case 'component': return '#86efac';
|
||||
case 'vulnerability': return '#fca5a5';
|
||||
default: return '#e2e8f0';
|
||||
default: return 'rgba(212, 201, 168, 0.3)';
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1165,7 +1165,7 @@ export class GraphCanvasComponent implements OnChanges, AfterViewInit, OnDestroy
|
||||
case 'high': return '#ea580c';
|
||||
case 'medium': return '#ca8a04';
|
||||
case 'low': return '#16a34a';
|
||||
default: return '#94a3b8';
|
||||
default: return '#D4C9A8';
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1188,7 +1188,7 @@ export class GraphCanvasComponent implements OnChanges, AfterViewInit, OnDestroy
|
||||
case 'reachable':
|
||||
return '#22c55e';
|
||||
case 'unreachable':
|
||||
return '#94a3b8';
|
||||
return '#D4C9A8';
|
||||
default:
|
||||
return '#f59e0b';
|
||||
}
|
||||
@@ -1199,7 +1199,7 @@ export class GraphCanvasComponent implements OnChanges, AfterViewInit, OnDestroy
|
||||
case 'asset': return '#3b82f6';
|
||||
case 'component': return '#22c55e';
|
||||
case 'vulnerability': return '#ef4444';
|
||||
default: return '#94a3b8';
|
||||
default: return '#D4C9A8';
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -402,8 +402,8 @@ const MOCK_SAVED_VIEWS: SavedView[] = [
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
padding: 0.625rem 0.75rem;
|
||||
background: #f8fafc;
|
||||
border: 1px solid #e2e8f0;
|
||||
background: #FFFCF5;
|
||||
border: 1px solid rgba(212, 201, 168, 0.3);
|
||||
border-radius: 0.5rem;
|
||||
transition: border-color 0.15s ease;
|
||||
|
||||
@@ -414,7 +414,7 @@ const MOCK_SAVED_VIEWS: SavedView[] = [
|
||||
|
||||
.search-icon {
|
||||
font-size: 1rem;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
}
|
||||
|
||||
.search-input {
|
||||
@@ -422,10 +422,10 @@ const MOCK_SAVED_VIEWS: SavedView[] = [
|
||||
border: none;
|
||||
background: transparent;
|
||||
font-size: 0.875rem;
|
||||
color: #1e293b;
|
||||
color: #3D2E0A;
|
||||
|
||||
&::placeholder {
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
}
|
||||
|
||||
&:focus {
|
||||
@@ -440,20 +440,20 @@ const MOCK_SAVED_VIEWS: SavedView[] = [
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
border: none;
|
||||
background: #e2e8f0;
|
||||
color: #64748b;
|
||||
background: rgba(212, 201, 168, 0.3);
|
||||
color: #6B5A2E;
|
||||
border-radius: 50%;
|
||||
font-size: 0.875rem;
|
||||
cursor: pointer;
|
||||
|
||||
&:hover {
|
||||
background: #cbd5e1;
|
||||
background: rgba(212, 201, 168, 0.5);
|
||||
}
|
||||
}
|
||||
|
||||
.search-results-count {
|
||||
font-size: 0.75rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
padding-left: 0.25rem;
|
||||
}
|
||||
|
||||
@@ -462,14 +462,14 @@ const MOCK_SAVED_VIEWS: SavedView[] = [
|
||||
margin: 0 0 0.5rem;
|
||||
font-size: 0.6875rem;
|
||||
font-weight: 600;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.05em;
|
||||
}
|
||||
|
||||
.filter-section {
|
||||
padding-top: 0.75rem;
|
||||
border-top: 1px solid #f1f5f9;
|
||||
border-top: 1px solid #FFF9ED;
|
||||
}
|
||||
|
||||
/* Quick filters */
|
||||
@@ -485,10 +485,10 @@ const MOCK_SAVED_VIEWS: SavedView[] = [
|
||||
|
||||
.quick-chip {
|
||||
padding: 0.375rem 0.625rem;
|
||||
border: 1px solid #e2e8f0;
|
||||
border: 1px solid rgba(212, 201, 168, 0.3);
|
||||
border-radius: 9999px;
|
||||
background: white;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
font-size: 0.75rem;
|
||||
cursor: pointer;
|
||||
transition: all 0.15s ease;
|
||||
@@ -501,7 +501,7 @@ const MOCK_SAVED_VIEWS: SavedView[] = [
|
||||
&--active {
|
||||
background: #F5A623;
|
||||
border-color: #F5A623;
|
||||
color: white;
|
||||
color: #1C1200;
|
||||
|
||||
&:hover {
|
||||
background: #E09115;
|
||||
@@ -528,7 +528,7 @@ const MOCK_SAVED_VIEWS: SavedView[] = [
|
||||
align-items: center;
|
||||
gap: 0.375rem;
|
||||
font-size: 0.8125rem;
|
||||
color: #475569;
|
||||
color: #6B5A2E;
|
||||
cursor: pointer;
|
||||
|
||||
input {
|
||||
@@ -620,7 +620,7 @@ const MOCK_SAVED_VIEWS: SavedView[] = [
|
||||
align-items: center;
|
||||
gap: 0.375rem;
|
||||
font-size: 0.8125rem;
|
||||
color: #475569;
|
||||
color: #6B5A2E;
|
||||
cursor: pointer;
|
||||
|
||||
input {
|
||||
@@ -633,7 +633,7 @@ const MOCK_SAVED_VIEWS: SavedView[] = [
|
||||
/* Active filters */
|
||||
.active-filters {
|
||||
padding: 0.625rem;
|
||||
background: #f8fafc;
|
||||
background: #FFFCF5;
|
||||
border-radius: 0.375rem;
|
||||
}
|
||||
|
||||
@@ -642,7 +642,7 @@ const MOCK_SAVED_VIEWS: SavedView[] = [
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
font-size: 0.75rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
}
|
||||
|
||||
.clear-all-btn {
|
||||
@@ -661,7 +661,7 @@ const MOCK_SAVED_VIEWS: SavedView[] = [
|
||||
/* Saved views */
|
||||
.saved-views-section {
|
||||
padding-top: 0.75rem;
|
||||
border-top: 1px solid #f1f5f9;
|
||||
border-top: 1px solid #FFF9ED;
|
||||
}
|
||||
|
||||
.saved-views__header {
|
||||
@@ -673,10 +673,10 @@ const MOCK_SAVED_VIEWS: SavedView[] = [
|
||||
|
||||
.save-view-btn {
|
||||
padding: 0.25rem 0.5rem;
|
||||
border: 1px solid #e2e8f0;
|
||||
border: 1px solid rgba(212, 201, 168, 0.3);
|
||||
border-radius: 0.25rem;
|
||||
background: white;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
font-size: 0.6875rem;
|
||||
cursor: pointer;
|
||||
|
||||
@@ -709,14 +709,14 @@ const MOCK_SAVED_VIEWS: SavedView[] = [
|
||||
border: 1px solid transparent;
|
||||
border-radius: 0.25rem;
|
||||
background: transparent;
|
||||
color: #475569;
|
||||
color: #6B5A2E;
|
||||
font-size: 0.8125rem;
|
||||
text-align: left;
|
||||
cursor: pointer;
|
||||
|
||||
&:hover {
|
||||
background: #f1f5f9;
|
||||
border-color: #e2e8f0;
|
||||
background: #FFF9ED;
|
||||
border-color: rgba(212, 201, 168, 0.3);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -725,7 +725,7 @@ const MOCK_SAVED_VIEWS: SavedView[] = [
|
||||
height: 20px;
|
||||
border: none;
|
||||
background: transparent;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
font-size: 1rem;
|
||||
cursor: pointer;
|
||||
opacity: 0;
|
||||
@@ -743,7 +743,7 @@ const MOCK_SAVED_VIEWS: SavedView[] = [
|
||||
.saved-views__empty {
|
||||
padding: 0.5rem;
|
||||
font-size: 0.75rem;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
@@ -753,7 +753,7 @@ const MOCK_SAVED_VIEWS: SavedView[] = [
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
padding-top: 0.75rem;
|
||||
border-top: 1px solid #f1f5f9;
|
||||
border-top: 1px solid #FFF9ED;
|
||||
}
|
||||
|
||||
.share-btn {
|
||||
@@ -761,10 +761,10 @@ const MOCK_SAVED_VIEWS: SavedView[] = [
|
||||
align-items: center;
|
||||
gap: 0.375rem;
|
||||
padding: 0.5rem 0.75rem;
|
||||
border: 1px solid #e2e8f0;
|
||||
border: 1px solid rgba(212, 201, 168, 0.3);
|
||||
border-radius: 0.375rem;
|
||||
background: white;
|
||||
color: #475569;
|
||||
color: #6B5A2E;
|
||||
font-size: 0.8125rem;
|
||||
cursor: pointer;
|
||||
|
||||
@@ -820,7 +820,7 @@ const MOCK_SAVED_VIEWS: SavedView[] = [
|
||||
margin: 0 0 1rem;
|
||||
font-size: 1rem;
|
||||
font-weight: 600;
|
||||
color: #1e293b;
|
||||
color: #3D2E0A;
|
||||
}
|
||||
|
||||
.modal__body {
|
||||
@@ -832,15 +832,15 @@ const MOCK_SAVED_VIEWS: SavedView[] = [
|
||||
flex-direction: column;
|
||||
gap: 0.375rem;
|
||||
font-size: 0.8125rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
}
|
||||
|
||||
.modal__input {
|
||||
padding: 0.625rem 0.75rem;
|
||||
border: 1px solid #e2e8f0;
|
||||
border: 1px solid rgba(212, 201, 168, 0.3);
|
||||
border-radius: 0.375rem;
|
||||
font-size: 0.875rem;
|
||||
color: #1e293b;
|
||||
color: #3D2E0A;
|
||||
|
||||
&:focus {
|
||||
outline: none;
|
||||
@@ -863,17 +863,17 @@ const MOCK_SAVED_VIEWS: SavedView[] = [
|
||||
cursor: pointer;
|
||||
|
||||
&--secondary {
|
||||
background: #f1f5f9;
|
||||
color: #64748b;
|
||||
background: #FFF9ED;
|
||||
color: #6B5A2E;
|
||||
|
||||
&:hover {
|
||||
background: #e2e8f0;
|
||||
background: rgba(212, 201, 168, 0.3);
|
||||
}
|
||||
}
|
||||
|
||||
&--primary {
|
||||
background: #F5A623;
|
||||
color: white;
|
||||
color: #1C1200;
|
||||
|
||||
&:hover:not(:disabled) {
|
||||
background: #E09115;
|
||||
|
||||
@@ -126,15 +126,15 @@ import { GraphAccessibilityService, HotkeyBinding } from './graph-accessibility.
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 1rem 1.25rem;
|
||||
border-bottom: 1px solid #e2e8f0;
|
||||
background: #f8fafc;
|
||||
border-bottom: 1px solid rgba(212, 201, 168, 0.3);
|
||||
background: #FFFCF5;
|
||||
}
|
||||
|
||||
.hotkey-help__title {
|
||||
margin: 0;
|
||||
font-size: 1.125rem;
|
||||
font-weight: 600;
|
||||
color: #1e293b;
|
||||
color: #3D2E0A;
|
||||
}
|
||||
|
||||
.hotkey-help__close {
|
||||
@@ -145,14 +145,14 @@ import { GraphAccessibilityService, HotkeyBinding } from './graph-accessibility.
|
||||
height: 32px;
|
||||
border: none;
|
||||
background: transparent;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
font-size: 1.5rem;
|
||||
cursor: pointer;
|
||||
border-radius: 0.375rem;
|
||||
|
||||
&:hover {
|
||||
background: #e2e8f0;
|
||||
color: #1e293b;
|
||||
background: rgba(212, 201, 168, 0.3);
|
||||
color: #3D2E0A;
|
||||
}
|
||||
|
||||
&:focus-visible {
|
||||
@@ -179,7 +179,7 @@ import { GraphAccessibilityService, HotkeyBinding } from './graph-accessibility.
|
||||
margin: 0 0 0.5rem;
|
||||
font-size: 0.6875rem;
|
||||
font-weight: 600;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.05em;
|
||||
}
|
||||
@@ -204,30 +204,30 @@ import { GraphAccessibilityService, HotkeyBinding } from './graph-accessibility.
|
||||
min-width: 28px;
|
||||
height: 24px;
|
||||
padding: 0 0.5rem;
|
||||
background: #f1f5f9;
|
||||
border: 1px solid #e2e8f0;
|
||||
background: #FFF9ED;
|
||||
border: 1px solid rgba(212, 201, 168, 0.3);
|
||||
border-radius: 0.25rem;
|
||||
font-family: ui-monospace, monospace;
|
||||
font-size: 0.6875rem;
|
||||
color: #475569;
|
||||
color: #6B5A2E;
|
||||
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
|
||||
}
|
||||
|
||||
.hotkey-description {
|
||||
font-size: 0.8125rem;
|
||||
color: #475569;
|
||||
color: #6B5A2E;
|
||||
}
|
||||
|
||||
.hotkey-help__footer {
|
||||
padding: 0.75rem 1.25rem;
|
||||
border-top: 1px solid #e2e8f0;
|
||||
background: #f8fafc;
|
||||
border-top: 1px solid rgba(212, 201, 168, 0.3);
|
||||
background: #FFFCF5;
|
||||
}
|
||||
|
||||
.hotkey-help__hint {
|
||||
margin: 0;
|
||||
font-size: 0.75rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
text-align: center;
|
||||
|
||||
kbd {
|
||||
@@ -238,7 +238,7 @@ import { GraphAccessibilityService, HotkeyBinding } from './graph-accessibility.
|
||||
height: 18px;
|
||||
padding: 0 0.375rem;
|
||||
background: white;
|
||||
border: 1px solid #e2e8f0;
|
||||
border: 1px solid rgba(212, 201, 168, 0.3);
|
||||
border-radius: 0.25rem;
|
||||
font-family: ui-monospace, monospace;
|
||||
font-size: 0.625rem;
|
||||
|
||||
@@ -596,10 +596,10 @@ function generateMockReachabilityData(nodeIds: string[], snapshot: string): Map<
|
||||
align-items: center;
|
||||
gap: 0.375rem;
|
||||
padding: 0.5rem 0.75rem;
|
||||
border: 1px solid #e2e8f0;
|
||||
border: 1px solid rgba(212, 201, 168, 0.3);
|
||||
border-radius: 0.5rem;
|
||||
background: white;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
font-size: 0.8125rem;
|
||||
cursor: pointer;
|
||||
transition: all 0.15s ease;
|
||||
@@ -607,7 +607,7 @@ function generateMockReachabilityData(nodeIds: string[], snapshot: string): Map<
|
||||
|
||||
&:hover {
|
||||
border-color: var(--overlay-color, #F5A623);
|
||||
color: #1e293b;
|
||||
color: #3D2E0A;
|
||||
}
|
||||
|
||||
&--active {
|
||||
@@ -643,7 +643,7 @@ function generateMockReachabilityData(nodeIds: string[], snapshot: string): Map<
|
||||
align-items: center;
|
||||
gap: 0.75rem;
|
||||
padding: 0.5rem 0;
|
||||
border-top: 1px solid #f1f5f9;
|
||||
border-top: 1px solid #FFF9ED;
|
||||
}
|
||||
|
||||
.simulation-toggle__label {
|
||||
@@ -651,7 +651,7 @@ function generateMockReachabilityData(nodeIds: string[], snapshot: string): Map<
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
font-size: 0.8125rem;
|
||||
color: #475569;
|
||||
color: #6B5A2E;
|
||||
cursor: pointer;
|
||||
|
||||
input {
|
||||
@@ -683,7 +683,7 @@ function generateMockReachabilityData(nodeIds: string[], snapshot: string): Map<
|
||||
flex-wrap: wrap;
|
||||
gap: 1rem;
|
||||
padding: 0.75rem;
|
||||
background: #f8fafc;
|
||||
background: #FFFCF5;
|
||||
border-radius: 0.5rem;
|
||||
}
|
||||
|
||||
@@ -696,7 +696,7 @@ function generateMockReachabilityData(nodeIds: string[], snapshot: string): Map<
|
||||
margin: 0 0 0.5rem;
|
||||
font-size: 0.6875rem;
|
||||
font-weight: 600;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.05em;
|
||||
}
|
||||
@@ -712,7 +712,7 @@ function generateMockReachabilityData(nodeIds: string[], snapshot: string): Map<
|
||||
align-items: center;
|
||||
gap: 0.375rem;
|
||||
font-size: 0.75rem;
|
||||
color: #475569;
|
||||
color: #6B5A2E;
|
||||
}
|
||||
|
||||
.legend-dot {
|
||||
@@ -723,11 +723,11 @@ function generateMockReachabilityData(nodeIds: string[], snapshot: string): Map<
|
||||
&--pass { background: #22c55e; }
|
||||
&--warn { background: #f59e0b; }
|
||||
&--block { background: #ef4444; }
|
||||
&--unknown { background: #94a3b8; }
|
||||
&--unknown { background: #D4C9A8; }
|
||||
|
||||
&--evidence-high { background: #3b82f6; }
|
||||
&--evidence-medium { background: #60a5fa; }
|
||||
&--evidence-none { background: #cbd5e1; }
|
||||
&--evidence-none { background: rgba(212, 201, 168, 0.5); }
|
||||
|
||||
&--license-permissive { background: #22c55e; }
|
||||
&--license-copyleft { background: #f59e0b; }
|
||||
@@ -738,14 +738,14 @@ function generateMockReachabilityData(nodeIds: string[], snapshot: string): Map<
|
||||
&--exposure-isolated { background: #22c55e; }
|
||||
|
||||
&--reachability-reachable { background: #22c55e; }
|
||||
&--reachability-unreachable { background: #94a3b8; }
|
||||
&--reachability-unreachable { background: #D4C9A8; }
|
||||
&--reachability-unknown { background: #f59e0b; }
|
||||
}
|
||||
|
||||
/* Overlay details */
|
||||
.overlay-details {
|
||||
padding: 0.75rem;
|
||||
background: #f8fafc;
|
||||
background: #FFFCF5;
|
||||
border-radius: 0.5rem;
|
||||
}
|
||||
|
||||
@@ -753,7 +753,7 @@ function generateMockReachabilityData(nodeIds: string[], snapshot: string): Map<
|
||||
margin: 0 0 0.75rem;
|
||||
font-size: 0.75rem;
|
||||
font-weight: 600;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.05em;
|
||||
}
|
||||
@@ -761,7 +761,7 @@ function generateMockReachabilityData(nodeIds: string[], snapshot: string): Map<
|
||||
.overlay-detail-card {
|
||||
padding: 0.625rem;
|
||||
background: white;
|
||||
border: 1px solid #e2e8f0;
|
||||
border: 1px solid rgba(212, 201, 168, 0.3);
|
||||
border-radius: 0.375rem;
|
||||
margin-bottom: 0.5rem;
|
||||
|
||||
@@ -784,14 +784,14 @@ function generateMockReachabilityData(nodeIds: string[], snapshot: string): Map<
|
||||
flex: 1;
|
||||
font-size: 0.8125rem;
|
||||
font-weight: 500;
|
||||
color: #1e293b;
|
||||
color: #3D2E0A;
|
||||
}
|
||||
|
||||
.overlay-detail-card__list {
|
||||
margin: 0.5rem 0 0;
|
||||
padding-left: 1.25rem;
|
||||
font-size: 0.75rem;
|
||||
color: #475569;
|
||||
color: #6B5A2E;
|
||||
|
||||
li {
|
||||
margin-bottom: 0.25rem;
|
||||
@@ -801,7 +801,7 @@ function generateMockReachabilityData(nodeIds: string[], snapshot: string): Map<
|
||||
.overlay-detail-card__info {
|
||||
margin-top: 0.375rem;
|
||||
font-size: 0.75rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
}
|
||||
|
||||
.overlay-detail-card__warning {
|
||||
@@ -816,8 +816,8 @@ function generateMockReachabilityData(nodeIds: string[], snapshot: string): Map<
|
||||
font-size: 0.6875rem;
|
||||
font-weight: 500;
|
||||
text-transform: capitalize;
|
||||
background: #f1f5f9;
|
||||
color: #64748b;
|
||||
background: #FFF9ED;
|
||||
color: #6B5A2E;
|
||||
|
||||
&--pass {
|
||||
background: #dcfce7;
|
||||
@@ -835,8 +835,8 @@ function generateMockReachabilityData(nodeIds: string[], snapshot: string): Map<
|
||||
}
|
||||
|
||||
&--none {
|
||||
background: #f1f5f9;
|
||||
color: #94a3b8;
|
||||
background: #FFF9ED;
|
||||
color: #D4C9A8;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -852,7 +852,7 @@ function generateMockReachabilityData(nodeIds: string[], snapshot: string): Map<
|
||||
/* Path view */
|
||||
.path-view-section {
|
||||
padding-top: 0.75rem;
|
||||
border-top: 1px solid #f1f5f9;
|
||||
border-top: 1px solid #FFF9ED;
|
||||
}
|
||||
|
||||
.path-view-btn {
|
||||
@@ -860,17 +860,17 @@ function generateMockReachabilityData(nodeIds: string[], snapshot: string): Map<
|
||||
align-items: center;
|
||||
gap: 0.375rem;
|
||||
padding: 0.5rem 0.75rem;
|
||||
border: 1px solid #e2e8f0;
|
||||
border: 1px solid rgba(212, 201, 168, 0.3);
|
||||
border-radius: 0.5rem;
|
||||
background: white;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
font-size: 0.8125rem;
|
||||
cursor: pointer;
|
||||
transition: all 0.15s ease;
|
||||
|
||||
&:hover {
|
||||
border-color: #F5A623;
|
||||
color: #1e293b;
|
||||
color: #3D2E0A;
|
||||
}
|
||||
|
||||
&--active {
|
||||
@@ -886,7 +886,7 @@ function generateMockReachabilityData(nodeIds: string[], snapshot: string): Map<
|
||||
gap: 0.75rem;
|
||||
margin-top: 0.5rem;
|
||||
padding: 0.5rem;
|
||||
background: #f8fafc;
|
||||
background: #FFFCF5;
|
||||
border-radius: 0.375rem;
|
||||
|
||||
label {
|
||||
@@ -894,7 +894,7 @@ function generateMockReachabilityData(nodeIds: string[], snapshot: string): Map<
|
||||
align-items: center;
|
||||
gap: 0.375rem;
|
||||
font-size: 0.75rem;
|
||||
color: #475569;
|
||||
color: #6B5A2E;
|
||||
cursor: pointer;
|
||||
|
||||
input {
|
||||
@@ -908,7 +908,7 @@ function generateMockReachabilityData(nodeIds: string[], snapshot: string): Map<
|
||||
/* Time travel */
|
||||
.time-travel-section {
|
||||
padding-top: 0.75rem;
|
||||
border-top: 1px solid #f1f5f9;
|
||||
border-top: 1px solid #FFF9ED;
|
||||
}
|
||||
|
||||
.time-travel-btn {
|
||||
@@ -916,17 +916,17 @@ function generateMockReachabilityData(nodeIds: string[], snapshot: string): Map<
|
||||
align-items: center;
|
||||
gap: 0.375rem;
|
||||
padding: 0.5rem 0.75rem;
|
||||
border: 1px solid #e2e8f0;
|
||||
border: 1px solid rgba(212, 201, 168, 0.3);
|
||||
border-radius: 0.5rem;
|
||||
background: white;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
font-size: 0.8125rem;
|
||||
cursor: pointer;
|
||||
transition: all 0.15s ease;
|
||||
|
||||
&:hover {
|
||||
border-color: #7c3aed;
|
||||
color: #1e293b;
|
||||
color: #3D2E0A;
|
||||
}
|
||||
|
||||
&--active {
|
||||
@@ -942,7 +942,7 @@ function generateMockReachabilityData(nodeIds: string[], snapshot: string): Map<
|
||||
gap: 0.5rem;
|
||||
margin-top: 0.5rem;
|
||||
padding: 0.5rem;
|
||||
background: #f8fafc;
|
||||
background: #FFFCF5;
|
||||
border-radius: 0.375rem;
|
||||
}
|
||||
|
||||
@@ -958,13 +958,13 @@ function generateMockReachabilityData(nodeIds: string[], snapshot: string): Map<
|
||||
|
||||
.time-slider__label {
|
||||
font-size: 0.75rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.time-travel-select {
|
||||
padding: 0.375rem 0.5rem;
|
||||
border: 1px solid #e2e8f0;
|
||||
border: 1px solid rgba(212, 201, 168, 0.3);
|
||||
border-radius: 0.375rem;
|
||||
font-size: 0.75rem;
|
||||
background: white;
|
||||
@@ -978,10 +978,10 @@ function generateMockReachabilityData(nodeIds: string[], snapshot: string): Map<
|
||||
|
||||
.diff-btn {
|
||||
padding: 0.375rem 0.625rem;
|
||||
border: 1px solid #e2e8f0;
|
||||
border: 1px solid rgba(212, 201, 168, 0.3);
|
||||
border-radius: 0.375rem;
|
||||
background: white;
|
||||
color: #475569;
|
||||
color: #6B5A2E;
|
||||
font-size: 0.75rem;
|
||||
cursor: pointer;
|
||||
transition: all 0.15s ease;
|
||||
|
||||
@@ -588,8 +588,8 @@ function generateMockDiff(): SbomDiff {
|
||||
/* Tabs */
|
||||
.panel-tabs {
|
||||
display: flex;
|
||||
border-bottom: 1px solid #e2e8f0;
|
||||
background: #f8fafc;
|
||||
border-bottom: 1px solid rgba(212, 201, 168, 0.3);
|
||||
background: #FFFCF5;
|
||||
}
|
||||
|
||||
.panel-tab {
|
||||
@@ -597,7 +597,7 @@ function generateMockDiff(): SbomDiff {
|
||||
padding: 0.75rem 0.5rem;
|
||||
border: none;
|
||||
background: transparent;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
font-size: 0.8125rem;
|
||||
font-weight: 500;
|
||||
cursor: pointer;
|
||||
@@ -605,8 +605,8 @@ function generateMockDiff(): SbomDiff {
|
||||
position: relative;
|
||||
|
||||
&:hover {
|
||||
color: #1e293b;
|
||||
background: #f1f5f9;
|
||||
color: #3D2E0A;
|
||||
background: #FFF9ED;
|
||||
}
|
||||
|
||||
&--active {
|
||||
@@ -653,19 +653,19 @@ function generateMockDiff(): SbomDiff {
|
||||
margin: 0;
|
||||
font-size: 1rem;
|
||||
font-weight: 600;
|
||||
color: #1e293b;
|
||||
color: #3D2E0A;
|
||||
}
|
||||
|
||||
.details-header__type {
|
||||
font-size: 0.75rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
text-transform: capitalize;
|
||||
}
|
||||
|
||||
.details-section {
|
||||
margin-bottom: 1rem;
|
||||
padding-bottom: 0.75rem;
|
||||
border-bottom: 1px solid #f1f5f9;
|
||||
border-bottom: 1px solid #FFF9ED;
|
||||
|
||||
&:last-child {
|
||||
margin-bottom: 0;
|
||||
@@ -678,7 +678,7 @@ function generateMockDiff(): SbomDiff {
|
||||
margin: 0 0 0.375rem;
|
||||
font-size: 0.6875rem;
|
||||
font-weight: 600;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.05em;
|
||||
}
|
||||
@@ -686,7 +686,7 @@ function generateMockDiff(): SbomDiff {
|
||||
.purl-display {
|
||||
display: block;
|
||||
padding: 0.5rem;
|
||||
background: #f8fafc;
|
||||
background: #FFFCF5;
|
||||
border-radius: 0.25rem;
|
||||
font-size: 0.75rem;
|
||||
font-family: ui-monospace, monospace;
|
||||
@@ -696,10 +696,10 @@ function generateMockDiff(): SbomDiff {
|
||||
|
||||
.copy-btn {
|
||||
padding: 0.25rem 0.5rem;
|
||||
border: 1px solid #e2e8f0;
|
||||
border: 1px solid rgba(212, 201, 168, 0.3);
|
||||
border-radius: 0.25rem;
|
||||
background: white;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
font-size: 0.6875rem;
|
||||
cursor: pointer;
|
||||
|
||||
@@ -711,13 +711,13 @@ function generateMockDiff(): SbomDiff {
|
||||
|
||||
.details-value {
|
||||
font-size: 0.875rem;
|
||||
color: #1e293b;
|
||||
color: #3D2E0A;
|
||||
}
|
||||
|
||||
.details-description {
|
||||
margin: 0;
|
||||
font-size: 0.8125rem;
|
||||
color: #475569;
|
||||
color: #6B5A2E;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
@@ -732,13 +732,13 @@ function generateMockDiff(): SbomDiff {
|
||||
margin-bottom: 0.25rem;
|
||||
|
||||
dt {
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
min-width: 80px;
|
||||
}
|
||||
|
||||
dd {
|
||||
margin: 0;
|
||||
color: #1e293b;
|
||||
color: #3D2E0A;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -768,7 +768,7 @@ function generateMockDiff(): SbomDiff {
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
padding: 0.5rem;
|
||||
border: 1px solid #e2e8f0;
|
||||
border: 1px solid rgba(212, 201, 168, 0.3);
|
||||
border-radius: 0.375rem;
|
||||
background: white;
|
||||
cursor: pointer;
|
||||
@@ -777,7 +777,7 @@ function generateMockDiff(): SbomDiff {
|
||||
|
||||
&:hover {
|
||||
border-color: #F5A623;
|
||||
background: #f8fafc;
|
||||
background: #FFFCF5;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -788,12 +788,12 @@ function generateMockDiff(): SbomDiff {
|
||||
.related-item__name {
|
||||
flex: 1;
|
||||
font-size: 0.8125rem;
|
||||
color: #1e293b;
|
||||
color: #3D2E0A;
|
||||
}
|
||||
|
||||
.related-item__relation {
|
||||
font-size: 0.6875rem;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
}
|
||||
|
||||
/* Severity badge */
|
||||
@@ -834,20 +834,20 @@ function generateMockDiff(): SbomDiff {
|
||||
margin: 0 0 0.25rem;
|
||||
font-size: 1rem;
|
||||
font-weight: 600;
|
||||
color: #1e293b;
|
||||
color: #3D2E0A;
|
||||
}
|
||||
|
||||
.whatif-description {
|
||||
margin: 0;
|
||||
font-size: 0.8125rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
}
|
||||
|
||||
.scenarios-title {
|
||||
margin: 0 0 0.5rem;
|
||||
font-size: 0.6875rem;
|
||||
font-weight: 600;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.05em;
|
||||
}
|
||||
@@ -860,7 +860,7 @@ function generateMockDiff(): SbomDiff {
|
||||
|
||||
.scenario-card {
|
||||
padding: 0.75rem;
|
||||
border: 1px solid #e2e8f0;
|
||||
border: 1px solid rgba(212, 201, 168, 0.3);
|
||||
border-radius: 0.5rem;
|
||||
cursor: pointer;
|
||||
transition: all 0.15s ease;
|
||||
@@ -871,7 +871,7 @@ function generateMockDiff(): SbomDiff {
|
||||
|
||||
&--selected {
|
||||
border-color: #F5A623;
|
||||
background: #f8fafc;
|
||||
background: #FFFCF5;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -889,13 +889,13 @@ function generateMockDiff(): SbomDiff {
|
||||
.scenario-card__name {
|
||||
font-size: 0.8125rem;
|
||||
font-weight: 500;
|
||||
color: #1e293b;
|
||||
color: #3D2E0A;
|
||||
}
|
||||
|
||||
.scenario-card__description {
|
||||
margin: 0 0 0.5rem;
|
||||
font-size: 0.75rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
}
|
||||
|
||||
.scenario-card__impact {
|
||||
@@ -909,8 +909,8 @@ function generateMockDiff(): SbomDiff {
|
||||
border-radius: 0.25rem;
|
||||
font-size: 0.625rem;
|
||||
font-weight: 500;
|
||||
background: #f1f5f9;
|
||||
color: #64748b;
|
||||
background: #FFF9ED;
|
||||
color: #6B5A2E;
|
||||
|
||||
&--positive {
|
||||
background: #dcfce7;
|
||||
@@ -931,7 +931,7 @@ function generateMockDiff(): SbomDiff {
|
||||
.scenario-details {
|
||||
margin-top: 1rem;
|
||||
padding: 0.75rem;
|
||||
background: #f8fafc;
|
||||
background: #FFFCF5;
|
||||
border-radius: 0.5rem;
|
||||
}
|
||||
|
||||
@@ -939,7 +939,7 @@ function generateMockDiff(): SbomDiff {
|
||||
margin: 0 0 0.5rem;
|
||||
font-size: 0.6875rem;
|
||||
font-weight: 600;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.05em;
|
||||
}
|
||||
@@ -958,13 +958,13 @@ function generateMockDiff(): SbomDiff {
|
||||
|
||||
.impact-item__label {
|
||||
font-size: 0.6875rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
}
|
||||
|
||||
.impact-item__value {
|
||||
font-size: 1rem;
|
||||
font-weight: 600;
|
||||
color: #1e293b;
|
||||
color: #3D2E0A;
|
||||
|
||||
&--positive {
|
||||
color: #16a34a;
|
||||
@@ -990,7 +990,7 @@ function generateMockDiff(): SbomDiff {
|
||||
|
||||
&--primary {
|
||||
background: #F5A623;
|
||||
color: white;
|
||||
color: #1C1200;
|
||||
|
||||
&:hover {
|
||||
background: #E09115;
|
||||
@@ -999,8 +999,8 @@ function generateMockDiff(): SbomDiff {
|
||||
|
||||
&--secondary {
|
||||
background: white;
|
||||
border: 1px solid #e2e8f0;
|
||||
color: #475569;
|
||||
border: 1px solid rgba(212, 201, 168, 0.3);
|
||||
color: #6B5A2E;
|
||||
|
||||
&:hover {
|
||||
border-color: #F5A623;
|
||||
@@ -1021,12 +1021,12 @@ function generateMockDiff(): SbomDiff {
|
||||
margin: 0;
|
||||
font-size: 1rem;
|
||||
font-weight: 600;
|
||||
color: #1e293b;
|
||||
color: #3D2E0A;
|
||||
}
|
||||
|
||||
.history-filter {
|
||||
padding: 0.375rem 0.5rem;
|
||||
border: 1px solid #e2e8f0;
|
||||
border: 1px solid rgba(212, 201, 168, 0.3);
|
||||
border-radius: 0.25rem;
|
||||
font-size: 0.75rem;
|
||||
background: white;
|
||||
@@ -1043,7 +1043,7 @@ function generateMockDiff(): SbomDiff {
|
||||
display: flex;
|
||||
gap: 0.75rem;
|
||||
padding: 0.625rem;
|
||||
background: #f8fafc;
|
||||
background: #FFFCF5;
|
||||
border-radius: 0.375rem;
|
||||
}
|
||||
|
||||
@@ -1093,13 +1093,13 @@ function generateMockDiff(): SbomDiff {
|
||||
.history-entry__name {
|
||||
font-size: 0.8125rem;
|
||||
font-weight: 500;
|
||||
color: #1e293b;
|
||||
color: #3D2E0A;
|
||||
}
|
||||
|
||||
.history-entry__details {
|
||||
margin: 0;
|
||||
font-size: 0.75rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
}
|
||||
|
||||
.history-entry__meta {
|
||||
@@ -1107,7 +1107,7 @@ function generateMockDiff(): SbomDiff {
|
||||
gap: 0.5rem;
|
||||
margin-top: 0.25rem;
|
||||
font-size: 0.6875rem;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
}
|
||||
|
||||
/* Diff Panel */
|
||||
@@ -1119,7 +1119,7 @@ function generateMockDiff(): SbomDiff {
|
||||
margin: 0 0 0.5rem;
|
||||
font-size: 1rem;
|
||||
font-weight: 600;
|
||||
color: #1e293b;
|
||||
color: #3D2E0A;
|
||||
}
|
||||
|
||||
.diff-selector {
|
||||
@@ -1130,7 +1130,7 @@ function generateMockDiff(): SbomDiff {
|
||||
|
||||
.diff-select {
|
||||
padding: 0.375rem 0.5rem;
|
||||
border: 1px solid #e2e8f0;
|
||||
border: 1px solid rgba(212, 201, 168, 0.3);
|
||||
border-radius: 0.25rem;
|
||||
font-size: 0.75rem;
|
||||
background: white;
|
||||
@@ -1138,15 +1138,15 @@ function generateMockDiff(): SbomDiff {
|
||||
}
|
||||
|
||||
.diff-arrow {
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
}
|
||||
|
||||
.diff-btn {
|
||||
padding: 0.375rem 0.625rem;
|
||||
border: 1px solid #e2e8f0;
|
||||
border: 1px solid rgba(212, 201, 168, 0.3);
|
||||
border-radius: 0.25rem;
|
||||
background: white;
|
||||
color: #475569;
|
||||
color: #6B5A2E;
|
||||
font-size: 0.75rem;
|
||||
cursor: pointer;
|
||||
|
||||
@@ -1168,7 +1168,7 @@ function generateMockDiff(): SbomDiff {
|
||||
.diff-summary__total {
|
||||
font-size: 0.8125rem;
|
||||
font-weight: 500;
|
||||
color: #475569;
|
||||
color: #6B5A2E;
|
||||
}
|
||||
|
||||
.diff-section {
|
||||
@@ -1239,22 +1239,22 @@ function generateMockDiff(): SbomDiff {
|
||||
.diff-item__name {
|
||||
flex: 1;
|
||||
font-weight: 500;
|
||||
color: #1e293b;
|
||||
color: #3D2E0A;
|
||||
}
|
||||
|
||||
.diff-item__version, .diff-item__versions {
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
font-family: ui-monospace, monospace;
|
||||
}
|
||||
|
||||
.diff-item__type {
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
}
|
||||
|
||||
.diff-empty {
|
||||
padding: 2rem;
|
||||
text-align: center;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
font-size: 0.875rem;
|
||||
}
|
||||
|
||||
@@ -1265,7 +1265,7 @@ function generateMockDiff(): SbomDiff {
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 3rem 1rem;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
|
||||
@@ -274,7 +274,7 @@ import {
|
||||
|
||||
.btn-primary {
|
||||
background: var(--primary-color, #0066cc);
|
||||
color: white;
|
||||
color: #1C1200;
|
||||
border: none;
|
||||
}
|
||||
|
||||
@@ -286,7 +286,7 @@ import {
|
||||
|
||||
.btn-danger {
|
||||
background: #dc3545;
|
||||
color: white;
|
||||
color: #1C1200;
|
||||
border: none;
|
||||
}
|
||||
|
||||
|
||||
@@ -143,7 +143,7 @@ import { IntegrationListResponse, IntegrationType } from './integration.models';
|
||||
|
||||
.btn-primary {
|
||||
background: var(--primary-color, #0066cc);
|
||||
color: white;
|
||||
color: #1C1200;
|
||||
border: none;
|
||||
}
|
||||
|
||||
|
||||
@@ -225,7 +225,7 @@ import {
|
||||
.btn-primary {
|
||||
padding: 0.75rem 1.5rem;
|
||||
background: var(--primary-color, #0066cc);
|
||||
color: white;
|
||||
color: #1C1200;
|
||||
border: none;
|
||||
border-radius: 6px;
|
||||
font-weight: 500;
|
||||
|
||||
@@ -122,7 +122,7 @@ interface IssuerDetail {
|
||||
}
|
||||
|
||||
.back-link {
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
text-decoration: none;
|
||||
font-size: 0.875rem;
|
||||
}
|
||||
@@ -149,7 +149,7 @@ interface IssuerDetail {
|
||||
|
||||
.issuer-detail__desc {
|
||||
font-size: 0.875rem;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
@@ -178,7 +178,7 @@ interface IssuerDetail {
|
||||
|
||||
.detail-section {
|
||||
background: rgba(30, 41, 59, 0.4);
|
||||
border: 1px solid #334155;
|
||||
border: 1px solid #3D2E0A;
|
||||
border-radius: 8px;
|
||||
padding: 1.25rem;
|
||||
margin-bottom: 1rem;
|
||||
@@ -211,7 +211,7 @@ interface IssuerDetail {
|
||||
|
||||
.keys-table th {
|
||||
font-size: 0.75rem;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
text-transform: uppercase;
|
||||
font-weight: 500;
|
||||
}
|
||||
@@ -238,7 +238,7 @@ interface IssuerDetail {
|
||||
.key-revoked { background: rgba(239, 68, 68, 0.15); color: #f87171; }
|
||||
|
||||
.text-muted {
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
}
|
||||
|
||||
.bundle-list {
|
||||
@@ -280,8 +280,8 @@ interface IssuerDetail {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.btn--primary { background: #22d3ee; color: #0f172a; }
|
||||
.btn--secondary { background: #334155; color: #e5e7eb; }
|
||||
.btn--primary { background: #22d3ee; color: #1C1200; }
|
||||
.btn--secondary { background: #3D2E0A; color: #e5e7eb; }
|
||||
.btn--danger { background: rgba(239, 68, 68, 0.15); color: #f87171; }
|
||||
.btn--small { padding: 0.375rem 0.75rem; font-size: 0.75rem; }
|
||||
`],
|
||||
|
||||
@@ -76,7 +76,7 @@ import { ReactiveFormsModule, FormBuilder, Validators } from '@angular/forms';
|
||||
}
|
||||
|
||||
.back-link {
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
text-decoration: none;
|
||||
font-size: 0.875rem;
|
||||
}
|
||||
@@ -90,7 +90,7 @@ import { ReactiveFormsModule, FormBuilder, Validators } from '@angular/forms';
|
||||
|
||||
.form-section {
|
||||
background: rgba(30, 41, 59, 0.4);
|
||||
border: 1px solid #334155;
|
||||
border: 1px solid #3D2E0A;
|
||||
border-radius: 8px;
|
||||
padding: 1.25rem;
|
||||
margin-bottom: 1rem;
|
||||
@@ -110,15 +110,15 @@ import { ReactiveFormsModule, FormBuilder, Validators } from '@angular/forms';
|
||||
.form-group label {
|
||||
display: block;
|
||||
font-size: 0.875rem;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
margin-bottom: 0.375rem;
|
||||
}
|
||||
|
||||
.form-input {
|
||||
width: 100%;
|
||||
padding: 0.5rem 0.75rem;
|
||||
background: #1e293b;
|
||||
border: 1px solid #334155;
|
||||
background: #3D2E0A;
|
||||
border: 1px solid #3D2E0A;
|
||||
border-radius: 6px;
|
||||
color: #e5e7eb;
|
||||
font-size: 0.875rem;
|
||||
@@ -157,8 +157,8 @@ import { ReactiveFormsModule, FormBuilder, Validators } from '@angular/forms';
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
.btn--primary { background: #22d3ee; color: #0f172a; }
|
||||
.btn--secondary { background: #334155; color: #e5e7eb; }
|
||||
.btn--primary { background: #22d3ee; color: #1C1200; }
|
||||
.btn--secondary { background: #3D2E0A; color: #e5e7eb; }
|
||||
`],
|
||||
})
|
||||
export class IssuerEditorComponent {
|
||||
|
||||
@@ -122,8 +122,8 @@ interface Issuer {
|
||||
|
||||
.search-input, .filter-select {
|
||||
padding: 0.5rem 1rem;
|
||||
background: #1e293b;
|
||||
border: 1px solid #334155;
|
||||
background: #3D2E0A;
|
||||
border: 1px solid #3D2E0A;
|
||||
border-radius: 6px;
|
||||
color: #e5e7eb;
|
||||
font-size: 0.875rem;
|
||||
@@ -146,7 +146,7 @@ interface Issuer {
|
||||
|
||||
.issuer-card {
|
||||
background: rgba(30, 41, 59, 0.6);
|
||||
border: 1px solid #334155;
|
||||
border: 1px solid #3D2E0A;
|
||||
border-radius: 8px;
|
||||
padding: 1.25rem;
|
||||
}
|
||||
@@ -167,7 +167,7 @@ interface Issuer {
|
||||
|
||||
.issuer-card__description {
|
||||
font-size: 0.875rem;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
margin: 0 0 1rem;
|
||||
}
|
||||
|
||||
@@ -202,7 +202,7 @@ interface Issuer {
|
||||
|
||||
.meta-label {
|
||||
font-size: 0.7rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
@@ -235,11 +235,11 @@ interface Issuer {
|
||||
|
||||
.btn--primary {
|
||||
background: #22d3ee;
|
||||
color: #0f172a;
|
||||
color: #1C1200;
|
||||
}
|
||||
|
||||
.btn--secondary {
|
||||
background: #334155;
|
||||
background: #3D2E0A;
|
||||
color: #e5e7eb;
|
||||
}
|
||||
|
||||
@@ -252,7 +252,7 @@ interface Issuer {
|
||||
grid-column: 1 / -1;
|
||||
text-align: center;
|
||||
padding: 3rem;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
}
|
||||
`],
|
||||
})
|
||||
|
||||
@@ -87,7 +87,7 @@ import { ReactiveFormsModule, FormBuilder, Validators } from '@angular/forms';
|
||||
}
|
||||
|
||||
.back-link {
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
text-decoration: none;
|
||||
font-size: 0.875rem;
|
||||
}
|
||||
@@ -111,7 +111,7 @@ import { ReactiveFormsModule, FormBuilder, Validators } from '@angular/forms';
|
||||
|
||||
.form-section {
|
||||
background: rgba(30, 41, 59, 0.4);
|
||||
border: 1px solid #334155;
|
||||
border: 1px solid #3D2E0A;
|
||||
border-radius: 8px;
|
||||
padding: 1.25rem;
|
||||
margin-bottom: 1rem;
|
||||
@@ -136,7 +136,7 @@ import { ReactiveFormsModule, FormBuilder, Validators } from '@angular/forms';
|
||||
|
||||
.key-label {
|
||||
font-size: 0.75rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
@@ -157,15 +157,15 @@ import { ReactiveFormsModule, FormBuilder, Validators } from '@angular/forms';
|
||||
.form-group label {
|
||||
display: block;
|
||||
font-size: 0.875rem;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
margin-bottom: 0.375rem;
|
||||
}
|
||||
|
||||
.form-input {
|
||||
width: 100%;
|
||||
padding: 0.5rem 0.75rem;
|
||||
background: #1e293b;
|
||||
border: 1px solid #334155;
|
||||
background: #3D2E0A;
|
||||
border: 1px solid #3D2E0A;
|
||||
border-radius: 6px;
|
||||
color: #e5e7eb;
|
||||
font-size: 0.875rem;
|
||||
@@ -214,8 +214,8 @@ import { ReactiveFormsModule, FormBuilder, Validators } from '@angular/forms';
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
.btn--secondary { background: #334155; color: #e5e7eb; }
|
||||
.btn--warning { background: #fbbf24; color: #0f172a; }
|
||||
.btn--secondary { background: #3D2E0A; color: #e5e7eb; }
|
||||
.btn--warning { background: #fbbf24; color: #1C1200; }
|
||||
`],
|
||||
})
|
||||
export class KeyRotationComponent implements OnInit {
|
||||
|
||||
@@ -75,7 +75,7 @@ type TabType = 'list' | 'detail';
|
||||
|
||||
.issuer-trust__subtitle {
|
||||
font-size: 0.875rem;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
@@ -86,7 +86,7 @@ type TabType = 'list' | 'detail';
|
||||
|
||||
.stat-card {
|
||||
background: rgba(30, 41, 59, 0.6);
|
||||
border: 1px solid #334155;
|
||||
border: 1px solid #3D2E0A;
|
||||
border-radius: 8px;
|
||||
padding: 0.75rem 1.25rem;
|
||||
text-align: center;
|
||||
@@ -111,7 +111,7 @@ type TabType = 'list' | 'detail';
|
||||
.stat-label {
|
||||
display: block;
|
||||
font-size: 0.75rem;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.05em;
|
||||
}
|
||||
|
||||
@@ -558,7 +558,7 @@ import { ExportFormat, ExportOptions } from '../../services/lineage-export.servi
|
||||
|
||||
.btn-primary {
|
||||
background: #28a745;
|
||||
color: white;
|
||||
color: #1C1200;
|
||||
}
|
||||
|
||||
.btn-primary:hover:not(:disabled) {
|
||||
|
||||
@@ -142,7 +142,7 @@ interface LoadedBundle {
|
||||
|
||||
.description {
|
||||
font-size: 0.875rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
@@ -154,7 +154,7 @@ interface LoadedBundle {
|
||||
|
||||
.section-card {
|
||||
background: rgba(30, 41, 59, 0.4);
|
||||
border: 1px solid #334155;
|
||||
border: 1px solid #3D2E0A;
|
||||
border-radius: 8px;
|
||||
padding: 1.5rem;
|
||||
}
|
||||
@@ -168,7 +168,7 @@ interface LoadedBundle {
|
||||
|
||||
.section-description {
|
||||
font-size: 0.875rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
margin: -0.5rem 0 1rem;
|
||||
}
|
||||
|
||||
@@ -180,7 +180,7 @@ interface LoadedBundle {
|
||||
|
||||
.bundle-card {
|
||||
background: rgba(15, 23, 42, 0.5);
|
||||
border: 1px solid #1e293b;
|
||||
border: 1px solid #3D2E0A;
|
||||
border-radius: 8px;
|
||||
padding: 1rem;
|
||||
}
|
||||
@@ -244,7 +244,7 @@ interface LoadedBundle {
|
||||
|
||||
.meta-label {
|
||||
font-size: 0.65rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
@@ -266,7 +266,7 @@ interface LoadedBundle {
|
||||
|
||||
.category-card {
|
||||
background: rgba(15, 23, 42, 0.5);
|
||||
border: 1px solid #1e293b;
|
||||
border: 1px solid #3D2E0A;
|
||||
border-radius: 8px;
|
||||
padding: 1rem;
|
||||
}
|
||||
@@ -294,7 +294,7 @@ interface LoadedBundle {
|
||||
|
||||
.category-count {
|
||||
font-size: 0.75rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
}
|
||||
|
||||
.category-assets {
|
||||
@@ -314,7 +314,7 @@ interface LoadedBundle {
|
||||
}
|
||||
|
||||
.asset-name {
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
font-family: ui-monospace, monospace;
|
||||
}
|
||||
|
||||
@@ -325,7 +325,7 @@ interface LoadedBundle {
|
||||
.empty-state {
|
||||
text-align: center;
|
||||
padding: 2rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
}
|
||||
|
||||
.btn {
|
||||
@@ -345,7 +345,7 @@ interface LoadedBundle {
|
||||
}
|
||||
|
||||
.btn--secondary {
|
||||
background: #334155;
|
||||
background: #3D2E0A;
|
||||
color: #e5e7eb;
|
||||
}
|
||||
|
||||
|
||||
@@ -211,7 +211,7 @@ interface TrustAnchor {
|
||||
|
||||
.description {
|
||||
font-size: 0.875rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
@@ -223,7 +223,7 @@ interface TrustAnchor {
|
||||
|
||||
.section-card {
|
||||
background: rgba(30, 41, 59, 0.4);
|
||||
border: 1px solid #334155;
|
||||
border: 1px solid #3D2E0A;
|
||||
border-radius: 8px;
|
||||
padding: 1.5rem;
|
||||
}
|
||||
@@ -244,7 +244,7 @@ interface TrustAnchor {
|
||||
|
||||
.section-description {
|
||||
font-size: 0.875rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
margin: 0 0 1rem;
|
||||
}
|
||||
|
||||
@@ -269,7 +269,7 @@ interface TrustAnchor {
|
||||
|
||||
.status-label {
|
||||
font-size: 0.7rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
@@ -297,13 +297,13 @@ interface TrustAnchor {
|
||||
|
||||
.keys-list h4 {
|
||||
font-size: 0.875rem;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
margin: 0 0 0.75rem;
|
||||
}
|
||||
|
||||
.key-card {
|
||||
background: rgba(15, 23, 42, 0.5);
|
||||
border: 1px solid #1e293b;
|
||||
border: 1px solid #3D2E0A;
|
||||
border-left: 3px solid #4ade80;
|
||||
border-radius: 6px;
|
||||
padding: 1rem;
|
||||
@@ -356,13 +356,13 @@ interface TrustAnchor {
|
||||
|
||||
.detail-label {
|
||||
font-size: 0.65rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.detail-value {
|
||||
font-size: 0.75rem;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
}
|
||||
|
||||
.source-badge {
|
||||
@@ -385,12 +385,12 @@ interface TrustAnchor {
|
||||
.key-expiry {
|
||||
margin-top: 0.75rem;
|
||||
font-size: 0.75rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
}
|
||||
|
||||
.anchor-card {
|
||||
background: rgba(15, 23, 42, 0.5);
|
||||
border: 1px solid #1e293b;
|
||||
border: 1px solid #3D2E0A;
|
||||
border-radius: 6px;
|
||||
padding: 1rem;
|
||||
margin-bottom: 0.75rem;
|
||||
@@ -436,18 +436,18 @@ interface TrustAnchor {
|
||||
|
||||
.fingerprint-label {
|
||||
font-size: 0.7rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
}
|
||||
|
||||
.fingerprint-value {
|
||||
font-family: ui-monospace, monospace;
|
||||
font-size: 0.7rem;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
}
|
||||
|
||||
.anchor-validity {
|
||||
font-size: 0.75rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
margin-bottom: 0.75rem;
|
||||
}
|
||||
|
||||
@@ -469,7 +469,7 @@ interface TrustAnchor {
|
||||
.form-group label {
|
||||
display: block;
|
||||
font-size: 0.875rem;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
|
||||
@@ -478,7 +478,7 @@ interface TrustAnchor {
|
||||
min-height: 120px;
|
||||
padding: 0.75rem;
|
||||
background: rgba(15, 23, 42, 0.5);
|
||||
border: 1px solid #334155;
|
||||
border: 1px solid #3D2E0A;
|
||||
border-radius: 6px;
|
||||
color: #e5e7eb;
|
||||
font-family: ui-monospace, monospace;
|
||||
@@ -487,7 +487,7 @@ interface TrustAnchor {
|
||||
}
|
||||
|
||||
.token-input::placeholder {
|
||||
color: #475569;
|
||||
color: #6B5A2E;
|
||||
}
|
||||
|
||||
.validation-result {
|
||||
@@ -524,7 +524,7 @@ interface TrustAnchor {
|
||||
|
||||
.result-message {
|
||||
font-size: 0.875rem;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
margin: 0.5rem 0 0;
|
||||
}
|
||||
|
||||
@@ -534,13 +534,13 @@ interface TrustAnchor {
|
||||
|
||||
.result-claims h5 {
|
||||
font-size: 0.75rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
margin: 0 0 0.5rem;
|
||||
}
|
||||
|
||||
.result-claims pre {
|
||||
font-size: 0.75rem;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
background: rgba(15, 23, 42, 0.5);
|
||||
padding: 0.75rem;
|
||||
border-radius: 4px;
|
||||
@@ -567,7 +567,7 @@ interface TrustAnchor {
|
||||
|
||||
.btn--primary {
|
||||
background: #22d3ee;
|
||||
color: #0f172a;
|
||||
color: #1C1200;
|
||||
}
|
||||
|
||||
.btn--primary:disabled {
|
||||
@@ -576,14 +576,14 @@ interface TrustAnchor {
|
||||
}
|
||||
|
||||
.btn--secondary {
|
||||
background: #334155;
|
||||
background: #3D2E0A;
|
||||
color: #e5e7eb;
|
||||
}
|
||||
|
||||
.btn--ghost {
|
||||
background: transparent;
|
||||
border: 1px solid #334155;
|
||||
color: #94a3b8;
|
||||
border: 1px solid #3D2E0A;
|
||||
color: #D4C9A8;
|
||||
}
|
||||
|
||||
.spinner {
|
||||
|
||||
@@ -141,7 +141,7 @@ interface DashboardStats {
|
||||
|
||||
.stat-card {
|
||||
background: rgba(30, 41, 59, 0.6);
|
||||
border: 1px solid #334155;
|
||||
border: 1px solid #3D2E0A;
|
||||
border-radius: 8px;
|
||||
padding: 1.25rem;
|
||||
display: flex;
|
||||
@@ -151,7 +151,7 @@ interface DashboardStats {
|
||||
|
||||
.stat-label {
|
||||
font-size: 0.75rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
@@ -169,7 +169,7 @@ interface DashboardStats {
|
||||
|
||||
.dashboard-card {
|
||||
background: rgba(30, 41, 59, 0.4);
|
||||
border: 1px solid #334155;
|
||||
border: 1px solid #3D2E0A;
|
||||
border-radius: 8px;
|
||||
padding: 1.5rem;
|
||||
}
|
||||
@@ -228,7 +228,7 @@ interface DashboardStats {
|
||||
|
||||
.mode-description {
|
||||
font-size: 0.875rem;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
@@ -273,7 +273,7 @@ interface DashboardStats {
|
||||
|
||||
.feature-status {
|
||||
font-size: 0.7rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
}
|
||||
|
||||
.availability-dot {
|
||||
@@ -316,7 +316,7 @@ interface DashboardStats {
|
||||
|
||||
.activity-time {
|
||||
font-size: 0.7rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
}
|
||||
|
||||
.btn {
|
||||
@@ -333,11 +333,11 @@ interface DashboardStats {
|
||||
|
||||
.btn--primary {
|
||||
background: #22d3ee;
|
||||
color: #0f172a;
|
||||
color: #1C1200;
|
||||
}
|
||||
|
||||
.btn--secondary {
|
||||
background: #334155;
|
||||
background: #3D2E0A;
|
||||
color: #e5e7eb;
|
||||
}
|
||||
|
||||
@@ -345,7 +345,7 @@ interface DashboardStats {
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
border: 2px solid rgba(15, 23, 42, 0.3);
|
||||
border-top-color: #0f172a;
|
||||
border-top-color: #1C1200;
|
||||
border-radius: 50%;
|
||||
animation: spin 0.8s linear infinite;
|
||||
}
|
||||
|
||||
@@ -104,7 +104,7 @@ interface VerificationHistory {
|
||||
|
||||
.description {
|
||||
font-size: 0.875rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
@@ -116,7 +116,7 @@ interface VerificationHistory {
|
||||
|
||||
.section-card {
|
||||
background: rgba(30, 41, 59, 0.4);
|
||||
border: 1px solid #334155;
|
||||
border: 1px solid #3D2E0A;
|
||||
border-radius: 8px;
|
||||
padding: 1.5rem;
|
||||
}
|
||||
@@ -179,12 +179,12 @@ interface VerificationHistory {
|
||||
|
||||
.history-meta {
|
||||
font-size: 0.75rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
}
|
||||
|
||||
.history-time {
|
||||
font-size: 0.7rem;
|
||||
color: #475569;
|
||||
color: #6B5A2E;
|
||||
}
|
||||
|
||||
.quick-actions {
|
||||
@@ -200,7 +200,7 @@ interface VerificationHistory {
|
||||
gap: 0.5rem;
|
||||
padding: 1.5rem 1rem;
|
||||
background: rgba(15, 23, 42, 0.5);
|
||||
border: 1px solid #1e293b;
|
||||
border: 1px solid #3D2E0A;
|
||||
border-radius: 8px;
|
||||
cursor: pointer;
|
||||
transition: border-color 0.2s, background 0.2s;
|
||||
@@ -208,7 +208,7 @@ interface VerificationHistory {
|
||||
}
|
||||
|
||||
.action-card:hover {
|
||||
border-color: #334155;
|
||||
border-color: #3D2E0A;
|
||||
background: rgba(30, 41, 59, 0.5);
|
||||
}
|
||||
|
||||
@@ -224,19 +224,19 @@ interface VerificationHistory {
|
||||
|
||||
.action-desc {
|
||||
font-size: 0.75rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
}
|
||||
|
||||
.empty-state {
|
||||
text-align: center;
|
||||
padding: 2rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
}
|
||||
|
||||
.btn--ghost {
|
||||
background: transparent;
|
||||
border: 1px solid #334155;
|
||||
color: #94a3b8;
|
||||
border: 1px solid #3D2E0A;
|
||||
color: #D4C9A8;
|
||||
padding: 0.375rem 0.75rem;
|
||||
border-radius: 4px;
|
||||
font-size: 0.75rem;
|
||||
|
||||
@@ -68,7 +68,7 @@ import { OfflineModeService } from '../../core/services/offline-mode.service';
|
||||
styles: [`
|
||||
.offline-kit-layout {
|
||||
min-height: 100%;
|
||||
background: #0f172a;
|
||||
background: #1C1200;
|
||||
}
|
||||
|
||||
.page-header {
|
||||
@@ -76,19 +76,19 @@ import { OfflineModeService } from '../../core/services/offline-mode.service';
|
||||
justify-content: space-between;
|
||||
align-items: flex-start;
|
||||
padding: 1.5rem 2rem;
|
||||
border-bottom: 1px solid #1e293b;
|
||||
border-bottom: 1px solid #3D2E0A;
|
||||
}
|
||||
|
||||
.header-content h1 {
|
||||
font-size: 1.5rem;
|
||||
font-weight: 600;
|
||||
color: #f1f5f9;
|
||||
color: #FFF9ED;
|
||||
margin: 0 0 0.25rem;
|
||||
}
|
||||
|
||||
.subtitle {
|
||||
font-size: 0.875rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
@@ -133,8 +133,8 @@ import { OfflineModeService } from '../../core/services/offline-mode.service';
|
||||
display: flex;
|
||||
gap: 0.25rem;
|
||||
padding: 0 2rem;
|
||||
background: #0f172a;
|
||||
border-bottom: 1px solid #1e293b;
|
||||
background: #1C1200;
|
||||
border-bottom: 1px solid #3D2E0A;
|
||||
}
|
||||
|
||||
.tab-link {
|
||||
@@ -142,7 +142,7 @@ import { OfflineModeService } from '../../core/services/offline-mode.service';
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
padding: 1rem 1.25rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
text-decoration: none;
|
||||
font-size: 0.875rem;
|
||||
font-weight: 500;
|
||||
@@ -151,7 +151,7 @@ import { OfflineModeService } from '../../core/services/offline-mode.service';
|
||||
}
|
||||
|
||||
.tab-link:hover {
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
}
|
||||
|
||||
.tab-link.active {
|
||||
|
||||
@@ -118,8 +118,8 @@ import { POLICY_GATES_API } from '../../../../core/api/policy-gates.client';
|
||||
.airgap-container {
|
||||
position: relative;
|
||||
padding: 1rem;
|
||||
background: #1e293b;
|
||||
border: 1px solid #334155;
|
||||
background: #3D2E0A;
|
||||
border: 1px solid #3D2E0A;
|
||||
border-radius: 8px;
|
||||
transition: border-color 0.2s;
|
||||
|
||||
@@ -163,7 +163,7 @@ import { POLICY_GATES_API } from '../../../../core/api/policy-gates.client';
|
||||
.header-title {
|
||||
font-size: 0.9375rem;
|
||||
font-weight: 600;
|
||||
color: #e2e8f0;
|
||||
color: rgba(212, 201, 168, 0.3);
|
||||
}
|
||||
|
||||
.airgap-container--sealed .header-title {
|
||||
@@ -172,7 +172,7 @@ import { POLICY_GATES_API } from '../../../../core/api/policy-gates.client';
|
||||
|
||||
.header-subtitle {
|
||||
font-size: 0.75rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
}
|
||||
|
||||
.toggle-btn {
|
||||
@@ -193,7 +193,7 @@ import { POLICY_GATES_API } from '../../../../core/api/policy-gates.client';
|
||||
align-items: center;
|
||||
width: 44px;
|
||||
height: 24px;
|
||||
background: #334155;
|
||||
background: #3D2E0A;
|
||||
border-radius: 12px;
|
||||
transition: background 0.2s;
|
||||
}
|
||||
@@ -206,7 +206,7 @@ import { POLICY_GATES_API } from '../../../../core/api/policy-gates.client';
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
margin: 2px;
|
||||
background: #e2e8f0;
|
||||
background: rgba(212, 201, 168, 0.3);
|
||||
border-radius: 50%;
|
||||
transition: transform 0.2s;
|
||||
}
|
||||
@@ -221,7 +221,7 @@ import { POLICY_GATES_API } from '../../../../core/api/policy-gates.client';
|
||||
gap: 0.5rem;
|
||||
margin-top: 1rem;
|
||||
padding-top: 1rem;
|
||||
border-top: 1px solid #334155;
|
||||
border-top: 1px solid #3D2E0A;
|
||||
}
|
||||
|
||||
.status-row {
|
||||
@@ -239,11 +239,11 @@ import { POLICY_GATES_API } from '../../../../core/api/policy-gates.client';
|
||||
}
|
||||
|
||||
.status-label {
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
}
|
||||
|
||||
.status-value {
|
||||
color: #e2e8f0;
|
||||
color: rgba(212, 201, 168, 0.3);
|
||||
|
||||
&--ok {
|
||||
color: #10b981;
|
||||
@@ -299,7 +299,7 @@ import { POLICY_GATES_API } from '../../../../core/api/policy-gates.client';
|
||||
.spinner {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
border: 2px solid #334155;
|
||||
border: 2px solid #3D2E0A;
|
||||
border-top-color: #3b82f6;
|
||||
border-radius: 50%;
|
||||
animation: spin 0.6s linear infinite;
|
||||
|
||||
@@ -206,12 +206,12 @@ import { GateSimulationResultsComponent } from '../gate-simulation-results/gate-
|
||||
margin: 0;
|
||||
font-size: 1.125rem;
|
||||
font-weight: 600;
|
||||
color: #e2e8f0;
|
||||
color: rgba(212, 201, 168, 0.3);
|
||||
}
|
||||
|
||||
.header-subtitle {
|
||||
font-size: 0.8125rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
}
|
||||
|
||||
.simulator-controls {
|
||||
@@ -219,8 +219,8 @@ import { GateSimulationResultsComponent } from '../gate-simulation-results/gate-
|
||||
flex-direction: column;
|
||||
gap: 1rem;
|
||||
padding: 1rem;
|
||||
background: #1e293b;
|
||||
border: 1px solid #334155;
|
||||
background: #3D2E0A;
|
||||
border: 1px solid #3D2E0A;
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
@@ -274,8 +274,8 @@ import { GateSimulationResultsComponent } from '../gate-simulation-results/gate-
|
||||
|
||||
.result-summary {
|
||||
padding: 1rem;
|
||||
background: #1e293b;
|
||||
border: 1px solid #334155;
|
||||
background: #3D2E0A;
|
||||
border: 1px solid #3D2E0A;
|
||||
border-radius: 8px;
|
||||
|
||||
&--pass { border-top: 3px solid #10b981; }
|
||||
@@ -298,7 +298,7 @@ import { GateSimulationResultsComponent } from '../gate-simulation-results/gate-
|
||||
|
||||
.summary-duration {
|
||||
font-size: 0.75rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
}
|
||||
|
||||
.summary-stats {
|
||||
@@ -315,7 +315,7 @@ import { GateSimulationResultsComponent } from '../gate-simulation-results/gate-
|
||||
.stat-value {
|
||||
font-size: 1.5rem;
|
||||
font-weight: 700;
|
||||
color: #e2e8f0;
|
||||
color: rgba(212, 201, 168, 0.3);
|
||||
}
|
||||
|
||||
.stat-item--blocking .stat-value { color: #ef4444; }
|
||||
@@ -323,7 +323,7 @@ import { GateSimulationResultsComponent } from '../gate-simulation-results/gate-
|
||||
|
||||
.stat-label {
|
||||
font-size: 0.6875rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
@@ -392,27 +392,27 @@ import { GateSimulationResultsComponent } from '../gate-simulation-results/gate-
|
||||
.artifacts-title {
|
||||
font-size: 0.875rem;
|
||||
font-weight: 600;
|
||||
color: #e2e8f0;
|
||||
color: rgba(212, 201, 168, 0.3);
|
||||
}
|
||||
|
||||
.expand-all-btn {
|
||||
padding: 0.25rem 0.5rem;
|
||||
background: transparent;
|
||||
border: 1px solid #334155;
|
||||
border: 1px solid #3D2E0A;
|
||||
border-radius: 4px;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
font-size: 0.75rem;
|
||||
cursor: pointer;
|
||||
|
||||
&:hover {
|
||||
background: rgba(255, 255, 255, 0.05);
|
||||
border-color: #475569;
|
||||
border-color: #6B5A2E;
|
||||
}
|
||||
}
|
||||
|
||||
.artifact-item {
|
||||
background: #1e293b;
|
||||
border: 1px solid #334155;
|
||||
background: #3D2E0A;
|
||||
border: 1px solid #3D2E0A;
|
||||
border-radius: 6px;
|
||||
overflow: hidden;
|
||||
|
||||
@@ -422,7 +422,7 @@ import { GateSimulationResultsComponent } from '../gate-simulation-results/gate-
|
||||
&--error { border-left: 3px solid #6b7280; }
|
||||
|
||||
&--expanded {
|
||||
border-color: #475569;
|
||||
border-color: #6B5A2E;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -434,7 +434,7 @@ import { GateSimulationResultsComponent } from '../gate-simulation-results/gate-
|
||||
padding: 0.75rem;
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: #e2e8f0;
|
||||
color: rgba(212, 201, 168, 0.3);
|
||||
text-align: left;
|
||||
cursor: pointer;
|
||||
|
||||
@@ -455,17 +455,17 @@ import { GateSimulationResultsComponent } from '../gate-simulation-results/gate-
|
||||
|
||||
.artifact-gates {
|
||||
font-size: 0.75rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
}
|
||||
|
||||
.expand-icon {
|
||||
font-size: 0.625rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
}
|
||||
|
||||
.artifact-details {
|
||||
padding: 0.75rem;
|
||||
border-top: 1px solid #334155;
|
||||
border-top: 1px solid #3D2E0A;
|
||||
background: rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
|
||||
@@ -516,13 +516,13 @@ import { GateSimulationResultsComponent } from '../gate-simulation-results/gate-
|
||||
}
|
||||
|
||||
.gate-name {
|
||||
color: #e2e8f0;
|
||||
color: rgba(212, 201, 168, 0.3);
|
||||
font-weight: 500;
|
||||
min-width: 100px;
|
||||
}
|
||||
|
||||
.gate-detail {
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
@@ -533,8 +533,8 @@ import { GateSimulationResultsComponent } from '../gate-simulation-results/gate-
|
||||
justify-content: center;
|
||||
gap: 0.5rem;
|
||||
padding: 3rem;
|
||||
background: #1e293b;
|
||||
border: 1px dashed #334155;
|
||||
background: #3D2E0A;
|
||||
border: 1px dashed #3D2E0A;
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
@@ -545,7 +545,7 @@ import { GateSimulationResultsComponent } from '../gate-simulation-results/gate-
|
||||
|
||||
.empty-text {
|
||||
font-size: 0.875rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
text-align: center;
|
||||
}
|
||||
`],
|
||||
|
||||
@@ -105,8 +105,8 @@ import { POLICY_GATES_API } from '../../../../core/api/policy-gates.client';
|
||||
flex-direction: column;
|
||||
gap: 0.75rem;
|
||||
padding: 0.75rem;
|
||||
background: #1e293b;
|
||||
border: 1px solid #334155;
|
||||
background: #3D2E0A;
|
||||
border: 1px solid #3D2E0A;
|
||||
border-radius: 6px;
|
||||
}
|
||||
|
||||
@@ -119,7 +119,7 @@ import { POLICY_GATES_API } from '../../../../core/api/policy-gates.client';
|
||||
.header-title {
|
||||
font-size: 0.8125rem;
|
||||
font-weight: 600;
|
||||
color: #e2e8f0;
|
||||
color: rgba(212, 201, 168, 0.3);
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.03em;
|
||||
}
|
||||
@@ -145,7 +145,7 @@ import { POLICY_GATES_API } from '../../../../core/api/policy-gates.client';
|
||||
|
||||
.freshness-summary {
|
||||
padding-bottom: 0.5rem;
|
||||
border-bottom: 1px solid #334155;
|
||||
border-bottom: 1px solid #3D2E0A;
|
||||
}
|
||||
|
||||
.summary-counts {
|
||||
@@ -167,7 +167,7 @@ import { POLICY_GATES_API } from '../../../../core/api/policy-gates.client';
|
||||
|
||||
.count-label {
|
||||
font-size: 0.6875rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
@@ -202,7 +202,7 @@ import { POLICY_GATES_API } from '../../../../core/api/policy-gates.client';
|
||||
|
||||
&--fresh {
|
||||
.badge-indicator { background: #10b981; }
|
||||
.badge-name { color: #e2e8f0; }
|
||||
.badge-name { color: rgba(212, 201, 168, 0.3); }
|
||||
}
|
||||
|
||||
&--warning {
|
||||
@@ -232,24 +232,24 @@ import { POLICY_GATES_API } from '../../../../core/api/policy-gates.client';
|
||||
}
|
||||
|
||||
.badge-age {
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
font-size: 0.6875rem;
|
||||
}
|
||||
|
||||
.show-more-btn {
|
||||
padding: 0.25rem 0.5rem;
|
||||
background: transparent;
|
||||
border: 1px dashed #475569;
|
||||
border: 1px dashed #6B5A2E;
|
||||
border-radius: 4px;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
font-size: 0.75rem;
|
||||
cursor: pointer;
|
||||
transition: all 0.15s;
|
||||
|
||||
&:hover {
|
||||
background: rgba(255, 255, 255, 0.05);
|
||||
border-color: #64748b;
|
||||
color: #e2e8f0;
|
||||
border-color: #6B5A2E;
|
||||
color: rgba(212, 201, 168, 0.3);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -260,17 +260,17 @@ import { POLICY_GATES_API } from '../../../../core/api/policy-gates.client';
|
||||
gap: 0.375rem;
|
||||
padding: 0.5rem 0.75rem;
|
||||
background: transparent;
|
||||
border: 1px solid #334155;
|
||||
border: 1px solid #3D2E0A;
|
||||
border-radius: 4px;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
font-size: 0.75rem;
|
||||
cursor: pointer;
|
||||
transition: all 0.15s;
|
||||
|
||||
&:hover:not(:disabled) {
|
||||
background: rgba(255, 255, 255, 0.05);
|
||||
border-color: #475569;
|
||||
color: #e2e8f0;
|
||||
border-color: #6B5A2E;
|
||||
color: rgba(212, 201, 168, 0.3);
|
||||
}
|
||||
|
||||
&:disabled {
|
||||
|
||||
@@ -138,8 +138,8 @@ import {
|
||||
`,
|
||||
styles: [`
|
||||
.simulation-results {
|
||||
background: #1e293b;
|
||||
border: 1px solid #334155;
|
||||
background: #3D2E0A;
|
||||
border: 1px solid #3D2E0A;
|
||||
border-radius: 8px;
|
||||
overflow: hidden;
|
||||
|
||||
@@ -165,7 +165,7 @@ import {
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 1rem;
|
||||
border-bottom: 1px solid #334155;
|
||||
border-bottom: 1px solid #3D2E0A;
|
||||
}
|
||||
|
||||
.header-status {
|
||||
@@ -193,10 +193,10 @@ import {
|
||||
|
||||
.meta-item {
|
||||
font-size: 0.8125rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
|
||||
strong {
|
||||
color: #e2e8f0;
|
||||
color: rgba(212, 201, 168, 0.3);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -250,7 +250,7 @@ import {
|
||||
|
||||
.alert-items {
|
||||
font-size: 0.75rem;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
font-family: monospace;
|
||||
}
|
||||
|
||||
@@ -268,12 +268,12 @@ import {
|
||||
.section-title {
|
||||
font-size: 0.875rem;
|
||||
font-weight: 600;
|
||||
color: #e2e8f0;
|
||||
color: rgba(212, 201, 168, 0.3);
|
||||
}
|
||||
|
||||
.section-count {
|
||||
font-size: 0.75rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
}
|
||||
|
||||
.gates-list {
|
||||
@@ -284,7 +284,7 @@ import {
|
||||
|
||||
.gate-item {
|
||||
background: rgba(255, 255, 255, 0.03);
|
||||
border: 1px solid #334155;
|
||||
border: 1px solid #3D2E0A;
|
||||
border-radius: 6px;
|
||||
overflow: hidden;
|
||||
transition: border-color 0.15s;
|
||||
@@ -298,7 +298,7 @@ import {
|
||||
}
|
||||
|
||||
&--expanded {
|
||||
border-color: #475569;
|
||||
border-color: #6B5A2E;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -310,7 +310,7 @@ import {
|
||||
padding: 0.625rem 0.75rem;
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: #e2e8f0;
|
||||
color: rgba(212, 201, 168, 0.3);
|
||||
font-size: 0.8125rem;
|
||||
text-align: left;
|
||||
cursor: pointer;
|
||||
@@ -356,30 +356,30 @@ import {
|
||||
background: rgba(255, 255, 255, 0.05);
|
||||
border-radius: 4px;
|
||||
font-size: 0.6875rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
}
|
||||
|
||||
.expand-arrow {
|
||||
font-size: 0.625rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
}
|
||||
|
||||
.gate-details {
|
||||
padding: 0.75rem;
|
||||
border-top: 1px solid #334155;
|
||||
border-top: 1px solid #3D2E0A;
|
||||
background: rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
|
||||
.gate-detail-text {
|
||||
margin: 0 0 0.5rem 0;
|
||||
font-size: 0.8125rem;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
line-height: 1.4;
|
||||
}
|
||||
|
||||
.gate-detail-meta {
|
||||
font-size: 0.75rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
}
|
||||
|
||||
.results-footer {
|
||||
@@ -388,19 +388,19 @@ import {
|
||||
gap: 1rem;
|
||||
padding: 0.75rem 1rem;
|
||||
background: rgba(0, 0, 0, 0.2);
|
||||
border-top: 1px solid #334155;
|
||||
border-top: 1px solid #3D2E0A;
|
||||
}
|
||||
|
||||
.footer-item {
|
||||
font-size: 0.75rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
|
||||
code {
|
||||
padding: 0.125rem 0.25rem;
|
||||
background: rgba(255, 255, 255, 0.05);
|
||||
border-radius: 3px;
|
||||
font-family: monospace;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
}
|
||||
}
|
||||
`],
|
||||
|
||||
@@ -227,13 +227,13 @@ import { GateSimulationResultsComponent } from '../gate-simulation-results/gate-
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 100%;
|
||||
background: #0f172a;
|
||||
color: #e2e8f0;
|
||||
background: #1C1200;
|
||||
color: rgba(212, 201, 168, 0.3);
|
||||
}
|
||||
|
||||
.panel-header {
|
||||
padding: 1.5rem;
|
||||
border-bottom: 1px solid #1e293b;
|
||||
border-bottom: 1px solid #3D2E0A;
|
||||
}
|
||||
|
||||
.panel-title {
|
||||
@@ -245,7 +245,7 @@ import { GateSimulationResultsComponent } from '../gate-simulation-results/gate-
|
||||
.panel-subtitle {
|
||||
margin: 0;
|
||||
font-size: 0.875rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
}
|
||||
|
||||
.panel-content {
|
||||
@@ -260,8 +260,8 @@ import { GateSimulationResultsComponent } from '../gate-simulation-results/gate-
|
||||
flex-direction: column;
|
||||
gap: 1rem;
|
||||
padding: 1rem;
|
||||
background: #0f172a;
|
||||
border-right: 1px solid #1e293b;
|
||||
background: #1C1200;
|
||||
border-right: 1px solid #3D2E0A;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
@@ -314,7 +314,7 @@ import { GateSimulationResultsComponent } from '../gate-simulation-results/gate-
|
||||
.profile-description {
|
||||
margin: 0;
|
||||
font-size: 0.875rem;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
@@ -326,8 +326,8 @@ import { GateSimulationResultsComponent } from '../gate-simulation-results/gate-
|
||||
|
||||
.requirement-card {
|
||||
padding: 1rem;
|
||||
background: #1e293b;
|
||||
border: 1px solid #334155;
|
||||
background: #3D2E0A;
|
||||
border: 1px solid #3D2E0A;
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
@@ -335,7 +335,7 @@ import { GateSimulationResultsComponent } from '../gate-simulation-results/gate-
|
||||
margin: 0 0 0.75rem 0;
|
||||
font-size: 0.875rem;
|
||||
font-weight: 600;
|
||||
color: #e2e8f0;
|
||||
color: rgba(212, 201, 168, 0.3);
|
||||
}
|
||||
|
||||
.requirement-list {
|
||||
@@ -350,7 +350,7 @@ import { GateSimulationResultsComponent } from '../gate-simulation-results/gate-
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
padding: 0.5rem 0;
|
||||
border-bottom: 1px solid #334155;
|
||||
border-bottom: 1px solid #3D2E0A;
|
||||
font-size: 0.8125rem;
|
||||
|
||||
&:last-child {
|
||||
@@ -365,7 +365,7 @@ import { GateSimulationResultsComponent } from '../gate-simulation-results/gate-
|
||||
|
||||
.req-type {
|
||||
font-family: monospace;
|
||||
color: #e2e8f0;
|
||||
color: rgba(212, 201, 168, 0.3);
|
||||
}
|
||||
|
||||
.req-badge {
|
||||
@@ -382,26 +382,26 @@ import { GateSimulationResultsComponent } from '../gate-simulation-results/gate-
|
||||
|
||||
&--optional {
|
||||
background: rgba(100, 116, 139, 0.2);
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
}
|
||||
}
|
||||
|
||||
.req-detail {
|
||||
font-size: 0.75rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
}
|
||||
|
||||
.req-label {
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
}
|
||||
|
||||
.req-value {
|
||||
color: #e2e8f0;
|
||||
color: rgba(212, 201, 168, 0.3);
|
||||
}
|
||||
|
||||
.no-requirements {
|
||||
font-size: 0.8125rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
@@ -450,13 +450,13 @@ import { GateSimulationResultsComponent } from '../gate-simulation-results/gate-
|
||||
|
||||
.no-failures {
|
||||
font-size: 0.75rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
.simulation-section {
|
||||
padding-top: 1.5rem;
|
||||
border-top: 1px solid #334155;
|
||||
border-top: 1px solid #3D2E0A;
|
||||
}
|
||||
|
||||
.simulation-header {
|
||||
@@ -483,7 +483,7 @@ import { GateSimulationResultsComponent } from '../gate-simulation-results/gate-
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
font-size: 0.8125rem;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
cursor: pointer;
|
||||
|
||||
input {
|
||||
@@ -548,12 +548,12 @@ import { GateSimulationResultsComponent } from '../gate-simulation-results/gate-
|
||||
.empty-title {
|
||||
font-size: 1.125rem;
|
||||
font-weight: 600;
|
||||
color: #e2e8f0;
|
||||
color: rgba(212, 201, 168, 0.3);
|
||||
}
|
||||
|
||||
.empty-text {
|
||||
font-size: 0.875rem;
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
text-align: center;
|
||||
max-width: 300px;
|
||||
}
|
||||
|
||||
@@ -115,7 +115,7 @@ import { POLICY_GATES_API } from '../../../../core/api/policy-gates.client';
|
||||
.selector-label {
|
||||
font-size: 0.875rem;
|
||||
font-weight: 500;
|
||||
color: #e2e8f0;
|
||||
color: rgba(212, 201, 168, 0.3);
|
||||
}
|
||||
|
||||
.selector-wrapper {
|
||||
@@ -127,10 +127,10 @@ import { POLICY_GATES_API } from '../../../../core/api/policy-gates.client';
|
||||
.selector-select {
|
||||
width: 100%;
|
||||
padding: 0.625rem 2.5rem 0.625rem 0.75rem;
|
||||
background: #1e293b;
|
||||
border: 1px solid #334155;
|
||||
background: #3D2E0A;
|
||||
border: 1px solid #3D2E0A;
|
||||
border-radius: 6px;
|
||||
color: #e2e8f0;
|
||||
color: rgba(212, 201, 168, 0.3);
|
||||
font-size: 0.875rem;
|
||||
cursor: pointer;
|
||||
appearance: none;
|
||||
@@ -140,7 +140,7 @@ import { POLICY_GATES_API } from '../../../../core/api/policy-gates.client';
|
||||
background-size: 1rem;
|
||||
|
||||
&:hover:not(:disabled) {
|
||||
border-color: #475569;
|
||||
border-color: #6B5A2E;
|
||||
}
|
||||
|
||||
&:focus {
|
||||
@@ -165,7 +165,7 @@ import { POLICY_GATES_API } from '../../../../core/api/policy-gates.client';
|
||||
.spinner {
|
||||
width: 1rem;
|
||||
height: 1rem;
|
||||
border: 2px solid #334155;
|
||||
border: 2px solid #3D2E0A;
|
||||
border-top-color: #3b82f6;
|
||||
border-radius: 50%;
|
||||
animation: spin 0.6s linear infinite;
|
||||
@@ -178,8 +178,8 @@ import { POLICY_GATES_API } from '../../../../core/api/policy-gates.client';
|
||||
.profile-preview {
|
||||
margin-top: 0.5rem;
|
||||
padding: 0.75rem;
|
||||
background: #1e293b;
|
||||
border: 1px solid #334155;
|
||||
background: #3D2E0A;
|
||||
border: 1px solid #3D2E0A;
|
||||
border-radius: 6px;
|
||||
}
|
||||
|
||||
@@ -212,7 +212,7 @@ import { POLICY_GATES_API } from '../../../../core/api/policy-gates.client';
|
||||
.preview-description {
|
||||
margin: 0 0 0.75rem 0;
|
||||
font-size: 0.8125rem;
|
||||
color: #94a3b8;
|
||||
color: #D4C9A8;
|
||||
line-height: 1.4;
|
||||
}
|
||||
|
||||
@@ -230,11 +230,11 @@ import { POLICY_GATES_API } from '../../../../core/api/policy-gates.client';
|
||||
}
|
||||
|
||||
.requirement-label {
|
||||
color: #64748b;
|
||||
color: #6B5A2E;
|
||||
}
|
||||
|
||||
.requirement-value {
|
||||
color: #e2e8f0;
|
||||
color: rgba(212, 201, 168, 0.3);
|
||||
|
||||
&.hard-failures {
|
||||
color: #ef4444;
|
||||
|
||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user