MediaMetz/gemini-cli
1
0
Fork 0
mirror of https://github.com/google-gemini/gemini-cli.git synced 2026-05-12 12:54:07 -07:00
Code Issues Packages Projects Releases Wiki Activity

feat(ui): use primary color for /colors summary and remove background row gaps

Browse Source
This commit is contained in:
Keith Guerin
2026-02-26 13:59:33 -08:00
parent d9a2d080f7
commit 800aa60f9b
1 changed files with 9 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/cli/src/ui/components/ColorsDisplay.tsx
+9 -11
View File
@@ -134,35 +134,33 @@ export const ColorsDisplay: React.FC = () => {
<Text bold color={theme.text.accent}> <Text bold color={theme.text.accent}>
/colors - Theme Colors Demo /colors - Theme Colors Demo
</Text> </Text>
<Text color={theme.text.secondary}> <Text color={theme.text.primary}>
The purpose of this feature is to visualize how colors are used in the The purpose of this feature is to visualize how colors are used in the
app, test across a variety of Terminals (Mac Terminal, Ghostty, app, test across a variety of Terminals (Mac Terminal, Ghostty,
iTerm2, VSCode, etc), and see how the colors change across different iTerm2, VSCode, etc), and see how the colors change across different
themes. themes.
</Text> </Text>
<Box marginTop={1} flexDirection="column"> <Box marginTop={1} flexDirection="column">
<Text color={theme.text.secondary}> <Text color={theme.text.primary}>
<Text bold color={theme.text.primary}> <Text bold>How themes and terminals interact:</Text>
How themes and terminals interact:
</Text>
</Text> </Text>
<Box marginLeft={2} flexDirection="column"> <Box marginLeft={2} flexDirection="column">
<Text color={theme.text.secondary}> <Text color={theme.text.primary}>
• <Text bold>TrueColor (Hex):</Text> Modern terminals (iTerm2, • <Text bold>TrueColor (Hex):</Text> Modern terminals (iTerm2,
Ghostty, VSCode) render hex codes exactly. They are{' '} Ghostty, VSCode) render hex codes exactly. They are{' '}
<Text italic>not</Text> overridden by terminal app themes. <Text italic>not</Text> overridden by terminal app themes.
</Text> </Text>
<Text color={theme.text.secondary}> <Text color={theme.text.primary}>
• <Text bold>ANSI Names:</Text> Colors like &apos;red&apos; or • <Text bold>ANSI Names:</Text> Colors like &apos;red&apos; or
&apos;green&apos; (used in our ANSI theme) <Text italic>are</Text>{' '} &apos;green&apos; (used in our ANSI theme) <Text italic>are</Text>{' '}
mapped to your terminal app&apos;s specific palette. mapped to your terminal app&apos;s specific palette.
</Text> </Text>
<Text color={theme.text.secondary}> <Text color={theme.text.primary}>
• <Text bold>Default colors:</Text> When Name or Value is • <Text bold>Default colors:</Text> When Name or Value is
&apos;(blank)&apos;, the app uses your terminal&apos;s default &apos;(blank)&apos;, the app uses your terminal&apos;s default
foreground/background. foreground/background.
</Text> </Text>
<Text color={theme.text.secondary}> <Text color={theme.text.primary}>
• <Text bold>Compatibility:</Text> In terminals with limited color • <Text bold>Compatibility:</Text> In terminals with limited color
(like older Mac Terminals), hex colors are automatically (like older Mac Terminals), hex colors are automatically
approximated to the closest available ANSI color. approximated to the closest available ANSI color.
@@ -170,9 +168,9 @@ export const ColorsDisplay: React.FC = () => {
</Box> </Box>
</Box> </Box>
<Box marginTop={1}> <Box marginTop={1}>
<Text color={theme.text.secondary}> <Text color={theme.text.primary}>
Active Theme:{' '} Active Theme:{' '}
<Text color={theme.text.primary} bold> <Text color={theme.text.accent} bold>
{activeTheme.name} {activeTheme.name}
</Text>{' '} </Text>{' '}
({activeTheme.type}) ({activeTheme.type})