From 0fa9a0bcb1a3ca1b7cf607148dfef268b17107b4 Mon Sep 17 00:00:00 2001
From: Thomas Citharel <tcit@tcit.fr>
Date: Mon, 14 Oct 2019 12:56:37 +0200
Subject: [PATCH] Event description pic & meta and email share fixes

Signed-off-by: Thomas Citharel <tcit@tcit.fr>
---
 js/src/views/Event/Event.vue | 25 +++++++++++++++++++------
 1 file changed, 19 insertions(+), 6 deletions(-)

diff --git a/js/src/views/Event/Event.vue b/js/src/views/Event/Event.vue
index d09b5bf85..8fb98e27f 100644
--- a/js/src/views/Event/Event.vue
+++ b/js/src/views/Event/Event.vue
@@ -151,7 +151,7 @@ import {ParticipantRole} from "@/types/event.model";
         <section class="share" v-if="!event.draft">
           <div class="container">
             <div class="columns">
-              <div class="column is-half has-text-centered">
+              <div class="column is-half-desktop has-text-centered">
                 <h3 class="title">{{ $t('Share this event') }}</h3>
                 <small class="maximumNumberOfPlacesWarning" v-if="!eventCapacityOK">
                   {{ $t('All the places have already been taken') }}
@@ -284,6 +284,10 @@ import { RouteName } from '@/router';
       title: this.eventTitle,
       // all titles will be injected into this template
       titleTemplate: '%s | Mobilizon',
+      meta: [
+        // @ts-ignore
+        { name: 'description', content: this.eventDescription },
+      ],
     };
   },
 })
@@ -306,6 +310,11 @@ export default class Event extends EventMixin {
     return this.event.title;
   }
 
+  get eventDescription() {
+    if (!this.event) return undefined;
+    return this.event.description;
+  }
+
   mounted() {
     this.identity = this.currentActor;
   }
@@ -522,7 +531,8 @@ export default class Event extends EventMixin {
   get textDescription(): string {
     const meta = document.querySelector("meta[property='og:description']");
     if (!meta) return '';
-    return meta.getAttribute('content') || '';
+    const desc = meta.getAttribute('content') || '';
+    return desc.substring(0, 1000);
   }
 
   get eventCapacityOK(): boolean {
@@ -743,10 +753,13 @@ export default class Event extends EventMixin {
   .description {
     padding-top: 10px;
     min-height: 40rem;
-    background-repeat: no-repeat;
-    background-size: 800px;
-    background-position: 95% 101%;
-    background-image: url('../../assets/texting.svg');
+
+    @media screen and (min-width: 1216px) {
+      background-repeat: no-repeat;
+      background-size: 600px;
+      background-position: 95% 101%;
+      background-image: url('../../assets/texting.svg');
+    }
     border-top: solid 1px #111;
     border-bottom: solid 1px #111;