From fab8ee6f05cf48fbf93f7b189e08d24bf9991979 Mon Sep 17 00:00:00 2001
From: Thomas Citharel <tcit@tcit.fr>
Date: Mon, 26 Apr 2021 17:27:27 +0200
Subject: [PATCH] Fix organizer metadata overflow

Signed-off-by: Thomas Citharel <tcit@tcit.fr>
---
 .../components/Event/EventMetadataBlock.vue   |  1 +
 js/src/views/Event/Event.vue                  | 19 ++++++++++++++++++-
 2 files changed, 19 insertions(+), 1 deletion(-)

diff --git a/js/src/components/Event/EventMetadataBlock.vue b/js/src/components/Event/EventMetadataBlock.vue
index 4aab57660..5b20bbc01 100644
--- a/js/src/components/Event/EventMetadataBlock.vue
+++ b/js/src/components/Event/EventMetadataBlock.vue
@@ -33,6 +33,7 @@ div.eventMetadataBlock {
 
   p {
     flex: 1;
+    overflow: hidden;
 
     &.padding-left {
       padding-left: 20px;
diff --git a/js/src/views/Event/Event.vue b/js/src/views/Event/Event.vue
index 779de1b68..5db7f2379 100755
--- a/js/src/views/Event/Event.vue
+++ b/js/src/views/Event/Event.vue
@@ -341,7 +341,10 @@
                   :endsOn="event.endsOn"
                 />
               </event-metadata-block>
-              <event-metadata-block :title="$t('Organized by')">
+              <event-metadata-block
+                class="metadata-organized-by"
+                :title="$t('Organized by')"
+              >
                 <popover-actor-card
                   :actor="event.organizerActor"
                   v-if="!event.attributedTo"
@@ -1430,6 +1433,20 @@ div.sidebar {
     }
   }
 
+  ::v-deep .metadata-organized-by {
+    .v-popover.popover .trigger {
+      width: 100%;
+      .media-content {
+        width: calc(100% - 32px - 1rem);
+
+        p.has-text-grey {
+          text-overflow: ellipsis;
+          overflow: hidden;
+        }
+      }
+    }
+  }
+
   div.event-description-comments {
     min-width: 20rem;
     padding: 1rem;