From 82a58222211fc8bbde49e32b7796f93fa05e0c55 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Jo=C5=BEe=20Fortun?= <joze.fortun@gmail.com>
Date: Tue, 6 Feb 2024 13:43:05 +0100
Subject: [PATCH] Sync block wrap styles for compose/reporter

---
 .../compose/src/components/PageBlocks/Wrap/Card.vue  | 12 +++++++++---
 .../compose/src/components/PageBlocks/Wrap/Plain.vue |  6 +++++-
 .../reporter/src/components/Report/Blocks/index.vue  |  9 ++++-----
 3 files changed, 18 insertions(+), 9 deletions(-)

diff --git a/client/web/compose/src/components/PageBlocks/Wrap/Card.vue b/client/web/compose/src/components/PageBlocks/Wrap/Card.vue
index 616b48dd7..1da06cd16 100644
--- a/client/web/compose/src/components/PageBlocks/Wrap/Card.vue
+++ b/client/web/compose/src/components/PageBlocks/Wrap/Card.vue
@@ -10,8 +10,14 @@
         :class="`border-bottom text-nowrap pr-2 ${headerClass}`"
         :header-text-variant="block.style.variants.headerText"
       >
-        <div v-if="!headerSet">
-          <div class="d-flex">
+        <div
+          v-if="!headerSet"
+          class="d-flex flex-column gap-1"
+        >
+          <div
+            v-if="blockTitle || showOptions"
+            class="d-flex"
+          >
             <h4
               v-if="blockTitle"
               :title="blockTitle"
@@ -52,7 +58,7 @@
           <b-card-text
             v-if="blockDescription"
             :title="blockDescription"
-            class="text-dark text-wrap mt-1"
+            class="text-dark text-wrap"
           >
             {{ blockDescription }}
           </b-card-text>
diff --git a/client/web/compose/src/components/PageBlocks/Wrap/Plain.vue b/client/web/compose/src/components/PageBlocks/Wrap/Plain.vue
index 006cdbff4..585d4e9fb 100644
--- a/client/web/compose/src/components/PageBlocks/Wrap/Plain.vue
+++ b/client/web/compose/src/components/PageBlocks/Wrap/Plain.vue
@@ -10,11 +10,15 @@
       >
         <div
           v-if="!headerSet"
+          class="d-flex flex-column gap-1"
         >
           <div
+            v-if="blockTitle || showOptions"
             class="d-flex"
           >
             <h4
+              v-if="blockTitle"
+              :title="blockTitle"
               class="text-truncate mb-0"
             >
               {{ blockTitle }}
@@ -51,7 +55,7 @@
 
           <b-card-text
             v-if="blockDescription"
-            class="text-dark text-wrap mt-1"
+            class="text-dark text-wrap"
           >
             {{ blockDescription }}
           </b-card-text>
diff --git a/client/web/reporter/src/components/Report/Blocks/index.vue b/client/web/reporter/src/components/Report/Blocks/index.vue
index 5290104f5..5c31ff376 100644
--- a/client/web/reporter/src/components/Report/Blocks/index.vue
+++ b/client/web/reporter/src/components/Report/Blocks/index.vue
@@ -9,19 +9,18 @@
     >
       <div
         v-if="block.title || block.description"
-        class="p-3 border-bottom"
+        class="d-flex flex-column p-3 border-bottom gap-1"
       >
-        <h5
+        <h4
           v-if="block.title"
           class="text-primary text-truncate mb-0"
         >
           {{ block.title }}
-        </h5>
+        </h4>
 
         <b-card-text
           v-if="block.description"
-          class="text-dark text-truncate"
-          :class="{ 'mt-1': block.title }"
+          class="text-dark text-wrap"
         >
           {{ block.description }}
         </b-card-text>