style(textarea): Use monospace font

DiggidyDev · Mar 25, 2024 · 75d6a2f · 75d6a2f
1 parent cdd821e
commit 75d6a2f
Showing 1 changed file with 4 additions and 1 deletion.
diff --git a/src/app/components/TextArea/TextArea.tsx b/src/app/components/TextArea/TextArea.tsx
@@ -1,3 +1,4 @@
+import { JetBrains_Mono } from "next/font/google";
 import type { ChangeEvent, HTMLProps } from "react";
 import { Dispatch, SetStateAction } from "react";
 import { Label } from "../Label/Label";
@@ -9,6 +10,8 @@ export interface TextAreaProps extends HTMLProps<HTMLTextAreaElement> {
     setValue?: Dispatch<SetStateAction<string>>;
 }
 
+const mono = JetBrains_Mono({ subsets: ["latin"] });
+
 export function TextArea({
     label,
     testId,
@@ -60,7 +63,7 @@ function StyledTextArea({ className = "", ...props }: StyledTextAreaProps) {
     return (
         <textarea
             {...props}
-            className={`w-full h-full break-normal p-2 disabled:text-gray-300 disabled:overflow-hidden disabled:bg-gray-300 dark:disabled:bg-slate-800 disabled:cursor-not-allowed dark:bg-slate-700 rounded-md drop-shadow-lg dark:shadow-2xl resize-none ${className}`}
+            className={`${mono.className} w-full h-full break-normal p-2 disabled:text-gray-300 disabled:overflow-hidden disabled:bg-gray-300 dark:disabled:bg-slate-800 disabled:cursor-not-allowed dark:bg-slate-700 rounded-md drop-shadow-lg dark:shadow-2xl resize-none ${className}`}
         />
     );
 }