fix: use correct DS CSS variables for modal background
Replace non-existent --surface-1/--surface-2 with --bg-raised (modal) and --bg-hover (subtle backgrounds) from the design system. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -9,7 +9,7 @@
|
||||
}
|
||||
|
||||
.modal {
|
||||
background: var(--surface-1);
|
||||
background: var(--bg-raised);
|
||||
border: 1px solid var(--border);
|
||||
border-radius: 12px;
|
||||
width: min(800px, 90vw);
|
||||
@@ -87,7 +87,7 @@
|
||||
}
|
||||
|
||||
.claimCode {
|
||||
background: var(--surface-2, var(--surface-1));
|
||||
background: var(--bg-hover);
|
||||
padding: 2px 6px;
|
||||
border-radius: 4px;
|
||||
font-family: var(--font-mono);
|
||||
@@ -103,7 +103,7 @@
|
||||
}
|
||||
|
||||
.pillMatch {
|
||||
background: var(--surface-2, var(--surface-1));
|
||||
background: var(--bg-hover);
|
||||
color: var(--text-secondary, var(--text-muted));
|
||||
}
|
||||
|
||||
@@ -147,7 +147,7 @@
|
||||
|
||||
.iconBtn:hover {
|
||||
color: var(--text);
|
||||
background: var(--surface-2, var(--surface-1));
|
||||
background: var(--bg-hover);
|
||||
}
|
||||
|
||||
.iconBtn:disabled {
|
||||
@@ -213,7 +213,7 @@
|
||||
}
|
||||
|
||||
.testToggle:hover {
|
||||
background: var(--surface-2, var(--surface-1));
|
||||
background: var(--bg-hover);
|
||||
}
|
||||
|
||||
.testToggleLabel {
|
||||
@@ -244,7 +244,7 @@
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
height: 140px;
|
||||
background: var(--surface-2, var(--surface-1));
|
||||
background: var(--bg-hover);
|
||||
border: 1px solid var(--border);
|
||||
border-radius: 6px;
|
||||
padding: 10px;
|
||||
@@ -256,7 +256,7 @@
|
||||
|
||||
.testResults {
|
||||
flex: 1;
|
||||
background: var(--surface-2, var(--surface-1));
|
||||
background: var(--bg-hover);
|
||||
border: 1px solid var(--border);
|
||||
border-radius: 6px;
|
||||
padding: 12px;
|
||||
|
||||
Reference in New Issue
Block a user