From 5f1c28e588c1893daec949914943a1f0301bec29 Mon Sep 17 00:00:00 2001
From: ArneBo <arne@ecobasa.org>
Date: Fri, 24 Jan 2025 03:01:43 +0100
Subject: [PATCH] fix(ui): Textarea smaller and ghost buttons

---
 front/src/components/ui/Textarea.vue  | 22 +++++++++++-----------
 front/src/components/ui/textarea.scss |  2 +-
 2 files changed, 12 insertions(+), 12 deletions(-)

diff --git a/front/src/components/ui/Textarea.vue b/front/src/components/ui/Textarea.vue
index 887a2dfa6..3f10a1bcb 100644
--- a/front/src/components/ui/Textarea.vue
+++ b/front/src/components/ui/Textarea.vue
@@ -196,25 +196,25 @@ const focus = () => textarea.value.focus()
         @keydown.ctrl.shift.x.exact.prevent="strikethrough" @keydown.ctrl.k.exact.prevent="link" :maxlength="max"
         :placeholder="placeholder" v-model="model" id="textarea_id" />
       <div class="textarea-buttons">
-        <Button @click="preview = !preview" icon="bi-eye" color="secondary" :aria-pressed="preview || undefined" />
+        <Button ghost @click="preview = !preview" icon="bi-eye" color="secondary" :aria-pressed="preview || undefined" />
 
         <div class="separator" />
 
-        <Button @click="heading1" icon="bi-type-h1" color="secondary" :aria-pressed="isHeading1 || undefined" :disabled="preview" />
-        <Button @click="heading2" icon="bi-type-h2" color="secondary" :aria-pressed="isHeading2 || undefined" :disabled="preview" />
-        <Button @click="paragraph" icon="bi-paragraph" color="secondary" :aria-pressed="isParagraph || undefined" :disabled="preview" />
-        <Button @click="quote" icon="bi-quote" color="secondary" :aria-pressed="isQuote || undefined" :disabled="preview" />
-        <Button @click="orderedList" icon="bi-list-ol" color="secondary" :aria-pressed="isOrderedList || undefined"
+        <Button ghost @click="heading1" icon="bi-type-h1" color="secondary" :aria-pressed="isHeading1 || undefined" :disabled="preview" />
+        <Button ghost @click="heading2" icon="bi-type-h2" color="secondary" :aria-pressed="isHeading2 || undefined" :disabled="preview" />
+        <Button ghost @click="paragraph" icon="bi-paragraph" color="secondary" :aria-pressed="isParagraph || undefined" :disabled="preview" />
+        <Button ghost @click="quote" icon="bi-quote" color="secondary" :aria-pressed="isQuote || undefined" :disabled="preview" />
+        <Button ghost @click="orderedList" icon="bi-list-ol" color="secondary" :aria-pressed="isOrderedList || undefined"
           :disabled="preview" />
-        <Button @click="unorderedList" icon="bi-list-ul" color="secondary" :aria-pressed="isUnorderedList || undefined"
+        <Button ghost @click="unorderedList" icon="bi-list-ul" color="secondary" :aria-pressed="isUnorderedList || undefined"
           :disabled="preview" />
 
         <div class="separator" />
 
-        <Button @click="bold" icon="bi-type-bold" color="secondary" :disabled="preview" />
-        <Button @click="italics" icon="bi-type-italic" color="secondary" :disabled="preview" />
-        <Button @click="strikethrough" icon="bi-type-strikethrough" color="secondary" :disabled="preview" />
-        <Button @click="link" icon="bi-link-45deg" color="secondary" :disabled="preview" />
+        <Button ghost @click="bold" icon="bi-type-bold" color="secondary" :disabled="preview" />
+        <Button ghost @click="italics" icon="bi-type-italic" color="secondary" :disabled="preview" />
+        <Button ghost @click="strikethrough" icon="bi-type-strikethrough" color="secondary" :disabled="preview" />
+        <Button ghost @click="link" icon="bi-link-45deg" color="secondary" :disabled="preview" />
 
         <span v-if="max !== Infinity && typeof max === 'number'" class="letter-count">{{ max - model.length }}</span>
       </div>
diff --git a/front/src/components/ui/textarea.scss b/front/src/components/ui/textarea.scss
index 8469ac8af..b6670db5a 100644
--- a/front/src/components/ui/textarea.scss
+++ b/front/src/components/ui/textarea.scss
@@ -102,7 +102,7 @@
     > textarea {
       display: block;
       width: 100%;
-      min-height: 240px;
+      min-height: 160px;
       padding: 8px 12px 40px;
       font-family: monospace;
       background: transparent;