graphical fixes

lang/fr-FR.js

@@ -30,6 +30,8 @@ export default (_context, _locale) => {
     close: 'Fermer',
     geolocation_error: 'Une erreur s\'est produite lors de la géolocalisation',
     geolocation_not_supported: 'La géolocalisation n\'est pas supportée par votre navigateur',
+    show_tel: 'Montrer le numéro de téléphone',
+    show_email: 'Montrer l\'adresse e-mail',
     BIG_BAND: 'Big band',
     BRASS_BAND: 'Brass band',
     ORCHESTRA_CLASS: "Classe d'orchestre",

pages/structures/_id.vue

@@ -83,7 +83,9 @@
                 <font-awesome-icon class="icon" :icon="['fas', 'map-marker-alt']" />
               </td>
               <td class="mx-2">
-                {{ structure.address }}
+                <span v-if="structure.streetAddress">{{ structure.streetAddress }}<br></span>
+                <span v-if="structure.postalCode">{{ structure.postalCode }} </span>
+                {{ structure.addressCity }}
               </td>
             </tr>
             <tr>
@@ -91,15 +93,25 @@
                 <font-awesome-icon class="icon" :icon="['fas', 'phone-alt']" />
               </td>
               <td class="phone">
-                <a :href="'tel:' + structure.telphone">{{ structure.telphone }}</a>
+                <div v-if="structure.telphone">
+                  <a v-if="showTel" :href="'tel:' + structure.telphone">{{ structure.telphone }}</a>
+                  <v-btn v-else small @click="showTel = 1">
+                    {{ $t('show_tel') }}
+                  </v-btn>
+                </div>
               </td>
             </tr>
             <tr>
               <td>
-                <font-awesome-icon class="icon" :icon="['fas', 'envelope']" />
+                <font-awesome-icon class="icon" :icon="['fas', 'at']" />
               </td>
               <td class="mail">
-                <a :href="'mailto:' + structure.mail">{{ structure.mail }}</a>
+                <div v-if="structure.email">
+                  <a v-if="showMail" :href="'mailto:' + structure.email">{{ structure.email }}</a>
+                  <v-btn v-else small @click="showMail = 1">
+                    {{ $t('show_email') }}
+                  </v-btn>
+                </div>
               </td>
             </tr>
             <tr>
@@ -107,7 +119,7 @@
                 <font-awesome-icon class="icon" :icon="['fas', 'globe-europe']" />
               </td>
               <td class="website">
-                <a :href="structure.website">{{ structure.website }}</a>
+                <a :href="structure.website" target="_blank">{{ structure.website }}</a>
               </td>
             </tr>
             <tr>
@@ -115,7 +127,9 @@
                 <font-awesome-icon class="icon" :icon="['fas', 'project-diagram']" />
               </td>
               <td class="network">
-                {{ structure.n1Name }}
+                <NuxtLink :to="'/structures/' + structure.n1Id" nuxt>
+                  {{ structure.n1Name }}
+                </NuxtLink>
               </td>
             </tr>
           </table>
@@ -179,7 +193,6 @@ export default {
         s.practices = s.practices !== null ? s.practices.split(',') : []
         s.latitude = s.latitude ? parseFloat(s.latitude) : null
         s.longitude = s.longitude ? parseFloat(s.longitude) : null
-        s.address = [s.streetAddress, s.postalCode, s.addressCity].join(' ')
 
         s.facebook = 'https://facebook.com'
         s.twitter = 'https://twitter.com'
@@ -188,6 +201,12 @@ export default {
         return { structure: s }
       }
     )
+  },
+  data () {
+    return {
+      showTel: false,
+      showMail: false
+    }
   }
 }
 </script>
@@ -212,9 +231,13 @@ export default {
   }
 
   .social-icon {
-    font-size: 24px;
+    font-size: 22px;
     color: gray;
-    margin: auto 4px;
+    margin: auto 8px;
+  }
+
+  .content {
+    color: #666666;
   }
 
   .description {

pages/structures/index.vue

@@ -222,7 +222,9 @@
                               <font-awesome-icon class="icon" :icon="['fas', 'map-marker-alt']" />
                             </td>
                             <td class="py-1">
-                              {{ structure.address }}
+                              <span v-if="structure.streetAddress">{{ structure.streetAddress }}<br></span>
+                              <span v-if="structure.postalCode">{{ structure.postalCode }} </span>
+                              {{ structure.addressCity }}
                             </td>
                           </tr>
                           <tr>
@@ -306,7 +308,6 @@ export default {
         s.practices = s.practices !== null ? s.practices.split(',') : []
         s.latitude = s.latitude ? parseFloat(s.latitude) : null
         s.longitude = s.longitude ? parseFloat(s.longitude) : null
-        s.address = [s.streetAddress, s.postalCode, s.addressCity].join(' ')
         return s
       })
     ).then((res) => {
@@ -482,6 +483,7 @@ export default {
 
   .structure-card {
     height: 100%;
+    color: #666666;
   }
 
   .infos .col {