From 7b1c2b3f5018516781f8955dec2b38af539f76d0 Mon Sep 17 00:00:00 2001
From: Sebin Song <songxevin@gmail.com>
Date: Wed, 11 Dec 2024 07:10:14 +0900
Subject: [PATCH] fix the UI bug (#2451)

---
 frontend/views/components/PageSection.vue            | 1 +
 frontend/views/containers/proposals/ProposalItem.vue | 6 +++++-
 2 files changed, 6 insertions(+), 1 deletion(-)

diff --git a/frontend/views/components/PageSection.vue b/frontend/views/components/PageSection.vue
index 355e81525a..cdb489e23d 100644
--- a/frontend/views/components/PageSection.vue
+++ b/frontend/views/components/PageSection.vue
@@ -51,5 +51,6 @@ export default ({
   align-items: center;
   justify-content: space-between;
   flex-wrap: wrap;
+  row-gap: 1rem; // There should be a space between the title and the cta when they become two rows.
 }
 </style>
diff --git a/frontend/views/containers/proposals/ProposalItem.vue b/frontend/views/containers/proposals/ProposalItem.vue
index f794176886..eb62fb1c75 100644
--- a/frontend/views/containers/proposals/ProposalItem.vue
+++ b/frontend/views/containers/proposals/ProposalItem.vue
@@ -24,7 +24,7 @@ li.c-item-wrapper(data-test='proposalItem' :data-proposal-hash='proposalHash')
             .button.is-icon-smaller.is-primary
               i.icon-question
 
-        p(data-test='title' v-safe-html='subtitle')
+        p.c-content-title(data-test='title' v-safe-html='subtitle')
 
         p.has-text-1(
           :class='{ "has-text-danger": proposal.status === statuses.STATUS_FAILED, "has-text-success": proposal.status === statuses.STATUS_PASSED }'
@@ -380,6 +380,10 @@ export default ({
   &-content {
     flex-grow: 1;
   }
+
+  .c-content-title {
+    word-break: break-word;
+  }
 }
 
 .c-tip {