From 18c36e651d6ee469e846f7b770b8a1ffc8b82a6d Mon Sep 17 00:00:00 2001
From: gak <gak@gak0.com>
Date: Thu, 25 Jul 2024 06:39:29 +1000
Subject: [PATCH] fix: theme and a bit nicer

---
 frontend/src/components/CodeEditor.tsx | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/frontend/src/components/CodeEditor.tsx b/frontend/src/components/CodeEditor.tsx
index ac9eb3d410..813feb595c 100644
--- a/frontend/src/components/CodeEditor.tsx
+++ b/frontend/src/components/CodeEditor.tsx
@@ -1,4 +1,5 @@
 import {useEffect, useState} from 'react'
+import {useDarkMode} from '../providers/dark-mode-provider.tsx'
 
 export interface InitialState {
   initialText: string
@@ -11,6 +12,7 @@ export const CodeEditor = (
     { initialState: InitialState, onTextChanged?: (text: string) => void }
 ) => {
   const [editorText, setEditorText] = useState(initialState.initialText)
+  const { isDarkMode } = useDarkMode()
 
   useEffect(() => {
     setEditorText(initialState.initialText)
@@ -23,12 +25,14 @@ export const CodeEditor = (
     }
   }
 
+  const extraClass = (isDarkMode) ? 'bg-gray-800 text-white' : 'bg-gray-100 text-black'
+
   return (
     <textarea
       value={editorText}
       readOnly={initialState.readonly}
       onChange={(e) => handleChange(e.target.value)}
-      style={{ width: '100%',fontFamily: 'monospace' }}
+      className={`w-full h-full p-2 text-sm font-mono ${extraClass}`}
     />
   )
 }