Multiple fixes

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

js/src/components/Event/EventListCard.vue

@@ -98,7 +98,7 @@
               >{{ $t("Edit") }}</b-button
             >
           </li>
-          <li>
+          <li v-if="participation.role === ParticipantRole.CREATOR">
             <b-button
               type="is-text"
               @click="

js/src/components/SearchField.vue

@@ -1,8 +1,9 @@
 <template>
-  <label>
+  <label for="navSearchField">
     <span class="visually-hidden">{{ defaultPlaceHolder }}</span>
     <b-input
       custom-class="searchField"
+      id="navSearchField"
       icon="magnify"
       type="search"
       rounded

js/src/views/About.vue

@@ -24,7 +24,7 @@
         </div>
       </div>
     </div>
-    <div class="container" id="mobilizon">
+    <div class="container">
       <section>
         <div class="columns">
           <div class="column has-text-left-desktop">
@@ -46,7 +46,11 @@
             />
           </div>
           <div class="column has-text-right-desktop has-text-centered-mobile">
-            <img src="img/about/action-mobilizon.png" width="300" alt="" />
+            <img
+              src="img/about/action-mobilizon.png"
+              width="300"
+              :alt="$t('Organize and take action, freely')"
+            />
           </div>
         </div>
       </section>
@@ -81,7 +85,11 @@
             </p>
           </div>
           <div class="column has-text-left-desktop has-text-centered-mobile">
-            <img src="img/about/common-mobilizon.png" width="300" alt="" />
+            <img
+              src="img/about/common-mobilizon.png"
+              width="300"
+              :alt="$t('Let\'s create a new common')"
+            />
           </div>
         </div>
       </section>
@@ -140,7 +148,11 @@
             </i18n>
           </div>
           <div class="column has-text-right-desktop has-text-centered-mobile">
-            <img src="img/about/software-to-the-people-mobilizon.png" width="300" alt="" />
+            <img
+              src="img/about/software-to-the-people-mobilizon.png"
+              width="300"
+              :alt="('Software to the people')"
+            />
           </div>
         </div>
       </section>
@@ -162,7 +174,11 @@
             </i18n>
           </div>
           <div class="column has-text-left-desktop has-text-centered-mobile">
-            <img src="img/about/concieved-mobilizon.png" width="300" alt="" />
+            <img
+              src="img/about/concieved-mobilizon.png"
+              width="300"
+              :alt="$t('Concieved with care for humans')"
+            />
           </div>
         </div>
       </section>
@@ -216,6 +232,12 @@ export default class About extends Vue {
 <style lang="scss" scoped>
 @import "../variables.scss";
 
+a:not(.button) {
+  padding: 0.3rem;
+  background: #ffd599;
+  color: #111;
+}
+
 .hero.is-primary .subtitle {
   padding: 1rem;
   display: block;
@@ -267,6 +289,7 @@ section {
 
   .blockquote-footer a {
     color: #6c757d;
+    background: initial;
 
     &:before {
       content: "\2014\00A0";

js/src/views/Home.vue

@@ -30,6 +30,22 @@
         </div>
       </div>
     </section>
+    <div class="container section" v-if="config && (!currentUser.id || !currentActor.id)">
+      <section class="events-featured">
+        <h3 class="title">{{ $t("Featured events") }}</h3>
+        <b-loading :active.sync="$apollo.loading" />
+        <div v-if="filteredFeaturedEvents.length > 0" class="columns is-multiline">
+          <div
+            class="column is-one-third-desktop"
+            v-for="event in filteredFeaturedEvents.slice(0, 6)"
+            :key="event.uuid"
+          >
+            <EventCard :event="event" />
+          </div>
+        </div>
+        <b-message v-else type="is-danger">{{ $t("No events found") }}</b-message>
+      </section>
+    </div>
     <div class="container section" v-if="config && loggedUser && loggedUser.settings">
       <section v-if="currentActor.id">
         <b-message type="is-info" v-if="welcomeBack">{{
@@ -299,7 +315,11 @@ export default class Home extends Vue {
    */
   get filteredFeaturedEvents() {
     return this.events.filter(
-      ({ id }) => !this.currentUserParticipations.map(({ event: { id } }) => id).includes(id)
+      ({ id }) =>
+        !this.currentUserParticipations
+          .filter((participation) => participation.role === ParticipantRole.CREATOR)
+          .map(({ event: { id } }) => id)
+          .includes(id)
     );
   }