Give Gemini Code a face lift.

- This utilizes `ink-gradient` to render GEMINI CODE in amazing colors.
- Added a shared color configuration for UX (should this be in config?). It's very possible that we shouldn't be talking about the specific colors and instead be mentioning "foreground"/"background"/inlineCode etc. type colors.
- Updated existing color usages to utilize `Colors.*`

Fixes https://b.corp.google.com/issues/411385593

1 files changed, 3 insertions, 2 deletions

diff --git a/packages/cli/src/ui/components/messages/GeminiMessage.tsx b/packages/cli/src/ui/components/messages/GeminiMessage.tsx
index 08f6cc68..3319dd63 100644
--- a/packages/cli/src/ui/components/messages/GeminiMessage.tsx
+++ b/packages/cli/src/ui/components/messages/GeminiMessage.tsx
@@ -7,6 +7,7 @@
 import React from 'react';
 import { Text, Box } from 'ink';
 import { MarkdownRenderer } from '../../utils/MarkdownRenderer.js';
+import { Colors } from '../../colors.js';
 
 interface GeminiMessageProps {
   text: string;
@@ -28,7 +29,7 @@ export const GeminiMessage: React.FC<GeminiMessageProps> = ({ text }) => {
     return (
       <Box flexDirection="row">
         <Box width={prefixWidth}>
-          <Text color="blue">{prefix}</Text>
+          <Text color={Colors.AccentPurple}>{prefix}</Text>
         </Box>
         <Box flexGrow={1}></Box>
       </Box>
@@ -38,7 +39,7 @@ export const GeminiMessage: React.FC<GeminiMessageProps> = ({ text }) => {
   return (
     <Box flexDirection="row">
       <Box width={prefixWidth}>
-        <Text color="blue">{prefix}</Text>
+        <Text color={Colors.AccentPurple}>{prefix}</Text>
       </Box>
       <Box flexGrow={1} flexDirection="column">
         {renderedBlocks}