fix(settings): restore full border on active server card (#998)

* fix(settings): restore full border on active server card

The active server card mixed the `border` shorthand with borderTop/
borderBottom longhands in one inline style object. React clears the
unset longhand sides on mount, so the top and bottom borders fell back
to the subtle base border while only the left/right accent border
showed. Drive the drag drop-target indicator via an inset box-shadow
instead, leaving the border shorthand to apply on all four sides.

* docs(changelog): note active server card border fix (#998)
This commit is contained in:
Frank Stellmacher
2026-06-05 11:46:35 +02:00
committed by GitHub
parent d1320ea2c8
commit 5f345dc7aa
2 changed files with 20 additions and 2 deletions
+10 -2
View File
@@ -381,8 +381,16 @@ export function ServersTab({
style={{
border: isActive ? '1px solid var(--accent)' : undefined,
background: isActive ? 'color-mix(in srgb, var(--accent) 10%, var(--bg-card))' : undefined,
borderTop: isBefore ? '2px solid var(--accent)' : undefined,
borderBottom: isAfter ? '2px solid var(--accent)' : undefined,
// Drop-target indicator via inset shadow rather than
// borderTop/borderBottom: mixing the `border` shorthand with
// border-side longhands in one inline style object makes React
// clear the unset sides, which drops the top/bottom border on
// the active card (only left/right remain).
boxShadow: isBefore
? 'inset 0 2px 0 0 var(--accent)'
: isAfter
? 'inset 0 -2px 0 0 var(--accent)'
: undefined,
}}
>
<div style={{ display: 'flex', alignItems: 'stretch', gap: '0.75rem' }}>