style(ui): tweak compact ref and repo-tab-close sizing

Increase the compact reference overflow to 20px and slightly raise its
mono font to improve legibility and vertical alignment. Add explicit
square sizing and an aspect-ratio for the repo tab close control so
its icon and layout remain consistent across breakpoints and overrides.
Use !important on the size rules to ensure they take precedence.

- bump .compact-ref-overflow height and font-size for alignment
- add fixed sizing and aspect-ratio for repo tab close button
This commit is contained in:
2026-08-16 16:12:05 +02:00
parent 993179c25e
commit 33e85fe6be
+13 -3
View File
@@ -2960,15 +2960,15 @@
.compact-ref-overflow { .compact-ref-overflow {
flex: 0 0 auto; flex: 0 0 auto;
min-width: 29px; min-width: 29px;
min-height: 19px; min-height: 20px !important;
height: 19px; height: 20px !important;
padding: 0 5px; padding: 0 5px;
border-color: transparent; border-color: transparent;
border-radius: 4px; border-radius: 4px;
color: var(--color-ink-dim); color: var(--color-ink-dim);
background: rgba(255,255,255,0.025); background: rgba(255,255,255,0.025);
font-family: var(--font-mono); font-family: var(--font-mono);
font-size: 9px; font-size: 9.5px;
font-weight: 800; font-weight: 800;
} }
.compact-ref-overflow:hover:not(:disabled), .compact-ref-overflow:hover:not(:disabled),
@@ -6113,6 +6113,16 @@ input:focus, textarea:focus, select:focus { box-shadow: 0 0 0 3px color-mix(in s
.repo-tab-wrap:first-child { border-left: 1px solid var(--color-border-subtle); } .repo-tab-wrap:first-child { border-left: 1px solid var(--color-border-subtle); }
.repo-tab-wrap.active { background: var(--color-surface-solid); box-shadow: inset 0 -3px 0 var(--color-primary); } .repo-tab-wrap.active { background: var(--color-surface-solid); box-shadow: inset 0 -3px 0 var(--color-primary); }
.repo-tab { min-height: 45px; padding-left: 14px; font-size: 12.5px; } .repo-tab { min-height: 45px; padding-left: 14px; font-size: 12.5px; }
.repo-tab-close {
width: 26px;
min-width: 26px;
max-width: 26px;
height: 26px;
min-height: 26px;
max-height: 26px;
flex-basis: 26px;
aspect-ratio: 1;
}
.repo-tab-add { min-height: 45px; } .repo-tab-add { min-height: 45px; }
.repo-toolbar { .repo-toolbar {