ui: Centralize monospace font styles in app.css (ggml-org#23272)

Author: allozaur

tools/ui/src/app.css

@@ -40,6 +40,9 @@
 	--sidebar-ring: oklch(0.708 0 0);
 	--code-background: oklch(0.985 0 0);
 	--code-foreground: oklch(0.145 0 0);
+	--font-mono:
+		ui-monospace, SFMono-Regular, 'SF Mono', Monaco, 'Cascadia Code', 'Roboto Mono', Consolas,
+		'Liberation Mono', Menlo, monospace;
 	--layer-popover: 1000000;
 
 	--chat-form-area-height: 8rem;
@@ -172,6 +175,10 @@
 	*::-webkit-scrollbar-thumb:hover {
 		background: hsl(var(--muted-foreground) / 0.5);
 	}
+
+	:where(code, pre, kbd, samp) {
+		font-family: var(--font-mono);
+	}
 }
 
 @layer utilities {

tools/ui/src/lib/components/app/chat/ChatMessages/ChatMessage/ChatMessageAssistant/ChatMessageAssistant.svelte

@@ -379,9 +379,6 @@
 		border-radius: 1rem;
 		background: hsl(var(--muted) / 0.3);
 		color: var(--foreground);
-		font-family:
-			ui-monospace, SFMono-Regular, 'SF Mono', Monaco, 'Cascadia Code', 'Roboto Mono', Consolas,
-			'Liberation Mono', Menlo, monospace;
 		font-size: 0.875rem;
 		line-height: 1.6;
 		white-space: pre-wrap;

tools/ui/src/lib/components/app/content/MarkdownContent/MarkdownContent.svelte

@@ -742,9 +742,6 @@
 		padding: 0.125rem 0.375rem;
 		border-radius: 0.375rem;
 		font-size: 0.875rem;
-		font-family:
-			ui-monospace, SFMono-Regular, 'SF Mono', Monaco, 'Cascadia Code', 'Roboto Mono', Consolas,
-			'Liberation Mono', Menlo, monospace;
 	}
 
 	div :global(pre) {

tools/ui/src/lib/components/app/content/SyntaxHighlightedCode.svelte

@@ -80,12 +80,6 @@
 </div>
 
 <style>
-	.code-preview-wrapper {
-		font-family:
-			ui-monospace, SFMono-Regular, 'SF Mono', Monaco, 'Cascadia Code', 'Roboto Mono', Consolas,
-			'Liberation Mono', Menlo, monospace;
-	}
-
 	.code-preview-wrapper pre {
 		background: transparent;
 	}