1 files changed, 33 insertions, 31 deletions
diff --git a/apps/web/src/components/ui/font-picker.tsx b/apps/web/src/components/ui/font-picker.tsx
index 7bb11274..1806b48a 100644
--- a/apps/web/src/components/ui/font-picker.tsx
+++ b/apps/web/src/components/ui/font-picker.tsx
@@ -1,40 +1,42 @@
 import {
-  Select,
-  SelectContent,
-  SelectItem,
-  SelectTrigger,
-  SelectValue,
+	Select,
+	SelectContent,
+	SelectItem,
+	SelectTrigger,
+	SelectValue,
 } from "@/components/ui/select";
-import { FONT_OPTIONS, FontFamily } from "@/constants/font-constants";
+import { FONT_OPTIONS, type FontFamily } from "@/constants/font-constants";
 
 interface FontPickerProps {
-  defaultValue?: FontFamily;
-  onValueChange?: (value: FontFamily) => void;
-  className?: string;
+	defaultValue?: FontFamily;
+	onValueChange?: (value: FontFamily) => void;
+	className?: string;
 }
 
 export function FontPicker({
-  defaultValue,
-  onValueChange,
-  className,
+	defaultValue,
+	onValueChange,
+	className,
 }: FontPickerProps) {
-  return (
-    <Select defaultValue={defaultValue} onValueChange={onValueChange}>
-      <SelectTrigger className={`w-full bg-panel-accent h-8 text-xs ${className || ""}`}>
-        <SelectValue placeholder="Select a font" />
-      </SelectTrigger>
-      <SelectContent>
-        {FONT_OPTIONS.map((font) => (
-          <SelectItem
-            key={font.value}
-            value={font.value}
-            className="text-xs"
-            style={{ fontFamily: font.value }}
-          >
-            {font.label}
-          </SelectItem>
-        ))}
-      </SelectContent>
-    </Select>
-  );
+	return (
+		<Select defaultValue={defaultValue} onValueChange={onValueChange}>
+			<SelectTrigger
+				className={`bg-panel-accent h-9 w-full text-base ${className || ""}`}
+			>
+				<SelectValue placeholder="Select a font" className="text-sm" />
+			</SelectTrigger>
+			<SelectContent>
+				{FONT_OPTIONS.map((font) => (
+					<SelectItem
+						key={font.value}
+						value={font.value}
+						className="text-sn"
+						style={{ fontFamily: font.value }}
+					>
+						{font.label}
+					</SelectItem>
+				))}
+			</SelectContent>
+		</Select>
+	);
 }