Fix markdown editor styling

Author: guanquann

frontend/src/components/QuestionMarkdown/index.css

@@ -0,0 +1,7 @@
+.w-md-editor-text-pre > code,
+.w-md-editor-text-input,
+.wmde-markdown {
+  font-size: 16px !important;
+  line-height: 24px !important;
+  font-family: "Roboto", "Helvetica", "Arial", sans-serif;
+}

frontend/src/components/QuestionMarkdown/index.tsx

@@ -1,5 +1,6 @@
 import MDEditor, { commands } from "@uiw/react-md-editor";
 import { Stack } from "@mui/material";
+import "./index.css";
 
 interface QuestionMarkdownProps {
   markdownText: string;
@@ -10,6 +11,9 @@ const QuestionMarkdown: React.FC<QuestionMarkdownProps> = ({ markdownText, setMa
   return (
     <Stack data-color-mode="light" paddingTop={2}>
       <MDEditor
+        textareaProps={{
+          placeholder: "Description",
+        }}
         value={markdownText}
         onChange={(value) => setMarkdownText(value || "")}
         preview="edit"

frontend/src/pages/NewQuestion/index.tsx

@@ -72,8 +72,11 @@ const NewQuestion = () => {
         continue;
       }
 
+      const blob = new Blob([file], { type: file.type });
+
+      // this parts onwards should be in the backend...
       const storageRef = ref(storage, uuidv4());
-      const uploadTask = uploadBytesResumable(storageRef, file);
+      const uploadTask = uploadBytesResumable(storageRef, blob);
 
       uploadTask.on(
         "state_changed",