fix: match button fill brightness in auto theme

The inverse label row renders bold-brightened in most dark terminals,
while the half-block fill rows drew in the plain default foreground,
splitting the button into gray/white/gray bands. Bold the fills too so
all three rows share one color. Hex-colored themes are unaffected.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
pablostanley
2026-07-16 21:31:18 -07:00
co-authored by Claude Fable 5
parent ab6c03a6f0
commit 993cc9ab47
+4 -2
View File
@@ -55,7 +55,9 @@ export function FramedInput({
</Box>
{button ? (
<Box flexDirection="column" width={buttonW}>
<Text color={fillColor} dimColor={buttonDim && theme.dimSecondary}>{'▄'.repeat(buttonW)}</Text>
{/* bold matches the label row: with `inverse`, terminals brighten the
bold default foreground, and the half-block fills must brighten too */}
<Text bold color={fillColor} dimColor={buttonDim && theme.dimSecondary}>{'▄'.repeat(buttonW)}</Text>
<Text
backgroundColor={theme.inverseButton ? undefined : fillColor}
color={theme.inverseButton ? undefined : theme.dark}
@@ -63,7 +65,7 @@ export function FramedInput({
dimColor={buttonDim && theme.dimSecondary}
bold
>{` ${button} `}</Text>
<Text color={fillColor} dimColor={buttonDim && theme.dimSecondary}>{'▀'.repeat(buttonW)}</Text>
<Text bold color={fillColor} dimColor={buttonDim && theme.dimSecondary}>{'▀'.repeat(buttonW)}</Text>
</Box>
) : null}
</Box>