feat(web): one control geometry for buttons and chips
Buttons, chips, toggles and the search input converge on --control-h 2rem with --text-xs shared, and .control becomes an inline-flex so anchor text centres in the title-detail action bar. Chip colour is untouched (#165 owns it). Verified in agent-browser at 1440px, 46rem and 40rem; the release deck keeps its column widths and does not scroll horizontally.
This commit is contained in:
+10
-8
@@ -94,6 +94,7 @@
|
||||
--space-12: 3rem;
|
||||
|
||||
--radius: 4px;
|
||||
--control-h: 2rem;
|
||||
--ease-out: cubic-bezier(0.25, 1, 0.5, 1);
|
||||
}
|
||||
|
||||
@@ -442,10 +443,13 @@ body {
|
||||
/* ---- controls -------------------------------------------------------- */
|
||||
|
||||
.control {
|
||||
min-height: 2.75rem;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
min-height: var(--control-h);
|
||||
padding: 0 var(--space-4);
|
||||
font-family: var(--font-readout);
|
||||
font-size: var(--text-sm);
|
||||
font-size: var(--text-xs);
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.08em;
|
||||
color: var(--accent);
|
||||
@@ -497,7 +501,7 @@ body {
|
||||
|
||||
.search-input {
|
||||
width: 100%;
|
||||
min-height: 2.75rem;
|
||||
min-height: var(--control-h);
|
||||
padding: 0 var(--space-8) 0 var(--space-3);
|
||||
color: var(--ink);
|
||||
background: var(--ground);
|
||||
@@ -634,7 +638,7 @@ body {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: var(--space-1);
|
||||
min-height: 1.375rem;
|
||||
min-height: var(--control-h);
|
||||
padding: 0 var(--space-2);
|
||||
background: var(--panel-raised);
|
||||
border: 1px solid var(--line);
|
||||
@@ -996,7 +1000,7 @@ body {
|
||||
|
||||
.bucket-toggle {
|
||||
margin-left: auto;
|
||||
min-height: 2.75rem;
|
||||
min-height: var(--control-h);
|
||||
padding: 0 var(--space-2);
|
||||
font-size: var(--text-xs);
|
||||
text-transform: uppercase;
|
||||
@@ -1175,7 +1179,7 @@ body {
|
||||
}
|
||||
|
||||
.view-btn {
|
||||
min-height: 1.75rem;
|
||||
min-height: var(--control-h);
|
||||
padding: 0 var(--space-2);
|
||||
font-family: var(--font-readout);
|
||||
font-size: var(--text-xs);
|
||||
@@ -1373,7 +1377,6 @@ body {
|
||||
/* the tracked toggle reads as the rule it is; pressed = on */
|
||||
.season-line .control,
|
||||
.ep-actions .control {
|
||||
min-height: 2.25rem;
|
||||
padding: 0 var(--space-3);
|
||||
}
|
||||
|
||||
@@ -1654,7 +1657,6 @@ body {
|
||||
}
|
||||
|
||||
.movie-controls .control {
|
||||
min-height: 2.25rem;
|
||||
padding: 0 var(--space-3);
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user