diff options
| author | Miguel Solorio <[email protected]> | 2025-08-14 23:18:39 -0700 |
|---|---|---|
| committer | GitHub <[email protected]> | 2025-08-15 06:18:39 +0000 |
| commit | 2e6c3580df6fd54b0115f541d48e35f706b06ac9 (patch) | |
| tree | 7ed1b52d1820bde1e657922c964dabf8cfe92b67 /packages/cli/src | |
| parent | 2690123af0969fead14f4a106119cd6d82fdcbc1 (diff) | |
Stylize diff line numbers & characters (#6269)
Diffstat (limited to 'packages/cli/src')
| -rw-r--r-- | packages/cli/src/ui/components/messages/DiffRenderer.tsx | 27 |
1 files changed, 24 insertions, 3 deletions
diff --git a/packages/cli/src/ui/components/messages/DiffRenderer.tsx b/packages/cli/src/ui/components/messages/DiffRenderer.tsx index 7f130b3f..fda5f1d4 100644 --- a/packages/cli/src/ui/components/messages/DiffRenderer.tsx +++ b/packages/cli/src/ui/components/messages/DiffRenderer.tsx @@ -10,6 +10,7 @@ import { Colors } from '../../colors.js'; import crypto from 'crypto'; import { colorizeCode, colorizeLine } from '../../utils/CodeColorizer.js'; import { MaxSizedBox } from '../shared/MaxSizedBox.js'; +import { theme } from '../../semantic-colors.js'; interface DiffLine { type: 'add' | 'del' | 'context' | 'hunk' | 'other'; @@ -287,7 +288,16 @@ const renderDiffContent = ( acc.push( <Box key={lineKey} flexDirection="row"> - <Text color={Colors.Gray}> + <Text + color={theme.text.secondary} + backgroundColor={ + line.type === 'add' + ? theme.background.diff.added + : line.type === 'del' + ? theme.background.diff.removed + : undefined + } + > {gutterNumStr.padStart(gutterWidth)}{' '} </Text> {line.type === 'context' ? ( @@ -300,11 +310,22 @@ const renderDiffContent = ( ) : ( <Text backgroundColor={ - line.type === 'add' ? Colors.DiffAdded : Colors.DiffRemoved + line.type === 'add' + ? theme.background.diff.added + : theme.background.diff.removed } wrap="wrap" > - {prefixSymbol} {colorizeLine(displayContent, language)} + <Text + color={ + line.type === 'add' + ? theme.status.success + : theme.status.error + } + > + {prefixSymbol} + </Text>{' '} + {colorizeLine(displayContent, language)} </Text> )} </Box>, |