work on styles

components/TextAreaInput.tsx

@@ -6,17 +6,31 @@ export default function TextAreaInput({
   placeholder,
   onchange,
   value,
+  styles = '',
 }: {
   text: string
   name: string
   placeholder: string
   onchange: (name: string, event: ChangeEvent<{ value: string }>) => void
   value: string
+  styles?: string
 }) {
   return (
-    <label>
-      {text}
-      <textarea className={name} placeholder={placeholder} onChange={onchange.bind(null, name)} value={value} />
-    </label>
+    <div>
+      <label htmlFor={name} className="block text-sm font-medium text-gray-700">
+        {text}
+      </label>
+      <div className="mt-1">
+        <textarea
+          id="about"
+          name="about"
+          rows={10}
+          className={`shadow-sm focus:ring-indigo-500 focus:border-indigo-500 mt-1 block w-full sm:text-sm border-gray-300 rounded-md ${styles}`}
+          placeholder={placeholder}
+          onChange={onchange.bind(null, name)}
+          value={value}
+        ></textarea>
+      </div>
+    </div>
   )
 }