vue_activity: style for suggestions, add and remove items

src/Bundle/ChillActivityBundle/Resources/public/vuejs/Activity/components/ConcernedGroups.vue

@@ -11,9 +11,12 @@
       </div>
 
      <div v-if="getContext === 'accompanyingCourse' && filterSuggestedPersons.length > 0">
-        <ul>
+         <ul class="list-unstyled">
           <li v-for="p in filterSuggestedPersons" @click="addNewPerson(p)">
-             {{ p.text }}
+             <span class="badge bg-primary" style="cursor: pointer;">
+                 <i class="fa fa-plus fa-fw text-success"></i>
+                 {{ p.text }}
+             </span>
           </li>
         </ul>
      </div>

src/Bundle/ChillActivityBundle/Resources/public/vuejs/Activity/components/ConcernedGroups/PersonBadge.vue

@@ -4,7 +4,7 @@
          <span class="chill_denomination">
             {{ textCutted }}
          </span>
-         <a class="fa fa-fw fa-times"
+         <a class="fa fa-fw fa-times text-danger text-decoration-none"
             @click.prevent="$emit('remove', person)">
          </a>
       </span>

src/Bundle/ChillActivityBundle/Resources/views/Activity/show.html.twig

@@ -55,7 +55,7 @@
     {% endif %}
 
 <h2 class="chill-red">{{ 'Concerned groups'|trans }}</h2>
-{% include 'ChillActivityBundle:Activity:concernedGroups.html.twig' with {'context': context, 'with_display': 'bloc' } %}
+{% include 'ChillActivityBundle:Activity:concernedGroups.html.twig' with {'context': context, 'with_display': 'bloc', 'badge_person': 'true' } %}
 
 <h2 class="chill-red">{{ 'Activity data'|trans }}</h2>