Fix organizer metadata overflow

Signed-off-by: Thomas Citharel <tcit@tcit.fr>

js/src/components/Event/EventMetadataBlock.vue

@@ -33,6 +33,7 @@ div.eventMetadataBlock {
 
   p {
     flex: 1;
+    overflow: hidden;
 
     &.padding-left {
       padding-left: 20px;

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;