From 0370e8083a578cde80130444d6333eddae6b7ee7 Mon Sep 17 00:00:00 2001
From: Eva <eva.marco@kaleidos.net>
Date: Tue, 16 Jan 2024 16:59:26 +0100
Subject: [PATCH] :bug: Fix description title on feedback

---
 .../src/app/main/ui/components/forms.cljs     | 18 ++++++-------
 .../src/app/main/ui/components/forms.scss     | 27 ++++++++++---------
 2 files changed, 23 insertions(+), 22 deletions(-)

diff --git a/frontend/src/app/main/ui/components/forms.cljs b/frontend/src/app/main/ui/components/forms.cljs
index c3253eb8f..3cf025ea0 100644
--- a/frontend/src/app/main/ui/components/forms.cljs
+++ b/frontend/src/app/main/ui/components/forms.cljs
@@ -202,17 +202,15 @@
                          :on-change on-change)
                   (obj/clj->props))]
 
-    [:div.custom-input
-     {:class klass}
-     [:*
-      [:label label]
-      [:> :textarea props]
-      (cond
-        (and touched? (:message error))
-        [:span.error (tr (:message error))]
+    [:div {:class (dm/str klass " " (stl/css :textarea-wrapper))}
+     [:label {:class (stl/css :textarea-label)} label]
+     [:> :textarea props]
+     (cond
+       (and touched? (:message error))
+       [:span {:class (stl/css :error)} (tr (:message error))]
 
-        (string? hint)
-        [:span.hint hint])]]))
+       (string? hint)
+       [:span {:class (stl/css :hint)} hint])]))
 
 (mf/defc select
   [{:keys [options disabled form default] :as props
diff --git a/frontend/src/app/main/ui/components/forms.scss b/frontend/src/app/main/ui/components/forms.scss
index b9d2c104a..2ee39783a 100644
--- a/frontend/src/app/main/ui/components/forms.scss
+++ b/frontend/src/app/main/ui/components/forms.scss
@@ -72,7 +72,6 @@
       }
     }
   }
-
   &.valid .help-icon,
   &.invalid .help-icon {
     right: $s-40;
@@ -98,6 +97,7 @@
     height: $s-16;
   }
 }
+
 .invalid-icon {
   width: $s-16;
   height: $s-16;
@@ -261,7 +261,6 @@
 }
 
 // MULTI INPUT
-
 .custom-multi-input {
   display: flex;
   flex-direction: column;
@@ -338,19 +337,9 @@
       }
     }
   }
-  &.empty {
-  }
-  &.invalid {
-  }
-
-  &.focus {
-  }
-  &.valid {
-  }
 }
 
 // RADIO BUTTONS
-
 .custom-radio {
   display: grid;
   grid-template-columns: repeat(3, 1fr);
@@ -410,3 +399,17 @@
     border: $s-1 solid var(--input-border-color-active);
   }
 }
+
+//TEXTAREA
+
+.textarea-label {
+  @include tabTitleTipography;
+  color: var(--modal-title-foreground-color);
+  text-transform: uppercase;
+  margin-bottom: $s-8;
+}
+
+.textarea-wrapper {
+  display: grid;
+  grid-template-rows: auto 1fr;
+}