Fix pack detail tab edge-case colors: surface-primary as text, inverse bg

Editor: color surface-primary (cream text on buttons) → text-inverse
Simulation: color surface-inverse (dark text) → text-inverse
Approvals: hardcoded rgba ghost button text → text-secondary
YAML: status-info-text button bg → btn-primary-bg
Explain: surface-inverse button bg → surface-elevated

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
master
2026-03-29 15:44:06 +03:00
parent 5dfd14bd55
commit d7efb2a6a4
5 changed files with 13 additions and 13 deletions

View File

@@ -243,7 +243,7 @@ import { PolicyApiService } from '../services/policy-api.service';
.approvals__lede {
margin: 0.2rem 0 0;
color: rgba(212, 201, 168, 0.5);
color: var(--color-text-secondary);
}
.approvals__meta {
@@ -307,7 +307,7 @@ import { PolicyApiService } from '../services/policy-api.service';
.field span {
display: block;
margin-bottom: 0.2rem;
color: rgba(212, 201, 168, 0.5);
color: var(--color-text-secondary);
font-weight: var(--font-weight-semibold);
}
@@ -348,9 +348,9 @@ import { PolicyApiService } from '../services/policy-api.service';
.btn:disabled { opacity: 0.6; cursor: not-allowed; }
.btn--warn { background: var(--color-severity-high); border-color: var(--color-severity-high); color: var(--color-surface-inverse); }
.btn--warn { background: var(--color-severity-high); border-color: var(--color-severity-high); color: var(--color-text-inverse); }
.btn--ghost { background: transparent; border-color: var(--color-border-primary); color: rgba(212, 201, 168, 0.5); }
.btn--ghost { background: transparent; border-color: var(--color-border-primary); color: var(--color-text-secondary); }
.approvals__badge {
padding: 0.3rem 0.6rem;
@@ -468,7 +468,7 @@ import { PolicyApiService } from '../services/policy-api.service';
.comments__body { margin: 0.15rem 0 0; color: var(--color-text-primary); }
.muted { color: var(--color-text-muted); font-size: 0.9rem; }
.schedule__summary { display: flex; flex-direction: column; gap: 0.15rem; color: rgba(212, 201, 168, 0.5); }
.schedule__summary { display: flex; flex-direction: column; gap: 0.15rem; color: var(--color-text-secondary); }
@media (max-width: 960px) { .approvals__header { flex-direction: column; } }
`,

View File

@@ -214,7 +214,7 @@ interface ChecklistItem {
margin: 0.1rem 0;
font-size: 1.8rem;
font-weight: var(--font-weight-bold);
color: var(--color-surface-primary);
color: var(--color-text-inverse);
}
.policy-editor__eyebrow {
@@ -396,7 +396,7 @@ interface ChecklistItem {
.diagnostics__header h3 {
margin: 0;
color: var(--color-surface-primary);
color: var(--color-text-inverse);
}
.diagnostics__header p {
@@ -472,7 +472,7 @@ interface ChecklistItem {
.sidebar-card__header h3 {
margin: 0;
color: var(--color-surface-primary);
color: var(--color-text-inverse);
}
.sidebar-card__header p {

View File

@@ -73,19 +73,19 @@ import jsPDF from './jspdf.stub';
`,
styles: [
`
:host { display: block; background: var(--color-surface-inverse); color: var(--color-text-primary); min-height: 100vh; }
:host { display: block; background: var(--color-surface-elevated); color: var(--color-text-primary); min-height: 100vh; }
.expl { max-width: 1200px; margin: 0 auto; padding: 1.5rem; }
.expl__header { display: flex; justify-content: space-between; align-items: center; }
.expl__eyebrow { margin: 0; color: var(--color-status-info); text-transform: uppercase; letter-spacing: 0.05em; font-size: 0.8rem; }
.expl__lede { margin: 0.2rem 0 0; color: var(--color-text-muted); }
.expl__meta { display: flex; gap: 0.5rem; align-items: center; }
.expl__btn { display: inline-flex; align-items: center; border: 1px solid var(--color-border-primary); border-radius: var(--radius-lg); padding: 0.35rem 0.65rem; color: var(--color-text-primary); text-decoration: none; background: var(--color-surface-inverse); }
.expl__btn { display: inline-flex; align-items: center; border: 1px solid var(--color-border-primary); border-radius: var(--radius-lg); padding: 0.35rem 0.65rem; color: var(--color-text-primary); text-decoration: none; background: var(--color-surface-elevated); }
.expl__btn:hover { border-color: var(--color-status-info); }
.expl__grid { display: grid; grid-template-columns: 2fr 1fr; gap: 1rem; margin-top: 1rem; }
.card { background: var(--color-surface-elevated); border: 1px solid var(--color-border-primary); border-radius: var(--radius-xl); padding: 1rem; }
ol { margin: 0.5rem 0 0; padding-left: 1.25rem; }
li { margin-bottom: 0.6rem; }
.expl__json pre { margin: 0.35rem 0 0; background: var(--color-surface-inverse); border: 1px solid var(--color-border-primary); border-radius: var(--radius-lg); padding: 0.6rem; max-height: 240px; overflow: auto; }
.expl__json pre { margin: 0.35rem 0 0; background: var(--color-surface-elevated); border: 1px solid var(--color-border-primary); border-radius: var(--radius-lg); padding: 0.6rem; max-height: 240px; overflow: auto; }
@media (max-width: 1024px) { .expl__grid { grid-template-columns: 1fr; } }
`,
]

View File

@@ -328,7 +328,7 @@ import { PolicyApiService } from '../services/policy-api.service';
justify-self: start;
background: linear-gradient(120deg, var(--color-status-info-text), var(--color-status-info));
border: 1px solid var(--color-status-info-text);
color: var(--color-surface-inverse);
color: var(--color-text-inverse);
font-weight: var(--font-weight-bold);
padding: 0.6rem 1rem;
border-radius: var(--radius-xl);

View File

@@ -88,7 +88,7 @@ interface YamlDiagnostic {
label { color: rgba(212, 201, 168, 0.5); font-weight: var(--font-weight-semibold); }
textarea { width: 100%; background: var(--color-surface-inverse); color: var(--color-text-primary); border: 1px solid var(--color-border-primary); border-radius: var(--radius-xl); padding: 0.75rem; font-family: 'Monaco','Consolas', monospace; }
.toolbar { display: flex; gap: 0.5rem; align-items: center; }
button { background: var(--color-status-info-text); border: 1px solid var(--color-status-info-text); color: var(--color-text-primary); border-radius: var(--radius-lg); padding: 0.4rem 0.8rem; cursor: pointer; }
button { background: var(--color-btn-primary-bg); border: 1px solid var(--color-btn-primary-bg); color: var(--color-text-primary); border-radius: var(--radius-lg); padding: 0.4rem 0.8rem; cursor: pointer; }
button:disabled { opacity: 0.6; cursor: not-allowed; }
.pill { border: 1px solid var(--color-border-primary); padding: 0.3rem 0.6rem; border-radius: var(--radius-full); }
.pill--ok { border-color: var(--color-status-success); color: var(--color-status-success); }