diff --git a/packages/app/src/components/add-host-modal.tsx b/packages/app/src/components/add-host-modal.tsx
index 0cf95858e..dc4a0ee02 100644
--- a/packages/app/src/components/add-host-modal.tsx
+++ b/packages/app/src/components/add-host-modal.tsx
@@ -489,7 +489,7 @@ export function AddHostModal({ visible, onClose, onCancel, onSaved }: AddHostMod
{useTls ? (
-
+
) : null}
diff --git a/packages/app/src/components/composer.tsx b/packages/app/src/components/composer.tsx
index dc29e28fd..9d3eabe21 100644
--- a/packages/app/src/components/composer.tsx
+++ b/packages/app/src/components/composer.tsx
@@ -463,7 +463,7 @@ function QueuedMessageRow({ item, onEdit, onSendNow }: QueuedMessageRowProps) {
accessibilityLabel="Send queued message now"
accessibilityRole="button"
>
-
+
@@ -1847,6 +1847,7 @@ const styles = StyleSheet.create((theme: Theme) => ({
const QUEUE_SEND_BUTTON_STYLE = [styles.queueActionButton, styles.queueSendButton];
const ThemedPencil = withUnistyles(Pencil);
+const ThemedArrowUp = withUnistyles(ArrowUp);
const ThemedGitPullRequest = withUnistyles(GitPullRequest);
const ThemedCircleDot = withUnistyles(CircleDot);
const ThemedAudioLines = withUnistyles(AudioLines);
@@ -1855,3 +1856,4 @@ const ThemedGithub = withUnistyles(Github);
const iconForegroundMapping = (theme: Theme) => ({ color: theme.colors.foreground });
const iconForegroundMutedMapping = (theme: Theme) => ({ color: theme.colors.foregroundMuted });
+const iconAccentForegroundMapping = (theme: Theme) => ({ color: theme.colors.accentForeground });
diff --git a/packages/app/src/components/dictation-controls.tsx b/packages/app/src/components/dictation-controls.tsx
index 9a382fcc5..cc12a26de 100644
--- a/packages/app/src/components/dictation-controls.tsx
+++ b/packages/app/src/components/dictation-controls.tsx
@@ -166,16 +166,16 @@ export function DictationOverlay({
[actionsDisabled, isFailed],
);
const overlayTimerTextStyle = useMemo(
- () => [overlayStyles.timerText, { color: theme.colors.palette.white }],
- [theme.colors.palette.white],
+ () => [overlayStyles.timerText, { color: theme.colors.accentForeground }],
+ [theme.colors.accentForeground],
);
const overlayTranscriptTextStyle = useMemo(
- () => [overlayStyles.transcriptText, { color: theme.colors.palette.white, opacity: 0.95 }],
- [theme.colors.palette.white],
+ () => [overlayStyles.transcriptText, { color: theme.colors.accentForeground, opacity: 0.95 }],
+ [theme.colors.accentForeground],
);
const overlayRetryButtonStyle = useMemo(
- () => [overlayStyles.actionButton, { backgroundColor: theme.colors.palette.white }],
- [theme.colors.palette.white],
+ () => [overlayStyles.actionButton, { backgroundColor: theme.colors.accentForeground }],
+ [theme.colors.accentForeground],
);
const overlayConfirmButtonStyle = overlayRetryButtonStyle;
@@ -192,7 +192,7 @@ export function DictationOverlay({
accessibilityLabel="Cancel dictation"
style={overlayCancelButtonStyle}
>
-
+
@@ -202,7 +202,7 @@ export function DictationOverlay({
isMuted={false}
isSpeaking={false}
orientation="horizontal"
- color={theme.colors.palette.white}
+ color={theme.colors.accentForeground}
/>
{formatDuration(duration)}
@@ -216,7 +216,7 @@ export function DictationOverlay({
{actionsDisabled ? (
-
+
) : null}
{!actionsDisabled && isFailed ? (
@@ -239,7 +239,7 @@ export function DictationOverlay({
>
diff --git a/packages/app/src/components/message-input.tsx b/packages/app/src/components/message-input.tsx
index ed4409b2a..4b5b9cf38 100644
--- a/packages/app/src/components/message-input.tsx
+++ b/packages/app/src/components/message-input.tsx
@@ -315,12 +315,12 @@ function SendButtonContent({
buttonIconSize: number;
}) {
if (isSubmitLoading) {
- return ;
+ return ;
}
if (submitIcon === "return") {
- return ;
+ return ;
}
- return ;
+ return ;
}
function resolveSubmitAccessibilityLabel(input: {
@@ -1977,10 +1977,14 @@ const styles = StyleSheet.create((theme: Theme) => ({
const ThemedPlus = withUnistyles(Plus);
const ThemedMic = withUnistyles(Mic);
const ThemedMicOff = withUnistyles(MicOff);
+const ThemedArrowUp = withUnistyles(ArrowUp);
+const ThemedCornerDownLeft = withUnistyles(CornerDownLeft);
+const ThemedActivityIndicator = withUnistyles(ActivityIndicator);
const ThemedTextInput = withUnistyles(TextInput);
const iconForegroundMapping = (theme: Theme) => ({ color: theme.colors.foreground });
const iconForegroundMutedMapping = (theme: Theme) => ({ color: theme.colors.foregroundMuted });
+const iconAccentForegroundMapping = (theme: Theme) => ({ color: theme.colors.accentForeground });
const textInputPlaceholderColorMapping = (theme: Theme) => ({
placeholderTextColor: theme.colors.surface4,
});
diff --git a/packages/app/src/styles/theme.ts b/packages/app/src/styles/theme.ts
index 6017f5c2f..ac2a9d112 100644
--- a/packages/app/src/styles/theme.ts
+++ b/packages/app/src/styles/theme.ts
@@ -235,6 +235,7 @@ interface DarkThemeConfig {
borderAccent: string;
accent: string;
accentBright: string;
+ accentForeground?: string;
destructive: string;
}
@@ -277,7 +278,7 @@ function buildDarkSemanticColors(tint: DarkThemeConfig) {
accent: tint.accent,
accentBright: tint.accentBright,
- accentForeground: "#ffffff",
+ accentForeground: tint.accentForeground ?? "#ffffff",
destructive: tint.destructive,
destructiveForeground: "#ffffff",
@@ -352,8 +353,9 @@ const zincDarkColors = buildDarkSemanticColors({
scrollbarHandle: "#71717a",
border: "#27272a",
borderAccent: "#303036",
- accent: "#20744A",
- accentBright: "#7ccba0",
+ accent: "#e4e4e7",
+ accentBright: "#fafafa",
+ accentForeground: "#18181b", // monochrome zinc accent is near-white — needs dark text
destructive: "#c44a4a", // neutral red, hue 0 — clearly red without screaming
});