Added style for details editor textarea

frontend/src/metabase/components/Item.jsx

@@ -23,7 +23,12 @@ const Item = ({ id, name, description, placeholder, url, icon, isEditing, field
             </div>
             <div className={cx(S.itemSubtitle, { "mt1" : true })}>
                 { isEditing ?
-                    <textarea placeholder={placeholder} {...field} defaultValue={description} /> :
+                    <textarea
+                        className={S.itemTextArea}
+                        placeholder={placeholder}
+                        {...field}
+                        defaultValue={description}
+                    /> :
                     description || placeholder || 'No description yet'
                 }
             </div>

frontend/src/metabase/components/List.css

-/*TODO: read up more about css modules and find out why it was done this way*/
-/*@import '../Questions.css';*/
 :root {
     --title-color: #606E7B;
     --subtitle-color: #AAB7C3;
@@ -23,13 +21,19 @@
 }
 
 :local(.header) {
-
-    /*composes: header from "../Questions.css";*/
     composes: mt4 mb2 from "style";
     color: var(--title-color);
     font-size: 24px;
 }
 
+:local(.headerLink) {
+
+}
+
+:local(.headerButton) {
+
+}
+
 :local(.empty) {
     composes:  flex align-center justify-center from "style";
     composes: full from "style";
@@ -60,7 +64,7 @@
     composes: inline-block from "style";
 }
 
-:local(.itemName):hover {
+:local(a.itemName):hover {
     color: var(--blue-color);
 }
 
@@ -73,6 +77,15 @@
     color: var(--title-color);
 }
 
+:local(.itemTextArea) {
+    resize: none;
+    padding: 20px;
+    font-size: 14px;
+    width: 100%;
+    min-height: 100px;
+    border-color: var(--subtitle-color);
+}
+
 :local(.icons) {
     composes: flex flex-row align-center from "style";
 }