Fix test error when no periods

Notifications3

See merge request Chill-Projet/chill-bundles!89

package.json.txt

@@ -0,0 +1,3 @@
+add npm/yarn dependency in package.json :
+
+"select2-bootstrap-theme": "0.1.0-beta.10",

src/Bundle/ChillActivityBundle/Controller/ActivityController.php

@@ -72,6 +72,7 @@ class ActivityController extends AbstractController
     {
         $em = $this->getDoctrine()->getManager();
         $view = null;
+        // TODO: add pagination
 
         [$person, $accompanyingPeriod] = $this->getEntity($request);
 
@@ -80,10 +81,9 @@ class ActivityController extends AbstractController
                 ->getReachableCircles($this->getUser(), new Role('CHILL_ACTIVITY_SEE'),
                     $person->getCenter());
 
-            $activities = $em->getRepository('ChillActivityBundle:Activity')->findBy(
-                ['person' => $person, 'scope' => $reachableScopes],
-                ['date' => 'DESC'],
-            );
+            $activities = $em->getRepository(Activity::class)
+                ->findByPersonImplied($person, $reachableScopes)
+                ;
 
             $event = new PrivacyEvent($person, array(
                 'element_class' => Activity::class,

src/Bundle/ChillActivityBundle/DataFixtures/ORM/LoadActivityNotifications.php

@@ -22,6 +22,7 @@ class LoadActivityNotifications extends AbstractFixture implements DependentFixt
             'entityRef' => 'activity_gerard depardieu',
             'sender' => 'center a_social',
             'addressees' => [
+                'center a_social',
                 'center a_administrative',
                 'center a_direction',
                 'multi_center'

src/Bundle/ChillActivityBundle/Entity/Activity.php

@@ -106,15 +106,16 @@ class Activity implements HasCenterInterface, HasScopeInterface
     /**
      * @ORM\ManyToMany(targetEntity="Chill\PersonBundle\Entity\SocialWork\SocialIssue")
      * @ORM\JoinTable(name="chill_activity_activity_chill_person_socialissue")
+     * @Groups({"read"})
      */
-    private $socialIssues;
+    private Collection $socialIssues;
 
     /**
      * @ORM\ManyToMany(targetEntity="Chill\PersonBundle\Entity\SocialWork\SocialAction")
      * @ORM\JoinTable(name="chill_activity_activity_chill_person_socialaction")
+     * @Groups({"read"})
      */
-    private $socialActions;
-
+    private Collection $socialActions;
 
     /**
      * @ORM\ManyToOne(targetEntity="Chill\ActivityBundle\Entity\ActivityType")
@@ -297,9 +298,6 @@ class Activity implements HasCenterInterface, HasScopeInterface
         return $this;
     }
 
-    /**
-     * @return Collection|SocialAction[]
-     */
     public function getSocialActions(): Collection
     {
         return $this->socialActions;

src/Bundle/ChillActivityBundle/Form/ActivityType.php

@@ -35,6 +35,7 @@ use Symfony\Component\Form\Extension\Core\Type\HiddenType;
 use Symfony\Component\Form\CallbackTransformer;
 use Chill\PersonBundle\Form\DataTransformer\PersonToIdTransformer;
 use Chill\PersonBundle\Templating\Entity\SocialIssueRender;
+use Chill\PersonBundle\Templating\Entity\SocialActionRender;
 
 class ActivityType extends AbstractType
 {
@@ -46,6 +47,10 @@ class ActivityType extends AbstractType
 
     protected TranslatableStringHelper $translatableStringHelper;
 
+    protected SocialIssueRender $socialIssueRender;
+
+    protected SocialActionRender $socialActionRender;
+
     protected array $timeChoices;
 
     public function __construct (
@@ -54,7 +59,8 @@ class ActivityType extends AbstractType
         ObjectManager $om,
         TranslatableStringHelper $translatableStringHelper,
         array $timeChoices,
-        SocialIssueRender $socialIssueRender
+        SocialIssueRender $socialIssueRender,
+        SocialActionRender $socialActionRender
     ) {
         if (!$tokenStorage->getToken()->getUser() instanceof User) {
             throw new \RuntimeException("you should have a valid user");
@@ -66,6 +72,7 @@ class ActivityType extends AbstractType
         $this->translatableStringHelper = $translatableStringHelper;
         $this->timeChoices = $timeChoices;
         $this->socialIssueRender = $socialIssueRender;
+        $this->socialActionRender = $socialActionRender;
     }
 
     public function buildForm(FormBuilderInterface $builder, array $options): void
@@ -105,31 +112,51 @@ class ActivityType extends AbstractType
         }
 
         if ($activityType->isVisible('socialIssues') && $accompanyingPeriod) {
-            $builder->add('socialIssues', EntityType::class, [
-                'label' => $activityType->getLabel('socialIssues'),
-                'required' => $activityType->isRequired('socialIssues'),
-                'class' => SocialIssue::class,
-                'choice_label' => function (SocialIssue $socialIssue) {
-                    return $this->socialIssueRender->renderString($socialIssue, []);
-                },
-                'multiple' => true,
-                'choices' => $accompanyingPeriod->getRecursiveSocialIssues(),
-                'expanded' => true,
-            ]);
+            $builder->add('socialIssues', HiddenType::class);
+            $builder->get('socialIssues')
+               ->addModelTransformer(new CallbackTransformer(
+                   function (iterable $socialIssuesAsIterable): string {
+                       $socialIssueIds = [];
+                       foreach ($socialIssuesAsIterable as $value) {
+                          $socialIssueIds[] = $value->getId();
+                       }
+                       return implode(',', $socialIssueIds);
+                   },
+                   function (?string $socialIssuesAsString): array {
+                       if (null === $socialIssuesAsString) {
+                          return [];
+                       }
+                       return array_map(
+                          fn(string $id): ?SocialIssue => $this->om->getRepository(SocialIssue::class)->findOneBy(['id' => (int) $id]),
+                          explode(',', $socialIssuesAsString)
+                       );
+                   }
+               ))
+            ;
         }
 
         if ($activityType->isVisible('socialActions') && $accompanyingPeriod) {
-            $builder->add('socialActions', EntityType::class, [
-                'label' => $activityType->getLabel('socialActions'),
-                'required' => $activityType->isRequired('socialActions'),
-                'class' => SocialAction::class,
-                'choice_label' => function (SocialAction $socialAction) {
-                    return $this->translatableStringHelper->localize($socialAction->getTitle());
-                },
-                'multiple' => true,
-                'choices' => $accompanyingPeriod->getRecursiveSocialActions(),
-                'expanded' => true,
-            ]);
+            $builder->add('socialActions', HiddenType::class);
+            $builder->get('socialActions')
+               ->addModelTransformer(new CallbackTransformer(
+                   function (iterable $socialActionsAsIterable): string {
+                       $socialActionIds = [];
+                       foreach ($socialActionsAsIterable as $value) {
+                          $socialActionIds[] = $value->getId();
+                       }
+                       return implode(',', $socialActionIds);
+                   },
+                   function (?string $socialActionsAsString): array {
+                       if (null === $socialActionsAsString) {
+                          return [];
+                       }
+                       return array_map(
+                          fn(string $id): ?SocialAction => $this->om->getRepository(SocialAction::class)->findOneBy(['id' => (int) $id]),
+                          explode(',', $socialActionsAsString)
+                       );
+                   }
+               ))
+            ;
         }
 
         if ($activityType->isVisible('date')) {
@@ -197,15 +224,14 @@ class ActivityType extends AbstractType
 
         if ($activityType->isVisible('comment')) {
             $builder->add('comment', CommentType::class, [
-                'label' => $activityType->getLabel('comment'),
+                'label' => empty($activityType->getLabel('comment')) 
+                    ? 'activity.comment' : $activityType->getLabel('comment'),
                 'required' => $activityType->isRequired('comment'),
             ]);
         }
 
         if ($activityType->isVisible('persons')) {
-            $builder->add('persons', HiddenType::class, [
-               //'data_class' => Person::class,
-            ]);
+            $builder->add('persons', HiddenType::class);
             $builder->get('persons')
                ->addModelTransformer(new CallbackTransformer(
                    function (iterable $personsAsIterable): string {
@@ -226,9 +252,7 @@ class ActivityType extends AbstractType
         }
 
         if ($activityType->isVisible('thirdParties')) {
-            $builder->add('thirdParties', HiddenType::class, [
-               //'data_class' => ThirdParty::class,
-            ]);
+            $builder->add('thirdParties', HiddenType::class);
             $builder->get('thirdParties')
                ->addModelTransformer(new CallbackTransformer(
                    function (iterable $thirdpartyAsIterable): string {
@@ -260,9 +284,7 @@ class ActivityType extends AbstractType
         }
 
         if ($activityType->isVisible('users')) {
-            $builder->add('users', HiddenType::class, [
-               //'data_class' => User::class,
-            ]);
+            $builder->add('users', HiddenType::class);
             $builder->get('users')
                ->addModelTransformer(new CallbackTransformer(
                    function (iterable $usersAsIterable): string {

src/Bundle/ChillActivityBundle/Menu/AccompanyingCourseMenuBuilder.php

@@ -4,6 +4,7 @@ namespace Chill\ActivityBundle\Menu;
 
 use Chill\MainBundle\Routing\LocalMenuBuilderInterface;
 use Chill\MainBundle\Security\Authorization\AuthorizationHelper;
+use Chill\PersonBundle\Entity\AccompanyingPeriod;
 use Knp\Menu\MenuItem;
 use Symfony\Component\Security\Core\Authentication\Token\Storage\TokenStorageInterface;
 use Symfony\Contracts\Translation\TranslatorInterface;
@@ -34,21 +35,13 @@ class AccompanyingCourseMenuBuilder implements LocalMenuBuilderInterface
     {
         $period = $parameters['accompanyingCourse'];
 
-        $menu->addChild($this->translator->trans('Activity list'), [
-            'route' => 'chill_activity_activity_list',
-            'routeParameters' => [
-                'accompanying_period_id' => $period->getId(),
-            ]])
-            ->setExtras(['order' => 40]);
-
-        $menu->addChild($this->translator->trans('Add a new activity'), [
-            'route' => 'chill_activity_activity_select_type',
-            'routeParameters' => [
-                'accompanying_period_id' => $period->getId(),
-            ]])
-            ->setExtras(['order' => 41]);
-
-
-
+        if (AccompanyingPeriod::STEP_DRAFT !== $period->getStep()) {
+            $menu->addChild($this->translator->trans('Activity list'), [
+                'route' => 'chill_activity_activity_list',
+                'routeParameters' => [
+                    'accompanying_period_id' => $period->getId(),
+                ]])
+                ->setExtras(['order' => 40]);
+        }
     }
 }

src/Bundle/ChillActivityBundle/Menu/MenuBuilder.php

@@ -1,88 +0,0 @@
-<?php
-/*
- * 
- */
-namespace Chill\ActivityBundle\Menu;
-
-use Chill\MainBundle\Routing\LocalMenuBuilderInterface;
-use Chill\MainBundle\Security\Authorization\AuthorizationHelper;
-use Symfony\Component\Security\Core\Authentication\Token\Storage\TokenStorageInterface;
-use Symfony\Component\Translation\TranslatorInterface;
-use Knp\Menu\MenuItem;
-use Symfony\Component\Security\Core\Role\Role;
-use Chill\ActivityBundle\Security\Authorization\ActivityVoter;
-
-/**
- * 
- *
- * @author Julien Fastré <julien.fastre@champs-libres.coop>
- */
-class MenuBuilder implements LocalMenuBuilderInterface
-{
-    /**
-     *
-     * @var TokenStorageInterface
-     */
-    protected $tokenStorage;
-    
-    /**
-     *
-     * @var TranslatorInterface
-     */
-    protected $translator;
-    
-    /**
-     *
-     * @var AuthorizationHelper
-     */
-    protected $authorizationHelper;
-    
-    public function __construct(
-        TokenStorageInterface $tokenStorage, 
-        TranslatorInterface $translator, 
-        AuthorizationHelper $authorizationHelper
-    ) {
-        $this->tokenStorage = $tokenStorage;
-        $this->translator = $translator;
-        $this->authorizationHelper = $authorizationHelper;
-    }
-
-    
-    public function buildMenu($menuId, MenuItem $menu, array $parameters)
-    {
-        /* @var $person \Chill\PersonBundle\Entity\Person */
-        $person  = $parameters['person'];
-        $user    = $this->tokenStorage->getToken()->getUser();
-        $roleSee = new Role(ActivityVoter::SEE);
-        $roleAdd = new Role(ActivityVoter::CREATE);
-        
-        if ($this->authorizationHelper->userHasAccess($user, $person, $roleSee)) {
-            $menu->addChild($this->translator->trans('Activity list'), [
-                    'route' => 'chill_activity_activity_list',
-                    'routeParameters' => [
-                        'person_id' => $person->getId()
-                    ]
-                ])
-                ->setExtras([
-                    'order' => 201
-                ]);
-        }
-        
-        if ($this->authorizationHelper->userHasAccess($user, $person, $roleAdd)) {
-            $menu->addChild($this->translator->trans('Add a new activity'), [
-                    'route' => 'chill_activity_activity_new',
-                    'routeParameters' => [
-                        'person_id' => $person->getId()
-                    ]
-                ])
-                ->setExtras([
-                    'order' => 200
-                ]);
-        }
-    }
-
-    public static function getMenuIds(): array
-    {
-        return [ 'person' ];
-    }
-}

src/Bundle/ChillActivityBundle/Menu/PersonMenuBuilder.php

@@ -15,8 +15,7 @@
  * You should have received a copy of the GNU Affero General Public License
  * along with this program.  If not, see <http://www.gnu.org/licenses/>.
  */
-namespace Chill\ActivityBundle\Menu;
-
+namespace Chill\ActivityBundle\Menu; 
 use Chill\MainBundle\Routing\LocalMenuBuilderInterface;
 use Knp\Menu\MenuItem;
 use Symfony\Component\Security\Core\Authorization\AuthorizationCheckerInterface;
@@ -65,15 +64,6 @@ class PersonMenuBuilder implements LocalMenuBuilderInterface
                 ->setExtra('order', 201)
                 ;
         }
-        if ($this->authorizationChecker->isGranted(ActivityVoter::CREATE, $person)) {
-            $menu->addChild(
-                $this->translator->trans('Add a new activity'), [
-                    'route' => 'chill_activity_activity_new',
-                    'routeParameters' => [ 'person_id' => $person->getId() ],
-                ])
-                ->setExtra('order', 200)
-                ;
-        }
     }
 
     public static function getMenuIds(): array

src/Bundle/ChillActivityBundle/Notification/ActivityNotificationRenderer.php

@@ -0,0 +1,24 @@
+<?php
+
+namespace Chill\ActivityBundle\Notification;
+
+use Chill\MainBundle\Entity\Notification;
+use Chill\ActivityBundle\Entity\Activity;
+
+final class ActivityNotificationRenderer
+{
+    public function supports(Notification $notification, array $options = []): bool
+    {
+        return $notification->getRelatedEntityClass() == Activity::class;
+    }
+
+    public function getTemplate()
+    {
+        return '@ChillActivity/Activity/showInNotification.html.twig';
+    }
+
+    public function getTemplateData(Notification $notification)
+    {
+        return ['notification' => $notification];
+    }
+}

src/Bundle/ChillActivityBundle/Repository/ActivityRepository.php

@@ -38,5 +38,30 @@ class ActivityRepository extends ServiceEntityRepository
     {
         parent::__construct($registry, Activity::class);
     }
-    
+
+    public function findByPersonImplied($person, array $scopes, $orderBy = [ 'date' => 'DESC'], $limit = 100, $offset = 0)
+    {
+        $qb = $this->createQueryBuilder('a');
+        $qb->select('a');
+
+        $qb
+            // TODO add acl
+            //->where($qb->expr()->in('a.scope', ':scopes'))
+            //->setParameter('scopes', $scopes)
+            ->andWhere(
+                $qb->expr()->orX(
+                    $qb->expr()->eq('a.person', ':person'),
+                    ':person MEMBER OF a.persons'
+                )
+            )
+            ->setParameter('person', $person)
+            ;
+
+        foreach ($orderBy as $k => $dir) {
+            $qb->addOrderBy('a.'.$k, $dir);
+        }
+
+        return $qb->getQuery()
+            ->getResult();
+    }    
 }

src/Bundle/ChillActivityBundle/Resources/public/scss/chillactivity.scss

@@ -1,9 +1,9 @@
-@import '~ChillMainSass/custom/config/colors';
-@import '~ChillMainSass/custom/mixins/entity';
+@import '~ChillMainAssets/modules/bootstrap/bootstrap';
+//@import '~ChillMainSass/custom/mixins/entity';
 
-.chill-entity.chill-entity__activity-reason {
-    @include entity($chill-pink, white);
-}
+//.chill-entity.chill-entity__activity-reason {
+//    @include entity($chill-pink, white);
+//}
 
 .activity {
     color: $chill-green;
@@ -112,3 +112,19 @@ div.flex-table.list-records {
       margin-top: 1em;
    }
 }
+
+div.activity-row {
+   display: flex;
+   flex-direction: row;
+   flex-wrap: wrap;
+   justify-content: center;
+   gap: 12px;
+   div.bloc {
+      width: 200px;
+      align-self: flex-end;
+      height: 140px;
+      display: flex;
+      justify-content: center;
+      align-items: center;
+   }
+}

src/Bundle/ChillActivityBundle/Resources/public/vuejs/Activity/App.vue

@@ -1,170 +1,17 @@
 <template>
-   <teleport to="#add-persons">
-
-      <div class="flex-bloc concerned-groups" :class="getContext">
-         <persons-bloc 
-            v-for="bloc in contextPersonsBlocs"
-            v-bind:key="bloc.key"
-            v-bind:bloc="bloc"
-            v-bind:setPersonsInBloc="setPersonsInBloc">
-         </persons-bloc>
-      </div>
-
-      <add-persons 
-         buttonTitle="activity.add_persons"
-         modalTitle="activity.add_persons"
-         v-bind:key="addPersons.key"
-         v-bind:options="addPersons.options"
-         @addNewPersons="addNewPersons"
-         ref="addPersons">
-      </add-persons>
- 
-  </teleport>
+   <concerned-groups></concerned-groups>
+   <social-issues-acc></social-issues-acc>
 </template>
 
 <script>
-import { mapState } from 'vuex';
-import AddPersons from 'ChillPersonAssets/vuejs/_components/AddPersons.vue';
-import PersonsBloc from './components/PersonsBloc.vue';
+import ConcernedGroups from './components/ConcernedGroups.vue';
+import SocialIssuesAcc from './components/SocialIssuesAcc.vue';
 
 export default {
    name: "App",
    components: {
-      AddPersons,
-      PersonsBloc
-   },
-   data() {
-      return {
-         personsBlocs: [
-            {  key: 'persons', 
-               title: 'activity.bloc_persons', 
-               persons: [], 
-               included: false 
-            },
-            {  key: 'personsAssociated', 
-               title: 'activity.bloc_persons_associated', 
-               persons: [], 
-               included: false 
-            },
-            {  key: 'personsNotAssociated', 
-               title: 'activity.bloc_persons_not_associated', 
-               persons: [], 
-               included: false 
-            },
-            {  key: 'thirdparty', 
-               title: 'activity.bloc_thirdparty', 
-               persons: [], 
-               included: true
-            },
-            {  key: 'users', 
-               title: 'activity.bloc_users', 
-               persons: [], 
-               included: true
-            },
-         ],
-         addPersons: {
-            key: 'activity',
-            options: {
-               type: ['person', 'thirdparty'], // TODO add 'user'
-               priority: null,
-               uniq: false,
-            }
-         }
-      }
-   },
-   computed: {
-      ...mapState({
-         persons: state => state.activity.persons,
-         thirdParties: state => state.activity.thirdParties,
-         users: state => state.activity.users,
-         accompanyingCourse: state => state.activity.accompanyingPeriod
-      }),
-      getContext() {
-         return (this.accompanyingCourse) ? "accompanyingCourse" : "person";
-      },
-      contextPersonsBlocs() {
-         return this.personsBlocs.filter(bloc => bloc.included !== false);
-      }
-   },
-   mounted() {
-      this.setPersonsInBloc();
-   },
-   methods: {
-      setPersonsInBloc() {
-         let groups; 
-         if (this.accompanyingCourse) {
-            groups = this.splitPersonsInGroups();
-         }     
-         this.personsBlocs.forEach(bloc => {
-            if (this.accompanyingCourse) {
-               switch (bloc.key) {
-                  case 'personsAssociated':
-                     bloc.persons = groups.personsAssociated;
-                     bloc.included = true;
-                     break;
-                  case 'personsNotAssociated':
-                     bloc.persons = groups.personsNotAssociated;
-                     bloc.included = true;
-                     break;
-               }
-            } else {
-               switch (bloc.key) {
-                  case 'persons': 
-                     bloc.persons = this.persons;
-                     bloc.included = true;
-                     break;
-               }
-            }
-            switch (bloc.key) {
-               case 'thirdparty':
-                  bloc.persons = this.thirdParties;
-                  break;
-               case 'users':
-                  bloc.persons = this.users;
-                  break;
-            }
-         }, groups);
-      },
-      splitPersonsInGroups() {
-         let personsAssociated = [];
-         let personsNotAssociated = this.persons;
-         let participations = this.getCourseParticipations();         
-         this.persons.forEach(person => {
-            participations.forEach(participation => {
-               if (person.id === participation.id) {
-                  console.log(person.id);
-                  personsAssociated.push(person);
-                  personsNotAssociated = personsNotAssociated.filter(p => p !== person);
-               }
-            });
-         });
-         return { 
-            'personsAssociated': personsAssociated, 
-            'personsNotAssociated': personsNotAssociated 
-         };
-      },
-      getCourseParticipations() {
-         let participations = [];
-         this.accompanyingCourse.participations.forEach(participation => {
-            if (!participation.endDate) {
-               participations.push(participation.person);
-            }
-         });
-         return participations;
-      },
-      addNewPersons({ selected, modal }) {
-         console.log('@@@ CLICK button addNewPersons', selected);
-         selected.forEach(function(item) {
-               this.$store.dispatch('addPersonsInvolved', item);
-            }, this
-         );
-         this.$refs.addPersons.resetSearch(); // to cast child method
-         modal.showModal = false;
-         this.setPersonsInBloc();
-      }
+      ConcernedGroups,
+      SocialIssuesAcc
    }
 }
 </script>
-
-<style lang="scss">
-</style>

src/Bundle/ChillActivityBundle/Resources/public/vuejs/Activity/api.js

@@ -0,0 +1,18 @@
+import { getSocialIssues } from 'ChillPersonAssets/vuejs/AccompanyingCourse/api.js';
+
+/*
+*  Load socialActions by socialIssue (id)
+*/
+const getSocialActionByIssue = (id) => { 
+   const url = `/api/1.0/person/social/social-action/by-social-issue/${id}.json`;
+   return fetch(url)
+      .then(response => {
+         if (response.ok) { return response.json(); }
+         throw Error('Error with request resource response'); 
+      });
+};
+
+export {
+   getSocialIssues,
+   getSocialActionByIssue
+};

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

@@ -0,0 +1,170 @@
+<template>
+   <teleport to="#add-persons">
+
+      <div class="flex-bloc concerned-groups" :class="getContext">
+         <persons-bloc 
+            v-for="bloc in contextPersonsBlocs"
+            v-bind:key="bloc.key"
+            v-bind:bloc="bloc"
+            v-bind:setPersonsInBloc="setPersonsInBloc">
+         </persons-bloc>
+      </div>
+
+      <add-persons 
+         buttonTitle="activity.add_persons"
+         modalTitle="activity.add_persons"
+         v-bind:key="addPersons.key"
+         v-bind:options="addPersons.options"
+         @addNewPersons="addNewPersons"
+         ref="addPersons">
+      </add-persons>
+ 
+  </teleport>  
+</template>
+
+<script>
+import { mapState } from 'vuex';
+import AddPersons from 'ChillPersonAssets/vuejs/_components/AddPersons.vue';
+import PersonsBloc from './ConcernedGroups/PersonsBloc.vue';
+
+export default {
+   name: "ConcernedGroups",
+   components: {
+      AddPersons,
+      PersonsBloc
+   },
+   data() {
+      return {
+         personsBlocs: [
+            {  key: 'persons', 
+               title: 'activity.bloc_persons', 
+               persons: [], 
+               included: false 
+            },
+            {  key: 'personsAssociated', 
+               title: 'activity.bloc_persons_associated', 
+               persons: [], 
+               included: false 
+            },
+            {  key: 'personsNotAssociated', 
+               title: 'activity.bloc_persons_not_associated', 
+               persons: [], 
+               included: false 
+            },
+            {  key: 'thirdparty', 
+               title: 'activity.bloc_thirdparty', 
+               persons: [], 
+               included: true
+            },
+            {  key: 'users', 
+               title: 'activity.bloc_users', 
+               persons: [], 
+               included: true
+            },
+         ],
+         addPersons: {
+            key: 'activity',
+            options: {
+               type: ['person', 'thirdparty', 'user'], // TODO add 'user'
+               priority: null,
+               uniq: false,
+            }
+         }
+      }
+   },
+   computed: {
+      ...mapState({
+         persons: state => state.activity.persons,
+         thirdParties: state => state.activity.thirdParties,
+         users: state => state.activity.users,
+         accompanyingCourse: state => state.activity.accompanyingPeriod
+      }),
+      getContext() {
+         return (this.accompanyingCourse) ? "accompanyingCourse" : "person";
+      },
+      contextPersonsBlocs() {
+         return this.personsBlocs.filter(bloc => bloc.included !== false);
+      }
+   },
+   mounted() {
+      this.setPersonsInBloc();
+   },
+   methods: {
+      setPersonsInBloc() {
+         let groups; 
+         if (this.accompanyingCourse) {
+            groups = this.splitPersonsInGroups();
+         }     
+         this.personsBlocs.forEach(bloc => {
+            if (this.accompanyingCourse) {
+               switch (bloc.key) {
+                  case 'personsAssociated':
+                     bloc.persons = groups.personsAssociated;
+                     bloc.included = true;
+                     break;
+                  case 'personsNotAssociated':
+                     bloc.persons = groups.personsNotAssociated;
+                     bloc.included = true;
+                     break;
+               }
+            } else {
+               switch (bloc.key) {
+                  case 'persons': 
+                     bloc.persons = this.persons;
+                     bloc.included = true;
+                     break;
+               }
+            }
+            switch (bloc.key) {
+               case 'thirdparty':
+                  bloc.persons = this.thirdParties;
+                  break;
+               case 'users':
+                  bloc.persons = this.users;
+                  break;
+            }
+         }, groups);
+      },
+      splitPersonsInGroups() {
+         let personsAssociated = [];
+         let personsNotAssociated = this.persons;
+         let participations = this.getCourseParticipations();         
+         this.persons.forEach(person => {
+            participations.forEach(participation => {
+               if (person.id === participation.id) {
+                  //console.log(person.id);
+                  personsAssociated.push(person);
+                  personsNotAssociated = personsNotAssociated.filter(p => p !== person);
+               }
+            });
+         });
+         return { 
+            'personsAssociated': personsAssociated, 
+            'personsNotAssociated': personsNotAssociated 
+         };
+      },
+      getCourseParticipations() {
+         let participations = [];
+         this.accompanyingCourse.participations.forEach(participation => {
+            if (!participation.endDate) {
+               participations.push(participation.person);
+            }
+         });
+         return participations;
+      },
+      addNewPersons({ selected, modal }) {
+         console.log('@@@ CLICK button addNewPersons', selected);
+         selected.forEach(function(item) {
+               this.$store.dispatch('addPersonsInvolved', item);
+            }, this
+         );
+         this.$refs.addPersons.resetSearch(); // to cast child method
+         modal.showModal = false;
+         this.setPersonsInBloc();
+      }
+   }
+}
+</script>
+
+<style lang="scss" scoped>
+</style>

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

@@ -1,6 +1,6 @@
 <template>
    <li>
-      <span class="badge badge-primary" :title="person.text">
+      <span class="badge bg-primary" :title="person.text">
          <span class="chill_denomination">
             {{ textCutted }}
          </span>

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

@@ -0,0 +1,214 @@
+<template>
+   <teleport to="#social-issues-acc">
+      
+      <div class="mb-3 row">
+         <div class="col-4">
+            <label class="col-form-label">{{ $t('activity.social_issues') }}</label>
+         </div>
+         <div class="col-8">
+            
+            <check-social-issue
+               v-for="issue in socialIssuesList"
+               v-bind:key="issue.id"
+               v-bind:issue="issue"
+               v-bind:selection="socialIssuesSelected"
+               @updateSelected="updateIssuesSelected">
+            </check-social-issue>
+            
+            <div class="my-3">
+            <VueMultiselect
+               name="otherIssues"
+               label="text"
+               track-by="id"
+               open-direction="bottom"
+               v-bind:close-on-select="true"
+               v-bind:preserve-search="false"
+               v-bind:reset-after="true"
+               v-bind:hide-selected="true"
+               v-bind:taggable="false"
+               v-bind:multiple="false"
+               v-bind:searchable="true"
+               v-bind:allow-empty="true" 
+               v-bind:show-labels="false"
+               v-bind:loading="issueIsLoading"
+               v-bind:placeholder="$t('activity.choose_other_social_issue')"
+               v-bind:options="socialIssuesOther"
+               v-model="value"
+               @select="addIssueInList">
+            </VueMultiselect>
+            </div>
+            
+         </div>
+      </div>
+
+      <div class="mb-3 row">
+         <div class="col-4">
+            <label class="col-form-label">{{ $t('activity.social_actions') }}</label>
+         </div>
+         <div class="col-8">
+            
+            <div v-if="actionIsLoading === true">
+               <i class="chill-green fa fa-circle-o-notch fa-spin fa-lg"></i>
+            </div>
+            
+            <check-social-action
+               v-if="socialIssuesSelected.length || socialActionsSelected.length"
+               v-for="action in socialActionsList"
+               v-bind:key="action.id"
+               v-bind:action="action"
+               v-bind:selection="socialActionsSelected"
+               @updateSelected="updateActionsSelected">
+            </check-social-action>
+            
+            <span v-else class="inline-choice chill-no-data-statement mt-3">
+               {{ $t('activity.select_first_a_social_issue') }}
+            </span>
+            
+         </div>
+      </div>
+      
+   </teleport>
+</template>
+
+<script>
+import { readonly } from 'vue';
+import VueMultiselect from 'vue-multiselect';
+import CheckSocialIssue from './SocialIssuesAcc/CheckSocialIssue.vue';
+import CheckSocialAction from './SocialIssuesAcc/CheckSocialAction.vue';
+import { getSocialIssues, getSocialActionByIssue } from '../api.js';
+
+export default {
+   name: "SocialIssuesAcc",
+   components: {
+      CheckSocialIssue,
+      CheckSocialAction,
+      VueMultiselect
+   },
+   data() {
+      return {
+         issueIsLoading: false,
+         actionIsLoading: false
+      }
+   },
+   computed: {
+      socialIssuesList() {
+         return this.$store.state.activity.accompanyingPeriod.socialIssues;
+      },
+      socialIssuesSelected() {
+         return this.$store.state.activity.socialIssues;
+      },
+      socialIssuesOther() {
+         return this.$store.state.socialIssuesOther;
+      },
+      socialActionsList() {
+         return this.$store.state.socialActionsList;
+      },
+      socialActionsSelected() {
+         return this.$store.state.activity.socialActions;
+      }
+   },
+   mounted() {
+      /* Load others issues in multiselect
+      */
+      this.issueIsLoading = true;
+      getSocialIssues().then(response => new Promise((resolve, reject) => {
+         this.$store.commit('updateIssuesOther', response.results);
+         
+         /* Add in list the issues already associated (if not yet listed)
+         */
+         this.socialIssuesSelected.forEach(issue => {
+            if (this.socialIssuesList.filter(i => i.id === issue.id).length !== 1) {
+               this.$store.commit('addIssueInList', issue);
+            }
+         }, this);
+         
+         /* Remove from multiselect the issues that are not yet in checkbox list
+         */
+         this.socialIssuesList.forEach(issue => {
+            this.$store.commit('removeIssueInOther', issue);
+         }, this);
+         
+         /* Filter issues
+         */
+         this.$store.commit('filterList', 'issues');
+         
+         /* Add in list the actions already associated (if not yet listed)
+         */
+         this.socialActionsSelected.forEach(action => {
+            this.$store.commit('addActionInList', action);
+         }, this);
+         
+         /* Filter issues
+         */
+         this.$store.commit('filterList', 'actions');
+         
+         this.issueIsLoading = false;
+         resolve();
+      }));   
+   },
+   methods: {
+   
+      /* When choosing an issue in multiselect, add it in checkboxes (as selected), 
+         remove it from multiselect, and add socialActions concerned
+      */
+      addIssueInList(value) {
+         //console.log('addIssueInList', value);
+         this.$store.commit('addIssueInList', value);
+         this.$store.commit('removeIssueInOther', value);
+         this.$store.dispatch('addIssueSelected', value);
+         this.updateActionsList();
+      },
+      /* Update value for selected issues checkboxes
+      */
+      updateIssuesSelected(issues) {
+         //console.log('updateIssuesSelected', issues);
+         this.$store.dispatch('updateIssuesSelected', issues);
+         this.updateActionsList();
+      },
+      /* Update value for selected actions checkboxes
+      */
+      updateActionsSelected(actions) {
+         //console.log('updateActionsSelected', actions);
+         this.$store.dispatch('updateActionsSelected', actions);
+      },
+      /* Add socialActions concerned: after reset, loop on each issue selected 
+         to get social actions concerned
+      */
+      updateActionsList() {
+         //console.log('updateActionsList');
+         this.resetActionsList();
+         this.socialIssuesSelected.forEach(item => {
+            
+            this.actionIsLoading = true;
+            getSocialActionByIssue(item.id)
+               .then(actions => new Promise((resolve, reject) => {
+                  
+                  actions.results.forEach(action => {
+                     this.$store.commit('addActionInList', action);
+                  }, this);
+                  
+                  this.$store.commit('filterList', 'actions');
+                  
+                  this.actionIsLoading = false;
+                  resolve();
+            }));
+         }, this);
+      },
+      /* Reset socialActions List: flush list and restore selected actions 
+      */
+      resetActionsList() {
+         this.$store.commit('resetActionsList');
+         this.socialActionsSelected.forEach(item => {
+            this.$store.commit('addActionInList', item);
+         }, this);
+      }
+   }
+}
+</script>
+
+<style src="vue-multiselect/dist/vue-multiselect.css"></style>
+<style lang="scss">
+   span.multiselect__single {
+      display: none !important;
+   }
+</style>

src/Bundle/ChillActivityBundle/Resources/public/vuejs/Activity/components/SocialIssuesAcc/CheckSocialAction.vue

@@ -0,0 +1,36 @@
+<template>
+   <span class="inline-choice">
+      <div class="form-check">
+   
+         <input class="form-check-input"
+            type="checkbox" 
+            v-model="selected"
+            name="action"
+            v-bind:id="action.id" 
+            v-bind:value="action"
+            />
+         <label class="form-check-label" v-bind:for="action.id">
+            {{ action.text }}
+         </label>
+         
+      </div>
+   </span>
+</template>
+
+<script>
+export default {
+   name: "CheckSocialAction",
+   props: [ 'action', 'selection' ],
+   emits: [ 'updateSelected' ],
+   computed: {
+      selected: {
+         set(value) {
+            this.$emit('updateSelected', value);
+         },
+         get() {
+            return this.selection;
+         }
+      }
+   }
+}
+</script>

src/Bundle/ChillActivityBundle/Resources/public/vuejs/Activity/components/SocialIssuesAcc/CheckSocialIssue.vue

@@ -0,0 +1,36 @@
+<template>
+   <span class="inline-choice">
+      <div class="form-check">
+      
+         <input class="form-check-input"
+            type="checkbox" 
+            v-model="selected"
+            name="issue"
+            v-bind:id="issue.id" 
+            v-bind:value="issue"
+            />
+         <label class="form-check-label" v-bind:for="issue.id">
+            {{ issue.text }}
+         </label>
+         
+      </div>
+   </span>
+</template>
+
+<script>
+export default {
+   name: "CheckSocialIssue",
+   props: [ 'issue', 'selection' ],
+   emits: [ 'updateSelected' ],
+   computed: {
+      selected: {
+         set(value) {
+            this.$emit('updateSelected', value);
+         },
+         get() {
+            return this.selection;
+         }
+      }
+   }
+}
+</script>

src/Bundle/ChillActivityBundle/Resources/public/vuejs/Activity/i18n.js

@@ -3,6 +3,13 @@ import { personMessages } from 'ChillPersonAssets/vuejs/_js/i18n'
 const appMessages = {
    fr: {
       activity: {
+         //
+         social_issues: "Problématiques sociales",
+         choose_other_social_issue: "Ajouter une autre problématique sociale...",
+         social_actions: "Actions d'accompagnement",
+         select_first_a_social_issue: "Sélectionnez d'abord une problématique sociale",
+         
+         //
          add_persons: "Ajouter des personnes concernées",
          bloc_persons: "Usagers",
          bloc_persons_associated: "Usagers du parcours",

src/Bundle/ChillActivityBundle/Resources/public/vuejs/Activity/store.js

@@ -21,11 +21,62 @@ const removeIdFromValue = (string, id) => {
 const store = createStore({
    strict: debug,
    state: {
-     activity: window.activity
-   },
-   getters: {
+     activity: window.activity,
+     socialIssuesOther: [],
+     socialActionsList: [],
    },
    mutations: {
+      
+      // SocialIssueAcc
+      addIssueInList(state, issue) {
+         //console.log('add issue list', issue.id);
+         state.activity.accompanyingPeriod.socialIssues.push(issue);         
+      },
+      addIssueSelected(state, issue) {
+         //console.log('add issue selected', issue.id);
+         state.activity.socialIssues.push(issue);
+      },
+      updateIssuesSelected(state, issues) {
+         //console.log('update issues selected', issues);
+         state.activity.socialIssues = issues;
+      },
+      updateIssuesOther(state, payload) {
+         //console.log('update issues other');
+         state.socialIssuesOther = payload;
+      },
+      removeIssueInOther(state, issue) {
+         //console.log('remove issue other', issue.id);
+         state.socialIssuesOther = state.socialIssuesOther.filter(i => i.id !== issue.id);
+      },
+      resetActionsList(state) {
+         //console.log('reset list actions');
+         state.socialActionsList = [];
+      },
+      addActionInList(state, action) {
+         //console.log('add action list', action.id);
+         state.socialActionsList.push(action);         
+      },
+      updateActionsSelected(state, actions) {
+         //console.log('update actions selected', actions);
+         state.activity.socialActions = actions;
+      },
+      filterList(state, list) {
+         const filterList = (list) => {
+            // remove duplicates entries
+            list = list.filter((value, index) => list.findIndex(array => array.id === value.id) === index);
+            // alpha sort
+            list.sort((a,b) => (a.text > b.text) ? 1 : ((b.text > a.text) ? -1 : 0));
+            return list;
+         };
+         if (list === 'issues') {
+            state.activity.accompanyingPeriod.socialIssues = filterList(state.activity.accompanyingPeriod.socialIssues);
+         }
+         if (list === 'actions') {
+            state.socialActionsList = filterList(state.socialActionsList);
+         }
+      },
+      
+      // ConcernedGroups
       addPersonsInvolved(state, payload) {
          //console.log('### mutation addPersonsInvolved', payload.result.type);
          switch (payload.result.type) {
@@ -56,8 +107,29 @@ const store = createStore({
       }
    },
    actions: {
+      addIssueSelected({ commit }, issue) {
+         let aSocialIssues = document.getElementById("chill_activitybundle_activity_socialIssues");
+         aSocialIssues.value = addIdToValue(aSocialIssues.value, issue.id);
+         commit('addIssueSelected', issue);
+      },
+      updateIssuesSelected({ commit }, payload) {
+         let aSocialIssues = document.getElementById("chill_activitybundle_activity_socialIssues");
+         aSocialIssues.value = '';
+         payload.forEach(item => {
+            aSocialIssues.value = addIdToValue(aSocialIssues.value, item.id);
+         });
+         commit('updateIssuesSelected', payload);
+      },
+      updateActionsSelected({ commit }, payload) {
+         let aSocialActions = document.getElementById("chill_activitybundle_activity_socialActions");
+         aSocialActions.value = '';
+         payload.forEach(item => {
+            aSocialActions.value = addIdToValue(aSocialActions.value, item.id);
+         });
+         commit('updateActionsSelected', payload);
+      },
       addPersonsInvolved({ commit }, payload) {
-         console.log('### action addPersonsInvolved', payload.result.type);
+         //console.log('### action addPersonsInvolved', payload.result.type);
          switch (payload.result.type) {
             case 'person':
                let aPersons = document.getElementById("chill_activitybundle_activity_persons");
@@ -75,7 +147,7 @@ const store = createStore({
          commit('addPersonsInvolved', payload);
       },
       removePersonInvolved({ commit }, payload) {
-         console.log('### action removePersonInvolved', payload);
+         //console.log('### action removePersonInvolved', payload);
          switch (payload.type) {
             case 'person':
                let aPersons = document.getElementById("chill_activitybundle_activity_persons");

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

@@ -59,7 +59,7 @@
                     {% for item in bloc.items %}
                     <li>
                         <a href="{{ _self.href(bloc.path, bloc.key, item.id) }}">
-                            <span class="badge badge-primary">
+                            <span class="badge bg-primary">
                                 {{ item|chill_entity_render_box({'only_denomination': true}) }}
                             </span>
                         </a>
@@ -83,7 +83,7 @@
                 {% for item in bloc.items %}
                 <li>
                     <a href="{{ _self.href(bloc.path, bloc.key, item.id) }}">
-                        <span class="badge badge-primary">
+                        <span class="badge bg-primary">
                             {{ item|chill_entity_render_box({'only_denomination': true}) }}
                         </span>
                     </a>

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

@@ -1,4 +1,4 @@
-{% extends "@ChillPerson/layout.html.twig"  %}
+{% extends "@ChillPerson/Person/layout.html.twig"  %}
 
 {% set activeRouteKey = 'chill_activity_activity_list' %}
 {% set person = activity.person %}

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

@@ -1,4 +1,5 @@
 <h1>{{ "Update activity"|trans }}</h1>
+<h2 class="chill-green mb-4">{{ entity.type.name|localize_translatable_string }}</h2>
 
 {{ form_start(edit_form) }}
 {{ form_errors(edit_form) }}
@@ -19,13 +20,15 @@
     {{ form_row(edit_form.scope) }}
 {% endif %}
 
+{%- if edit_form.socialIssues is defined -%}
+    {{ form_row(edit_form.socialIssues) }}
+{% endif %}
+
 {%- if edit_form.socialActions is defined -%}
     {{ form_row(edit_form.socialActions) }}
 {% endif %}
 
-{%- if edit_form.socialIssues is defined -%}
-    {{ form_row(edit_form.socialIssues) }}
-{% endif %}
+<div id="social-issues-acc"></div>
 
 {%- if edit_form.reasons is defined -%}
     {{ form_row(edit_form.reasons) }}
@@ -88,12 +91,12 @@
 
     <ul class="record_actions sticky-form-buttons">
         <li class="cancel">
-            <a href="{{ path('chill_activity_activity_show', { 'id': entity.id, 'person_id': person_id, 'accompanying_period_id': accompanying_course_id  } ) }}" class="sc-button bt-cancel">
+            <a href="{{ path('chill_activity_activity_show', { 'id': entity.id, 'person_id': person_id, 'accompanying_period_id': accompanying_course_id  } ) }}" class="btn btn-cancel">
                 {{ 'Cancel'|trans }}
             </a>
         </li>
         <li>
-            <button class="sc-button bt-update" type="submit">{{ 'Save activity'|trans }}</button>
+            <button class="btn btn-update" type="submit">{{ 'Save'|trans }}</button>
         </li>
     </ul>
 {{ form_end(edit_form) }}

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

@@ -5,21 +5,33 @@
 {% block title  'Update activity'|trans %}
 
 {% block content %}
-    <div id="activity"></div> {# <=== vue component #}
-    {% include 'ChillActivityBundle:Activity:edit.html.twig' %}
+<div class="activity-edit">
+    <div class="row justify-content-center">
+        <div class="col-md-10 col-xxl">
+            
+            <div id="activity"></div> {# <=== vue component #}
+            {% include 'ChillActivityBundle:Activity:edit.html.twig' %}
+            
+        </div>
+    </div>
+</div>
 {% endblock %}
 
 {% block js %}
+    {{ parent() }}
     {{ encore_entry_link_tags('async_upload') }}
     <script type="text/javascript">
-        chill.displayAlertWhenLeavingModifiedForm('form[name="{{ edit_form.vars.form.vars.name }}"]', 
+        window.addEventListener('DOMContentLoaded', function (e) {
+            chill.displayAlertWhenLeavingModifiedForm('form[name="{{ edit_form.vars.form.vars.name }}"]', 
             '{{ "You are going to leave a page with unsubmitted data. Are you sure you want to leave ?"|trans }}');
+        });
         window.activity = {{ activity_json|json_encode|raw }}; 
     </script>
     {{ encore_entry_script_tags('vue_activity') }}
 {% endblock %}
 
 {% block css %}
+    {{ parent() }}
     {{ encore_entry_link_tags('async_upload') }}
     {{ encore_entry_link_tags('vue_activity') }}
 {% endblock %}

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

@@ -14,22 +14,32 @@
  * You should have received a copy of the GNU Affero General Public License
  * along with this program.  If not, see <http://www.gnu.org/licenses/>.
 #}
-{% extends "@ChillPerson/layout.html.twig"  %}
+{% extends "@ChillPerson/Person/layout.html.twig"  %}
 
 {% set activeRouteKey = 'chill_activity_activity_list' %}
 
 {% block title  'Update activity'|trans %}
 
 {% block personcontent %}
-    {% include 'ChillActivityBundle:Activity:edit.html.twig' %}
-    <div id="activity"></div> {# <=== vue component #}
+<div class="activity-edit">
+    <div class="row justify-content-center">
+        <div class="col-md-10 col-xxl">
+            
+            <div id="activity"></div> {# <=== vue component #}
+            {% include 'ChillActivityBundle:Activity:edit.html.twig' %}
+            
+        </div>
+    </div>
+</div>
 {% endblock %}
 
 {% block js %}
     {{ encore_entry_link_tags('async_upload') }}
     <script type="text/javascript">
-        chill.displayAlertWhenLeavingModifiedForm('form[name="{{ edit_form.vars.form.vars.name }}"]', 
+        window.addEventListener('DOMContentLoaded', function (e) {
+            chill.displayAlertWhenLeavingModifiedForm('form[name="{{ edit_form.vars.form.vars.name }}"]', 
             '{{ "You are going to leave a page with unsubmitted data. Are you sure you want to leave ?"|trans }}');
+        });
         window.activity = {{ activity_json|json_encode|raw }};
     </script>
     {{ encore_entry_script_tags('vue_activity') }}

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

@@ -13,11 +13,11 @@
 {% if activities|length == 0 %}
     <p class="chill-no-data-statement">
         {{ "There isn't any activities."|trans }}
-        <a href="{{ path('chill_activity_activity_new', {'person_id': person_id, 'accompanying_period_id': accompanying_course_id}) }}" class="sc-button bt-create button-small"></a>
+        <a href="{{ path('chill_activity_activity_new', {'person_id': person_id, 'accompanying_period_id': accompanying_course_id}) }}" class="btn btn-create button-small"></a>
     </p>
 {% else %}
 
-<div class="flex-table list-records {{ context }}">
+<div class="flex-table list-records context-{{ context }}">
     <!--
     <thead>
         <tr>
@@ -54,6 +54,20 @@
                         </p>
                         {% endif %}
                     </div>
+
+                    {% if context == 'person' and activity.accompanyingPeriod is not empty %}
+                      <div class="accompanyingPeriodLink" style="margin-top: 1rem">
+                        <a 
+                           href="{{ chill_path_add_return_path(
+                            "chill_person_accompanying_course_index",
+                            { 'accompanying_period_id': activity.accompanyingPeriod.id }
+                            ) }}"
+                           >
+                          <i class="fa fa-random"></i>
+                          {{ activity.accompanyingPeriod.id }}
+                        </a>
+                      </div>
+                    {% endif %}
                     
                 </div>
                 <div class="item-col">
@@ -114,7 +128,7 @@
                                     <span class="chill-no-data-statement">{{ 'No social actions associated'|trans }}</span>
                                 {%- else -%}
                                     {% for r in activity.socialActions %}
-                                        <span class="badge badge-primary">{{ r.title|localize_translatable_string }}</span>
+                                        <span class="badge bg-primary">{{ r.title|localize_translatable_string }}</span>
                                     {% endfor %}
                                 {%- endif -%}
                             </li>
@@ -124,20 +138,20 @@
                     </ul>
                     <ul class="record_actions">
                         <li>
-                            <a href="{{ path('chill_activity_activity_show', { 'id': activity.id, 'person_id': person_id, 'accompanying_period_id': accompanying_course_id }) }}" class="sc-button bt-show "></a>
+                            <a href="{{ path('chill_activity_activity_show', { 'id': activity.id, 'person_id': person_id, 'accompanying_period_id': accompanying_course_id }) }}" class="btn btn-show "></a>
                         </li>
                         {# TOOD
                         {% if is_granted('CHILL_ACTIVITY_UPDATE', activity) %}
                         #}
                         <li>
-                            <a href="{{ path('chill_activity_activity_edit', { 'id': activity.id, 'person_id': person_id, 'accompanying_period_id': accompanying_course_id }) }}" class="sc-button bt-update "></a>
+                            <a href="{{ path('chill_activity_activity_edit', { 'id': activity.id, 'person_id': person_id, 'accompanying_period_id': accompanying_course_id }) }}" class="btn btn-update "></a>
                         </li>
                         {# TOOD
                         {% endif %}
                         {% if is_granted('CHILL_ACTIVITY_DELETE', activity) %}
                         #}
                         <li>
-                            <a href="{{ path('chill_activity_activity_delete', { 'id': activity.id, 'person_id' : person_id, 'accompanying_period_id': accompanying_course_id } ) }}" class="sc-button bt-delete "></a>
+                            <a href="{{ path('chill_activity_activity_delete', { 'id': activity.id, 'person_id' : person_id, 'accompanying_period_id': accompanying_course_id } ) }}" class="btn btn-delete "></a>
                         </li>
                         {#
                         {% endif %}
@@ -147,13 +161,14 @@
             </div>
             
             {%  
-                if activity.comment.comment is not empty 
+                if activity.comment.comment is not empty
                 or activity.persons|length > 0
                 or activity.thirdParties|length > 0
                 or activity.users|length > 0 
             %}
             <div class="item-row details">
                 <div class="item-col">
+
                     {% include 'ChillActivityBundle:Activity:concernedGroups.html.twig' with {'context': context, 'with_display': 'row', 'entity': activity } %}
                 </div>
                 
@@ -170,10 +185,13 @@
 </div>
 {% endif %}
 
-<ul class="record_actions">
-    <li>
-        <a href="{{ path('chill_activity_activity_new', {'person_id': person_id, 'accompanying_period_id': accompanying_course_id}) }}" class="sc-button bt-create">
-            {{ 'Add a new activity' | trans }}
-        </a>
-    </li>
-</ul>
+{% if context != 'person' %}
+{# TODO set this condition in configuration #}
+  <ul class="record_actions">
+      <li>
+          <a href="{{ path('chill_activity_activity_new', {'person_id': person_id, 'accompanying_period_id': accompanying_course_id}) }}" class="btn btn-create">
+              {{ 'Add a new activity' | trans }}
+          </a>
+      </li>
+  </ul>
+{% endif %}

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

@@ -14,7 +14,7 @@
  * You should have received a copy of the GNU Affero General Public License
  * along with this program.  If not, see <http://www.gnu.org/licenses/>.
 #}
-{% extends "@ChillPerson/layout.html.twig"  %}
+{% extends "@ChillPerson/Person/layout.html.twig"  %}
 
 {% set activeRouteKey = 'chill_activity_activity_list' %}
 

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

@@ -1,4 +1,5 @@
-<h1>{{ "Activity creation"|trans }}</h1>
+<h1>{{ "Activity creation"|trans ~ ' :' }}</h1>
+<h2 class="chill-green mb-4">{{ entity.type.name|localize_translatable_string }}</h2>
 
 {{ form_start(form) }}
 {{ form_errors(form) }}
@@ -20,14 +21,15 @@
     {{ form_row(form.scope) }}
 {% endif %}
 
-{%- if form.socialActions is defined -%}
-    {{ form_row(form.socialActions) }}
-{% endif %}
-
 {%- if form.socialIssues is defined -%}
     {{ form_row(form.socialIssues) }}
 {% endif %}
 
+{%- if form.socialActions is defined -%}
+    {{ form_row(form.socialActions) }}
+{% endif %}
+
+<div id="social-issues-acc"></div>
 
 {%- if form.reasons is defined -%}
     {{ form_row(form.reasons) }}
@@ -81,7 +83,7 @@
 <ul class="record_actions sticky-form-buttons">
   <li class="cancel">
     <a 
-      class="sc-button bt-cancel"
+      class="btn btn-cancel"
       {%- if context == 'person' -%} 
       href="{{ chill_return_path_or('chill_activity_activity_list', { 'person_id': person.id } )}}"
       {%- else -%}
@@ -92,8 +94,8 @@
     </a>
   </li>
   <li>
-    <button class="sc-button bt-create" type="submit">
-      {{ 'Add a new activity'|trans }}
+    <button class="btn btn-create" type="submit">
+      {{ 'Create'|trans }}
     </button>
   </li>
 </ul>

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

@@ -5,21 +5,33 @@
 {% block title 'Activity creation' |trans %}
 
 {% block content %}
-    <div id="activity"></div> {# <=== vue component #}
-    {% include 'ChillActivityBundle:Activity:new.html.twig' with {'context': 'accompanyingCourse'} %}
+<div class="activity-new">
+    <div class="row justify-content-center">
+        <div class="col-md-10 col-xxl">
+            
+            <div id="activity"></div> {# <=== vue component #}
+            {% include 'ChillActivityBundle:Activity:new.html.twig' with {'context': 'accompanyingCourse'} %}
+            
+        </div>
+    </div>
+</div>            
 {% endblock %}
 
 {% block js %}
+    {{ parent() }}
     {{ encore_entry_script_tags('async_upload') }}
     <script type="text/javascript">
-        chill.displayAlertWhenLeavingUnsubmittedForm('form[name="{{ form.vars.form.vars.name }}"]', 
+        window.addEventListener('DOMContentLoaded', function (e) {
+            chill.displayAlertWhenLeavingUnsubmittedForm('form[name="{{ form.vars.form.vars.name }}"]', 
             '{{ "You are going to leave a page with unsubmitted data. Are you sure you want to leave ?"|trans }}');
+        });
         window.activity = {{ activity_json|json_encode|raw }}; 
     </script>
     {{ encore_entry_script_tags('vue_activity') }}
 {% endblock %}
 
 {% block css %}
+    {{ parent() }}
     <link rel="stylesheet" href="{{ asset('build/async_upload.css') }}"/>
     {{ encore_entry_link_tags('vue_activity') }}
 {% endblock %}

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

@@ -1,19 +1,29 @@
-{% extends "@ChillPerson/layout.html.twig"  %}
+{% extends "@ChillPerson/Person/layout.html.twig"  %}
 
 {% set activeRouteKey = 'chill_activity_activity_new' %}
 
 {% block title 'Activity creation' |trans %}
 
 {% block personcontent %}
-    {% include 'ChillActivityBundle:Activity:new.html.twig' with {'context': 'person'} %}
-    <div id="activity"></div> {# <=== vue component #}
+<div class="activity-new">
+    <div class="row justify-content-center">
+        <div class="col-md-10 col-xxl">
+            
+            <div id="activity"></div> {# <=== vue component #}
+            {% include 'ChillActivityBundle:Activity:new.html.twig' with {'context': 'person'} %}
+            
+        </div>
+    </div>
+</div>
 {% endblock %}
 
 {% block js %}
     {{ encore_entry_link_tags('async_upload') }}
     <script type="text/javascript">
-        chill.displayAlertWhenLeavingUnsubmittedForm('form[name="{{ form.vars.form.vars.name }}"]', 
+        window.addEventListener('DOMContentLoaded', function (e) {
+            chill.displayAlertWhenLeavingUnsubmittedForm('form[name="{{ form.vars.form.vars.name }}"]', 
             '{{ "You are going to leave a page with unsubmitted data. Are you sure you want to leave ?"|trans }}');
+        });
         window.activity = {{ activity_json|json_encode|raw }};
     </script>
     {{ encore_entry_script_tags('vue_activity') }}

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

@@ -4,7 +4,7 @@
 
 {% for row in data %}
     <h3>{{ row.activityTypeCategory.name|localize_translatable_string }}</h3>
-    <div style="display:flex;justify-content:center;gap:12px;flex-wrap:wrap;">
+    <div class="activity-row">
         {% for activityType in row.activityTypes %}
 
             {% set person_id = null %}
@@ -19,7 +19,7 @@
 
             <a href="{{ path('chill_activity_activity_new', {'person_id': person_id, 'activityType_id': activityType.id, 'accompanying_period_id': accompanying_course_id }) }}">
 
-                <div style="width:200px;height:200px;border:1px dotted red;display:flex;justify-content:center;align-items:center;align-content:center;">
+                <div class="bloc btn btn-primary btn-lg btn-block">
                     {{ activityType.name|localize_translatable_string }}
                 </div>
             </a>

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

@@ -1,4 +1,4 @@
-{% extends "@ChillPerson/layout.html.twig"  %}
+{% extends "@ChillPerson/Person/layout.html.twig"  %}
 
 {% set activeRouteKey = 'chill_activity_activity_new' %}
 

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

@@ -4,7 +4,7 @@
 <h1>
   {{ "Activity"|trans }}
   {%- if t.emergencyVisible and entity.emergency -%}
-  <span class="badge badge-secondary">
+  <span class="badge bg-secondary">
     {{- 'Emergency'|trans -}}
   </span>
 {%- endif -%}
@@ -109,25 +109,28 @@
     {% set accompanying_course_id = accompanyingCourse.id %}
 {% endif %}
 
-<ul class="record_actions">
+<ul class="record_actions sticky-form-buttons">
     <li class="cancel">
-        <a class="sc-button bt-cancel" href="{{ path('chill_activity_activity_list', { 'person_id': person_id, 'accompanying_period_id': accompanying_course_id } ) }}">
+        <a class="btn btn-cancel" href="{{ path('chill_activity_activity_list', { 'person_id': person_id, 'accompanying_period_id': accompanying_course_id } ) }}">
             {{ 'Back to the list'|trans }}
         </a>
     </li>
     <li>
-    <a class="sc-button bt-update" href="{{ path('chill_activity_activity_edit', { 'id': entity.id, 'person_id': person_id, 'accompanying_period_id': accompanying_course_id }) }}">
-        {{ 'Edit the activity'|trans }}
-    </a>
+        <a class="btn btn-update" href="{{ path('chill_activity_activity_edit', { 'id': entity.id, 'person_id': person_id, 'accompanying_period_id': accompanying_course_id }) }}">
+            {{ 'Edit'|trans }}
+        </a>
     </li>
+    
     {# TODO
     {% if is_granted('CHILL_ACTIVITY_DELETE', entity) %}
     #}
+    
     <li>
-        <a href="{{ path('chill_activity_activity_delete', { 'id': entity.id, 'person_id' : person_id, 'accompanying_period_id': accompanying_course_id } ) }}" class="sc-button bt-delete">
+        <a href="{{ path('chill_activity_activity_delete', { 'id': entity.id, 'person_id' : person_id, 'accompanying_period_id': accompanying_course_id } ) }}" class="btn btn-delete">
             {{ 'Delete'|trans }}
         </a>
     </li>
+    
     {#
     {% endif %}
     #}

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

@@ -7,5 +7,13 @@
 {% import 'ChillActivityBundle:ActivityReason:macro.html.twig' as m %}
 
 {% block content -%}
-    {% include 'ChillActivityBundle:Activity:show.html.twig' with {'context': 'accompanyingCourse'} %}
+<div class="activity-show">
+    <div class="row justify-content-center">
+        <div class="col-md-10 col-xxl">
+            
+            {% include 'ChillActivityBundle:Activity:show.html.twig' with {'context': 'accompanyingCourse'} %}
+            
+        </div>
+    </div>
+</div> 
 {% endblock content %}

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

@@ -0,0 +1,4 @@
+
+{{ dump(notification) }}
+
+<a href="{{ path('chill_activity_activity_show', {'id': notification.relatedEntityId })  }}">Go to Activity</a>

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

@@ -1,4 +1,4 @@
-{% extends "@ChillPerson/layout.html.twig"  %}
+{% extends "@ChillPerson/Person/layout.html.twig"  %}
 
 {% set activeRouteKey = 'chill_activity_activity_list' %}
 
@@ -7,5 +7,13 @@
 {% import 'ChillActivityBundle:ActivityReason:macro.html.twig' as m %}
 
 {% block personcontent -%}
-    {% include 'ChillActivityBundle:Activity:show.html.twig' with {'context': 'person'} %}
+<div class="activity-show">
+    <div class="row justify-content-center">
+        <div class="col-md-10 col-xxl">
+            
+            {% include 'ChillActivityBundle:Activity:show.html.twig' with {'context': 'person'} %}
+            
+        </div>
+    </div>
+</div>                
 {% endblock personcontent %}

src/Bundle/ChillActivityBundle/Resources/views/ActivityPresence/index.html.twig

@@ -25,7 +25,7 @@
                 <td>
                     <ul class="record_actions">
                         <li>
-                            <a href="{{ path('chill_crud_activity_presence_edit', { 'id': entity.id }) }}" class="sc-button bt-edit" title="{{ 'edit'|trans }}"></a>
+                            <a href="{{ path('chill_crud_activity_presence_edit', { 'id': entity.id }) }}" class="btn btn-edit" title="{{ 'edit'|trans }}"></a>
                         </li>
                     </ul>
                 </td>
@@ -36,7 +36,7 @@
 
     <ul class="record_actions">
         <li>
-            <a href="{{ path('chill_crud_activity_presence_new') }}" class="sc-button bt-create">
+            <a href="{{ path('chill_crud_activity_presence_new') }}" class="btn btn-create">
                 {{ 'Create a new activity presence'|trans }}
             </a>
         </li>

src/Bundle/ChillActivityBundle/Resources/views/ActivityReason/edit.html.twig

@@ -26,10 +26,10 @@
 
     <ul class="record_actions">
         <li class="cancel">
-            <a href="{{ path('chill_activity_activityreason') }}" class="sc-button bt-cancel">{{ 'Back to the list'|trans }}</a>
+            <a href="{{ path('chill_activity_activityreason') }}" class="btn btn-cancel">{{ 'Back to the list'|trans }}</a>
         </li>
         <li>
-            {{ form_row(edit_form.submit, { 'attr': { 'class' : 'sc-button orange' } } ) }}
+            {{ form_row(edit_form.submit, { 'attr': { 'class' : 'btn btn-chill-orange' } } ) }}
         </li>
     </ul>
 

src/Bundle/ChillActivityBundle/Resources/views/ActivityReason/index.html.twig

@@ -33,10 +33,10 @@
                 <td>
                 <ul class="record_actions">
                     <li>
-                        <a href="{{ path('chill_activity_activityreason_show', { 'id': entity.id }) }}" class="sc-button bt-show" title="{{ 'show'|trans }}"></a>
+                        <a href="{{ path('chill_activity_activityreason_show', { 'id': entity.id }) }}" class="btn btn-show" title="{{ 'show'|trans }}"></a>
                     </li>
                     <li>
-                        <a href="{{ path('chill_activity_activityreason_edit', { 'id': entity.id }) }}" class="sc-button bt-edit" title="{{ 'edit'|trans }}"></a>
+                        <a href="{{ path('chill_activity_activityreason_edit', { 'id': entity.id }) }}" class="btn btn-edit" title="{{ 'edit'|trans }}"></a>
                     </li>
                 </ul>
                 </td>
@@ -47,7 +47,7 @@
 
     <ul class="record_actions">
         <li>
-            <a href="{{ path('chill_activity_activityreason_new') }}" class="sc-button bt-new">
+            <a href="{{ path('chill_activity_activityreason_new') }}" class="btn btn-new">
                 {{ 'Create a new activity reason'|trans }}
             </a>
         </li>

src/Bundle/ChillActivityBundle/Resources/views/ActivityReason/new.html.twig

@@ -26,10 +26,10 @@
 
     <ul class="record_actions">
         <li class="cancel">
-            <a href="{{ path('chill_activity_activityreason') }}" class="sc-button bt-cancel">{{ 'Back to the list'|trans }}</a>
+            <a href="{{ path('chill_activity_activityreason') }}" class="btn btn-cancel">{{ 'Back to the list'|trans }}</a>
         </li>
         <li>
-            {{ form_row(form.submit, { 'attr': { 'class' : 'sc-button bt-new' } } ) }}
+            {{ form_row(form.submit, { 'attr': { 'class' : 'btn btn-new' } } ) }}
         </li>
     </ul>
 

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

@@ -40,12 +40,12 @@
 
     <ul class="record_actions">
         <li class="cancel">
-            <a href="{{ path('chill_activity_activityreason') }}" class="sc-button bt-cancel">
+            <a href="{{ path('chill_activity_activityreason') }}" class="btn btn-cancel">
                 {{ 'Back to the list'|trans }}
             </a>
         </li>
         <li>
-            <a href="{{ path('chill_activity_activityreason_edit', { 'id': entity.id }) }}" class="sc-button bt-edit">
+            <a href="{{ path('chill_activity_activityreason_edit', { 'id': entity.id }) }}" class="btn btn-edit">
                 {{ 'Edit'|trans }}
             </a>
         </li>

src/Bundle/ChillActivityBundle/Resources/views/ActivityReasonCategory/edit.html.twig

@@ -25,12 +25,12 @@
 
     <ul class="record_actions">
         <li class="cancel">
-            <a href="{{ path('chill_activity_activityreasoncategory') }}" class="sc-button bt-cancel">
+            <a href="{{ path('chill_activity_activityreasoncategory') }}" class="btn btn-cancel">
                 {{ 'Back to the list'|trans }}
             </a>
         </li>
         <li>
-            {{ form_row(edit_form.submit, { 'attr': { 'class': 'sc-button bt-edit' } } ) }}
+            {{ form_row(edit_form.submit, { 'attr': { 'class': 'btn btn-edit' } } ) }}
         </li>
     </ul>
 

src/Bundle/ChillActivityBundle/Resources/views/ActivityReasonCategory/index.html.twig

@@ -34,10 +34,10 @@
                 <td>
                     <ul class="record_actions">
                     <li>
-                        <a href="{{ path('chill_activity_activityreasoncategory_show', { 'id': entity.id }) }}" class="sc-button bt-show" title="{{ 'show'|trans }}"></a>
+                        <a href="{{ path('chill_activity_activityreasoncategory_show', { 'id': entity.id }) }}" class="btn btn-show" title="{{ 'show'|trans }}"></a>
                     </li>
                     <li>
-                        <a href="{{ path('chill_activity_activityreasoncategory_edit', { 'id': entity.id }) }}" class="sc-button bt-edit" title="{{ 'edit'|trans }}"></a>
+                        <a href="{{ path('chill_activity_activityreasoncategory_edit', { 'id': entity.id }) }}" class="btn btn-edit" title="{{ 'edit'|trans }}"></a>
                     </li>
                 </ul>
                 </td>
@@ -48,7 +48,7 @@
 
     <ul class="record_actions">
         <li>
-            <a href="{{ path('chill_activity_activityreasoncategory_new') }}" class="sc-button bt-new">
+            <a href="{{ path('chill_activity_activityreasoncategory_new') }}" class="btn btn-new">
                 {{ 'Create a new activity category reason'|trans }}
             </a>
         </li>

src/Bundle/ChillActivityBundle/Resources/views/ActivityReasonCategory/new.html.twig

@@ -25,10 +25,10 @@
 
     <ul class="record_actions">
         <li class="cancel">
-            <a href="{{ path('chill_activity_activityreasoncategory') }}" class="sc-button bt-cancel">{{ 'Back to the list'|trans }}</a>
+            <a href="{{ path('chill_activity_activityreasoncategory') }}" class="btn btn-cancel">{{ 'Back to the list'|trans }}</a>
         </li>
         <li>
-            {{ form_widget(form.submit, { 'attr': { 'class' : 'sc-button bt-new' } } ) }}
+            {{ form_widget(form.submit, { 'attr': { 'class' : 'btn btn-new' } } ) }}
         </li>
     </ul>
     {{ form_end(form) }}

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

@@ -39,12 +39,12 @@
     </table>
     <ul class="record_actions">
         <li class="cancel">
-            <a href="{{ path('chill_activity_activityreasoncategory') }}" class="sc-button bt-cancel">
+            <a href="{{ path('chill_activity_activityreasoncategory') }}" class="btn btn-cancel">
                 {{ 'Back to the list'|trans }}
             </a>
         </li>
         <li>
-            <a href="{{ path('chill_activity_activityreasoncategory_edit', { 'id': entity.id }) }}" class="sc-button bt-edit">
+            <a href="{{ path('chill_activity_activityreasoncategory_edit', { 'id': entity.id }) }}" class="btn btn-edit">
                 {{ 'Edit'|trans }}
             </a>
         </li>

src/Bundle/ChillActivityBundle/Resources/views/ActivityType/index.html.twig

@@ -41,7 +41,7 @@
                 <td>
                 <ul class="record_actions">
                     <li>
-                        <a href="{{ path('chill_crud_activity_type_edit', { 'id': entity.id }) }}" class="sc-button bt-edit" title="{{ 'edit'|trans }}"></a>
+                        <a href="{{ path('chill_crud_activity_type_edit', { 'id': entity.id }) }}" class="btn btn-edit" title="{{ 'edit'|trans }}"></a>
                     </li>
                 </ul>
                 </td>
@@ -52,7 +52,7 @@
 
         <ul class="record_actions">
         <li>
-            <a href="{{ path('chill_crud_activity_type_new') }}" class="sc-button bt-create">
+            <a href="{{ path('chill_crud_activity_type_new') }}" class="btn btn-create">
                 {{ 'Create a new activity type'|trans }}
             </a>
         </li>

src/Bundle/ChillActivityBundle/Resources/views/ActivityTypeCategory/index.html.twig

@@ -25,7 +25,7 @@
                 <td>
                     <ul class="record_actions">
                         <li>
-                            <a href="{{ path('chill_crud_activity_type_category_edit', { 'id': entity.id }) }}" class="sc-button bt-edit" title="{{ 'edit'|trans }}"></a>
+                            <a href="{{ path('chill_crud_activity_type_category_edit', { 'id': entity.id }) }}" class="btn btn-edit" title="{{ 'edit'|trans }}"></a>
                         </li>
                     </ul>
                 </td>
@@ -36,7 +36,7 @@
 
     <ul class="record_actions">
         <li>
-            <a href="{{ path('chill_crud_activity_type_category_new') }}" class="sc-button bt-create">
+            <a href="{{ path('chill_crud_activity_type_category_new') }}" class="btn btn-create">
                 {{ 'Create a new activity type category'|trans }}
             </a>
         </li>

src/Bundle/ChillActivityBundle/Resources/views/Timeline/activity_person_context.html.twig

@@ -29,13 +29,13 @@
 
     <ul class="record_actions">
         <li>
-            <a href="{{ path('chill_activity_activity_show', { 'person_id': activity.person.id, 'id': activity.id} ) }}" class="sc-button bt-view">
+            <a href="{{ path('chill_activity_activity_show', { 'person_id': activity.person.id, 'id': activity.id} ) }}" class="btn btn-view">
                 {{ 'Show the activity'|trans }}
             </a>
         </li>
         {% if is_granted('CHILL_ACTIVITY_UPDATE', activity) %}
         <li>
-            <a href="{{ path('chill_activity_activity_edit', { 'person_id': activity.person.id, 'id': activity.id} ) }}" class="sc-button bt-edit">
+            <a href="{{ path('chill_activity_activity_edit', { 'person_id': activity.person.id, 'id': activity.id} ) }}" class="btn btn-edit">
                 {{ 'Edit the activity'|trans }}
             </a>
         </li>

src/Bundle/ChillActivityBundle/config/services.yaml

@@ -1,4 +1,4 @@
-services:     
+services:
     chill.activity.security.authorization.activity_voter:
         class: Chill\ActivityBundle\Security\Authorization\ActivityVoter
         arguments:
@@ -6,7 +6,7 @@ services:
         tags:
             - { name: security.voter }
             - { name: chill.role }
-            
+
     chill.activity.security.authorization.activity_stats_voter:
         class: Chill\ActivityBundle\Security\Authorization\ActivityStatsVoter
         arguments:
@@ -14,8 +14,8 @@ services:
         tags:
             - { name: security.voter }
             - { name: chill.role }
-            
-            
+
+
     chill.activity.timeline:
         class: Chill\ActivityBundle\Timeline\TimelineActivityProvider
         arguments:
@@ -33,3 +33,8 @@ services:
         autoconfigure: true
         resource: '../Menu/'
         tags: ['chill.menu_builder']
+
+    Chill\ActivityBundle\Notification\:
+        autowire: true
+        autoconfigure: true
+        resource: '../Notification'

src/Bundle/ChillActivityBundle/config/services/form.yaml

@@ -32,6 +32,7 @@ services:
             - "@chill.main.helper.translatable_string"
             - "%chill_activity.form.time_duration%"
             - '@Chill\PersonBundle\Templating\Entity\SocialIssueRender'
+            - '@Chill\PersonBundle\Templating\Entity\SocialActionRender'
         tags:
             - { name: form.type, alias: chill_activitybundle_activity }
 

src/Bundle/ChillActivityBundle/translations/messages.fr.yml

@@ -38,7 +38,7 @@ Required: Obligatoire
 Persons: Personnes
 Users: Utilisateurs
 Emergency: Urgent
-Sent received: Envoyer / Recevoir
+Sent received: Entrant / Sortant
 Sent: Envoyer
 Received: Recevoir
 by: 'Par '
@@ -74,6 +74,7 @@ Users concerned: T(M)S
 activity:
     Insert a document: Insérer un document
     Remove a document: Supprimer le document
+    comment: Commentaire
 
 
 #timeline

src/Bundle/ChillBudgetBundle/Resources/views/Charge/confirm_delete.html.twig

@@ -1,4 +1,4 @@
-{% extends "@ChillPerson/layout.html.twig"  %}
+{% extends "@ChillPerson/Person/layout.html.twig"  %}
 
 {% set activeRouteKey = '' %}
 {% set person = element.person %}

src/Bundle/ChillBudgetBundle/Resources/views/Charge/edit.html.twig

@@ -1,4 +1,4 @@
-{% extends "@ChillPerson/layout.html.twig" %}
+{% extends "@ChillPerson/Person/layout.html.twig" %}
 
 {% set activeRouteKey = '' %}
 {% set title = 'Edit Charge for %name%'|trans({ '%name%' : person.firstName ~ " " ~ person.lastName } ) %}
@@ -18,12 +18,12 @@
 
 <ul class="record_actions sticky-form-buttons">
     <li class="cancel">
-        <a href="{{ path("chill_budget_elements_index", { 'id': person.id } ) }}" class="sc-button bt-cancel">
+        <a href="{{ path("chill_budget_elements_index", { 'id': person.id } ) }}" class="btn btn-cancel">
            {{ 'Back to the list'|trans }}
         </a>
     </li>
     <li>
-        {{ form_widget(form.submit, { 'attr' : { 'class': 'sc-button bt-create' }, 'label': 'Edit' } ) }}
+        {{ form_widget(form.submit, { 'attr' : { 'class': 'btn btn-create' }, 'label': 'Edit' } ) }}
     </li>
 </ul>
        

src/Bundle/ChillBudgetBundle/Resources/views/Charge/new.html.twig

@@ -1,4 +1,4 @@
-{% extends "@ChillPerson/layout.html.twig" %}
+{% extends "@ChillPerson/Person/layout.html.twig" %}
 
 {% set activeRouteKey = '' %}
 {% set title = 'New Charge for %name%'|trans({ '%name%' : person.firstName ~ " " ~ person.lastName } ) %}
@@ -18,12 +18,12 @@
 
 <ul class="record_actions sticky-form-buttons">
     <li class="cancel">
-        <a href="{{ path("chill_budget_elements_index", { 'id': person.id } ) }}" class="sc-button bt-cancel">
+        <a href="{{ path("chill_budget_elements_index", { 'id': person.id } ) }}" class="btn btn-cancel">
            {{ 'Back to the list'|trans }}
         </a>
     </li>
     <li>
-        {{ form_widget(form.submit, { 'attr' : { 'class': 'sc-button bt-create' }, 'label': 'Create' } ) }}
+        {{ form_widget(form.submit, { 'attr' : { 'class': 'btn btn-create' }, 'label': 'Create' } ) }}
     </li>
 </ul>
        

src/Bundle/ChillBudgetBundle/Resources/views/Charge/view.html.twig

@@ -1,4 +1,4 @@
-{% extends "@ChillPerson/layout.html.twig" %}
+{% extends "@ChillPerson/Person/layout.html.twig" %}
 
 {% set activeRouteKey = '' %}
 {% set person = element.person %}
@@ -39,13 +39,13 @@
 
 <ul class="record_actions sticky-form-buttons">
     <li class="cancel">
-        <a href="{{ path("chill_budget_elements_index", { 'id': person.id } ) }}" class="sc-button bt-cancel">
+        <a href="{{ path("chill_budget_elements_index", { 'id': person.id } ) }}" class="btn btn-cancel">
            {{ 'Back to the list'|trans }}
         </a>
     </li>
     {% if is_granted(constant('Chill\\AMLI\\BudgetBundle\\Security\\Authorization\\BudgetElementVoter::UPDATE'), element) %}
         <li>
-            <a href="{{ path('chill_budget_charge_edit', { 'id': element.id } ) }}" class="sc-button bt-edit">{{ 'Edit'|trans }}</a>
+            <a href="{{ path('chill_budget_charge_edit', { 'id': element.id } ) }}" class="btn btn-edit">{{ 'Edit'|trans }}</a>
         </li>
     {% endif %}
 </ul>

src/Bundle/ChillBudgetBundle/Resources/views/Element/index.html.twig

@@ -1,4 +1,4 @@
-{% extends "@ChillPerson/layout.html.twig" %}
+{% extends "@ChillPerson/Person/layout.html.twig" %}
 
 {% set activeRouteKey = '' %}
 {% set title = 'Budget for %name%'|trans({ '%name%' : person.firstName ~ " " ~ person.lastName } ) %}
@@ -68,17 +68,17 @@
                 <ul class="record_actions">
                     {% if is_granted(constant('Chill\\AMLI\\BudgetBundle\\Security\\Authorization\\BudgetElementVoter::SHOW'), f) %}
                         <li>
-                            <a href="{{ path('chill_budget_' ~ family ~ '_view', { 'id': f.id } ) }}" class="sc-button bt-show"></a>
+                            <a href="{{ path('chill_budget_' ~ family ~ '_view', { 'id': f.id } ) }}" class="btn btn-show"></a>
                         </li>
                     {% endif %}
                     {% if is_granted(constant('Chill\\AMLI\\BudgetBundle\\Security\\Authorization\\BudgetElementVoter::UPDATE'), f) %}
                         <li>
-                            <a href="{{ path('chill_budget_' ~ family ~'_edit', { 'id': f.id } ) }}" class="sc-button bt-edit"></a>
+                            <a href="{{ path('chill_budget_' ~ family ~'_edit', { 'id': f.id } ) }}" class="btn btn-edit"></a>
                         </li>
                     {% endif %}
                     {% if is_granted(constant('Chill\\AMLI\\BudgetBundle\\Security\\Authorization\\BudgetElementVoter::DELETE'), f) %}
                         <li>
-                            <a href="{{ path('chill_budget_' ~ family ~ '_delete', { 'id': f.id } ) }}" class="sc-button bt-delete"></a>
+                            <a href="{{ path('chill_budget_' ~ family ~ '_delete', { 'id': f.id } ) }}" class="btn btn-delete"></a>
                         </li>
                     {% endif %}
                 </ul>
@@ -161,10 +161,10 @@
     {% if is_granted(constant('Chill\\AMLI\\BudgetBundle\\Security\\Authorization\\BudgetElementVoter::CREATE'), person) %}
     <ul class="record_actions">
         <li>
-            <a class="sc-button bt-create" href="{{ path('chill_budget_resource_new', { 'id': person.id} ) }}">{{ 'Create new resource'|trans }}</a>
+            <a class="btn btn-create" href="{{ path('chill_budget_resource_new', { 'id': person.id} ) }}">{{ 'Create new resource'|trans }}</a>
         </li>
         <li>
-            <a class="sc-button bt-create" href="{{ path('chill_budget_charge_new', { 'id': person.id} ) }}">{{ 'Create new charge'|trans }}</a>
+            <a class="btn btn-create" href="{{ path('chill_budget_charge_new', { 'id': person.id} ) }}">{{ 'Create new charge'|trans }}</a>
         </li>
     </ul>
     {% endif %}
@@ -215,10 +215,10 @@
     {% if is_granted(constant('Chill\\AMLI\\BudgetBundle\\Security\\Authorization\\BudgetElementVoter::CREATE'), person) %}
         <ul class="record_actions">
             <li>
-                <a class="sc-button bt-create" href="{{ path('chill_budget_resource_new', { 'id': person.id} ) }}">{{ 'Create new resource'|trans }}</a>
+                <a class="btn btn-create" href="{{ path('chill_budget_resource_new', { 'id': person.id} ) }}">{{ 'Create new resource'|trans }}</a>
             </li>
             <li>
-                <a class="sc-button bt-create" href="{{ path('chill_budget_charge_new', { 'id': person.id} ) }}">{{ 'Create new charge'|trans }}</a>
+                <a class="btn btn-create" href="{{ path('chill_budget_charge_new', { 'id': person.id} ) }}">{{ 'Create new charge'|trans }}</a>
             </li>
         </ul>
     {% endif %}

src/Bundle/ChillBudgetBundle/Resources/views/Resource/confirm_delete.html.twig

@@ -1,4 +1,4 @@
-{% extends "@ChillPerson/layout.html.twig"  %}
+{% extends "@ChillPerson/Person/layout.html.twig"  %}
 
 {% set activeRouteKey = '' %}
 {% set person = element.person %}

src/Bundle/ChillBudgetBundle/Resources/views/Resource/edit.html.twig

@@ -1,4 +1,4 @@
-{% extends "@ChillPerson/layout.html.twig" %}
+{% extends "@ChillPerson/Person/layout.html.twig" %}
 
 {% set activeRouteKey = '' %}
 {% set title = 'Edit Resource for %name%'|trans({ '%name%' : person.firstName ~ " " ~ person.lastName } ) %}
@@ -17,12 +17,12 @@
 
 <ul class="record_actions sticky-form-buttons">
     <li class="cancel">
-        <a href="{{ path("chill_budget_elements_index", { 'id': person.id } ) }}" class="sc-button bt-cancel">
+        <a href="{{ path("chill_budget_elements_index", { 'id': person.id } ) }}" class="btn btn-cancel">
            {{ 'Back to the list'|trans }}
         </a>
     </li>
     <li>
-        {{ form_widget(form.submit, { 'attr' : { 'class': 'sc-button bt-create' }, 'label': 'Edit' } ) }}
+        {{ form_widget(form.submit, { 'attr' : { 'class': 'btn btn-create' }, 'label': 'Edit' } ) }}
     </li>
 </ul>
        

src/Bundle/ChillBudgetBundle/Resources/views/Resource/new.html.twig

@@ -1,4 +1,4 @@
-{% extends "@ChillPerson/layout.html.twig" %}
+{% extends "@ChillPerson/Person/layout.html.twig" %}
 
 {% set activeRouteKey = '' %}
 {% set title = 'New Resource for %name%'|trans({ '%name%' : person.firstName ~ " " ~ person.lastName } ) %}
@@ -17,12 +17,12 @@
 
 <ul class="record_actions sticky-form-buttons">
     <li class="cancel">
-        <a href="{{ path("chill_budget_elements_index", { 'id': person.id } ) }}" class="sc-button bt-cancel">
+        <a href="{{ path("chill_budget_elements_index", { 'id': person.id } ) }}" class="btn btn-cancel">
            {{ 'Back to the list'|trans }}
         </a>
     </li>
     <li>
-        {{ form_widget(form.submit, { 'attr' : { 'class': 'sc-button bt-create' }, 'label': 'Create' } ) }}
+        {{ form_widget(form.submit, { 'attr' : { 'class': 'btn btn-create' }, 'label': 'Create' } ) }}
     </li>
 </ul>
        

src/Bundle/ChillBudgetBundle/Resources/views/Resource/view.html.twig

@@ -1,4 +1,4 @@
-{% extends "@ChillPerson/layout.html.twig" %}
+{% extends "@ChillPerson/Person/layout.html.twig" %}
 
 {% set activeRouteKey = '' %}
 {% set person = element.person %}
@@ -39,13 +39,13 @@
 
 <ul class="record_actions sticky-form-buttons">
     <li class="cancel">
-        <a href="{{ path("chill_budget_elements_index", { 'id': person.id } ) }}" class="sc-button bt-cancel">
+        <a href="{{ path("chill_budget_elements_index", { 'id': person.id } ) }}" class="btn btn-cancel">
            {{ 'Back to the list'|trans }}
         </a>
     </li>
     {% if is_granted(constant('Chill\\AMLI\\BudgetBundle\\Security\\Authorization\\BudgetElementVoter::UPDATE'), element) %}
         <li>
-            <a href="{{ path('chill_budget_resource_edit', { 'id': element.id } ) }}" class="sc-button bt-edit">{{ 'Edit'|trans }}</a>
+            <a href="{{ path('chill_budget_resource_edit', { 'id': element.id } ) }}" class="btn btn-edit">{{ 'Edit'|trans }}</a>
         </li>
     {% endif %}
 </ul>

src/Bundle/ChillCustomFieldsBundle/Resources/views/CustomField/edit.html.twig

@@ -36,12 +36,12 @@
         {{ form_row(option) }}
     {% endfor %}
     {% endif %}
-    {{ form_row(edit_form.submit, {'attr': { 'class': 'sc-button btn-update' } } ) }}
+    {{ form_row(edit_form.submit, {'attr': { 'class': 'btn btn-update' } } ) }}
     {{ form_end(edit_form) }}
 
         <ul class="record_actions">
     <li>
-        <a href="{{ path('customfieldsgroup_show', { 'id': entity.customFieldsGroup.id }) }}" class="sc-button btn-reset">
+        <a href="{{ path('customfieldsgroup_show', { 'id': entity.customFieldsGroup.id }) }}" class="btn btn-reset">
             {{ 'Back to the group'|trans }}
         </a>
     </li>

src/Bundle/ChillCustomFieldsBundle/Resources/views/CustomField/new.html.twig

@@ -37,17 +37,17 @@
         {{ form_row(option) }}
     {% endfor %}
     {% endif %}
-    {{ form_row(form.submit, {'attr': { 'class': 'sc-button btn-create' } } ) }}
+    {{ form_row(form.submit, {'attr': { 'class': 'btn btn-create' } } ) }}
     {{ form_end(form) }}
     
     <ul class="record_actions">
     <li>
         {% if entity.customFieldsGroup is not null %}
-        <a href="{{ path('customfieldsgroup_show', { 'id': entity.customFieldsGroup.id }) }}" class="sc-button btn-reset">
+        <a href="{{ path('customfieldsgroup_show', { 'id': entity.customFieldsGroup.id }) }}" class="btn btn-reset">
             {{ 'Back to the group'|trans }}
         </a>
         {% else %}
-        <a href="{{ path('customfieldsgroup') }}" class="sc-button btn-reset">
+        <a href="{{ path('customfieldsgroup') }}" class="btn btn-reset">
             {{ 'Back to the list'|trans }}
         </a>
         {% endif %}

src/Bundle/ChillCustomFieldsBundle/Resources/views/CustomFieldsGroup/edit.html.twig

@@ -27,17 +27,17 @@
     {% if edit_form.options is defined %}
     {{ form_row(edit_form.options) }}
     {% endif %}
-    {{ form_row(edit_form.submit, { 'attr': { 'class': 'sc-button bt-edit' } } ) }}
+    {{ form_row(edit_form.submit, { 'attr': { 'class': 'btn btn-edit' } } ) }}
     {{ form_end(edit_form) }}
 
         <ul class="record_actions">
     <li>
-        <a href="{{ path('customfieldsgroup') }}" class="sc-button bt-cancel">
+        <a href="{{ path('customfieldsgroup') }}" class="btn btn-cancel">
             {{ 'Back to the list'|trans }}
         </a>
     </li>
     <li>
-        <a href="{{ path('customfieldsgroup_show', { 'id' : entity.id }) }}" class="sc-button bt-cancel">
+        <a href="{{ path('customfieldsgroup_show', { 'id' : entity.id }) }}" class="btn btn-cancel">
             {{ 'show'|trans|capitalize }}
         </a>
     </li>

src/Bundle/ChillCustomFieldsBundle/Resources/views/CustomFieldsGroup/index.html.twig

@@ -40,17 +40,17 @@
                         <i class="fa fa-star"></i>
                     {%- else -%}
                         {{ form_start(make_default_forms[entity.id]) }}
-                        {{ form_widget(make_default_forms[entity.id].submit, { 'attr' : { 'class' : 'sc-button bt-action' } } ) }}
+                        {{ form_widget(make_default_forms[entity.id].submit, { 'attr' : { 'class' : 'btn btn-action' } } ) }}
                         {{ form_end(make_default_forms[entity.id]) }}
                     {%- endif -%}
                 </td>
                 <td>
                 <ul class="record_actions">
                     <li>
-                        <a href="{{ path('customfieldsgroup_show', { 'id': entity.id }) }}" class="sc-button">{{ 'show'|trans|capitalize }}</a>
+                        <a href="{{ path('customfieldsgroup_show', { 'id': entity.id }) }}" class="btn btn-show">{{ 'show'|trans|capitalize }}</a>
                     </li>
                     <li>
-                        <a href="{{ path('customfieldsgroup_edit', { 'id': entity.id }) }}" class="sc-button btn-edit">{{ 'edit'|trans|capitalize }}</a>
+                        <a href="{{ path('customfieldsgroup_edit', { 'id': entity.id }) }}" class="btn btn-edit">{{ 'edit'|trans|capitalize }}</a>
                     </li>
                 </ul>
                 </td>
@@ -60,7 +60,7 @@
     </table>
 
     <p>
-        <a href="{{ path('customfieldsgroup_new') }}" class="sc-button bt-create">
+        <a href="{{ path('customfieldsgroup_new') }}" class="btn btn-create">
             {{ 'Create a new group'|trans }}
         </a>
     </p>

src/Bundle/ChillCustomFieldsBundle/Resources/views/CustomFieldsGroup/new.html.twig

@@ -23,8 +23,8 @@
     {{ form_row(form.name) }}
     {{ form_row(form.entity) }}
     <p>
-        {{ form_widget(form.submit, { 'attr' : { 'class': 'sc-button bt-create' } } ) }}
-        <a href="{{ path('customfieldsgroup') }}" class="sc-button bt-cancel">
+        {{ form_widget(form.submit, { 'attr' : { 'class': 'btn btn-create' } } ) }}
+        <a href="{{ path('customfieldsgroup') }}" class="btn btn-cancel">
             {{ 'Back to the list'|trans }}
         </a>
     </p>

src/Bundle/ChillCustomFieldsBundle/Resources/views/CustomFieldsGroup/show.html.twig

@@ -52,12 +52,12 @@
 
     <ul class="record_actions">
         <li>
-            <a href="{{ path('customfieldsgroup') }}" class="sc-button bt-cancel">
+            <a href="{{ path('customfieldsgroup') }}" class="btn btn-cancel">
                 {{ 'Back to the list'|trans }}
             </a>
         </li>
         <li>
-            <a href="{{ path('customfieldsgroup_edit', { 'id': entity.id }) }}" class="sc-button bt-edit">
+            <a href="{{ path('customfieldsgroup_edit', { 'id': entity.id }) }}" class="btn btn-edit">
                 {{ 'Edit'|trans }}
             </a>
         </li>
@@ -90,27 +90,27 @@
                 {%- endif -%}
             </td>
             <td style="text-align:center">
-                <a href="{{ path('customfield_edit', { 'id' : field.id }) }}" class="sc-button bt-edit">{{ 'edit'|trans|capitalize }}</a>
+                <a href="{{ path('customfield_edit', { 'id' : field.id }) }}" class="btn btn-edit">{{ 'edit'|trans|capitalize }}</a>
             </td>
         </tr>
         {%- endfor -%}
         </tbody>
     </table>
         {{ form_start(create_field_form) }}
-            <div class="grid-4">
+            <div class="col-4">
             {{ form_widget(create_field_form.type) }}
             </div>
-            {{ form_widget(create_field_form.submit, { 'attr': { 'class': 'sc-button bt-create' }, 'label': 'Add a new field' } ) }}
+            {{ form_widget(create_field_form.submit, { 'attr': { 'class': 'btn btn-create' }, 'label': 'Add a new field' } ) }}
             {{ form_end(create_field_form) }}
     {%- else -%}
         <p>
             {{ 'Any field is currently associated with this group'|trans }}
         </p>
             {{ form_start(create_field_form) }}
-            <div class="grid-4">
+            <div class="col-4">
             {{ form_widget(create_field_form.type) }}
             </div>
-            {{ form_widget(create_field_form.submit, { 'attr': { 'class': 'sc-button bt-create' }, 'label': 'Create a new field' } ) }}
+            {{ form_widget(create_field_form.submit, { 'attr': { 'class': 'btn btn-create' }, 'label': 'Create a new field' } ) }}
             {{ form_end(create_field_form) }}
     {%- endif -%}
 {% endblock %}

src/Bundle/ChillCustomFieldsBundle/Resources/views/CustomFieldsRendering/text.html.twig

@@ -1 +1,7 @@
-{% if text is not empty %}{{ text|nl2br }}{% else %}<span class="custom_fields_text empty">{{ 'None'|trans }}</span>{% endif %}
+{% if text is not empty %}
+    {% apply markdown_to_html %}
+    {{ text|raw }}
+    {% endapply %}
+{% else %}
+    <span class="custom_fields_text empty">{{ 'None'|trans }}</span>
+{% endif %}

src/Bundle/ChillCustomFieldsBundle/Resources/views/Form/fields.html.twig

@@ -65,7 +65,7 @@
         }
 
         function initializeCFChoiceOptionsChoices(div_id) {
-            var add_element_link = $('<a id="' + div_id + '_add_element_link"" href="#" class="sc-button bt-submit">{{ 'Add an element'|trans }}</a>');
+            var add_element_link = $('<a id="' + div_id + '_add_element_link"" href="#" class="btn btn-submit">{{ 'Add an element'|trans }}</a>');
             var div = $('#' + div_id);
             div.append(add_element_link);
             div.data('index', div.find('td').length);

src/Bundle/ChillDocStoreBundle/Resources/public/module/async_upload/uploader.js

@@ -280,10 +280,10 @@ var insertRemoveButton = (zone, zoneData) => {
         labelCancel = 'Restaurer'
         ;
     
-    removeButton.classList.add('sc-button', 'bt-delete');
+    removeButton.classList.add('btn', 'btn-delete');
     removeButton.textContent = labelRemove;
     
-    cancelButton.classList.add('sc-button');
+    cancelButton.classList.add('btn', 'btn-cancel');
     cancelButton.textContent = labelCancel;
     
     removeButton.addEventListener('click', (e) => {
@@ -355,7 +355,7 @@ var insertDownloadButton = (zone, zoneData) => {
     newButton.dataset.labelPreparing = labelPreparing;
     newButton.dataset.labelReady = labelReady;
     newButton.dataset.tempUrlGetGenerator = tempUrlGenerator + '?' + tempUrlGeneratorParams.toString();
-    newButton.classList.add('sc-button', 'bt-download', 'dz-bt-below-dropzone');
+    newButton.classList.add('btn', 'btn-download', 'dz-bt-below-dropzone');
     newButton.textContent = labelQuietButton;
     
     addBelowButton(newButton, zone, zoneData);

src/Bundle/ChillDocStoreBundle/Resources/views/DocumentCategory/_delete_form.html.twig

@@ -17,5 +17,5 @@
 <form method="post" action="{{ path('document_category_delete', {'bundleId': document_category.bundleId, 'idInsideBundle': document_category.idInsideBundle}) }}">
     <input type="hidden" name="_method" value="DELETE">
     <input type="hidden" name="_token" value="{{ csrf_token('delete' ~ document_category.bundleId ~ document_category.idInsideBundle) }}">
-    <button class="sc-button bt-delete">{{ 'Delete' | trans }}</button>
+    <button class="btn btn-delete">{{ 'Delete' | trans }}</button>
 </form>

src/Bundle/ChillDocStoreBundle/Resources/views/DocumentCategory/_form.html.twig

@@ -16,5 +16,5 @@
 #}
 {{ form_start(form) }}
     {{ form_widget(form) }}
-    <button class="sc-button bt-edit">{{ button_label|default('Save') }}</button>
+    <button class="btn btn-edit">{{ button_label|default('Save') }}</button>
 {{ form_end(form) }}

src/Bundle/ChillDocStoreBundle/Resources/views/DocumentCategory/edit.html.twig

@@ -29,12 +29,12 @@
     {{ form_widget(form) }}
     <ul class="record_actions">
         <li class="cancel">
-            <a href="{{ path('document_category_index') }}" class="sc-button bt-cancel">
+            <a href="{{ path('document_category_index') }}" class="btn btn-cancel">
                 {{ 'Back to the category list' | trans }}
             </a>
         </li>
         <li>
-            <button class="sc-button bt-edit">{{ button_label|default('Edit')|trans }}</button>
+            <button class="btn btn-edit">{{ button_label|default('Edit')|trans }}</button>
         </li>
     </ul>
     {{ form_end(form) }}

src/Bundle/ChillDocStoreBundle/Resources/views/DocumentCategory/index.html.twig

@@ -41,9 +41,9 @@
 
                 <td>
                     <a href="{{ path('document_category_show', {'bundleId': document_category.bundleId, 'idInsideBundle': document_category.idInsideBundle}) }}"
-                       class="sc-button bt-show" title="{{ 'show' | trans }}"></a>
+                       class="btn btn-show" title="{{ 'show' | trans }}"></a>
                     <a href="{{ path('document_category_edit', {'bundleId': document_category.bundleId, 'idInsideBundle': document_category.idInsideBundle}) }}"
-                       class="sc-button bt-edit" title="{{ 'edit' | trans }}"></a>
+                       class="btn btn-edit" title="{{ 'edit' | trans }}"></a>
                 </td>
             </tr>
         {% else %}
@@ -56,7 +56,7 @@
 
     <ul class="record_actions">
         <li>
-            <a href="{{ path('document_category_new') }}" class="sc-button bt-create">{{ 'Create new category' | trans }}</a>
+            <a href="{{ path('document_category_new') }}" class="btn btn-create">{{ 'Create new category' | trans }}</a>
         </li>
     </ul>
 {% endblock %}

src/Bundle/ChillDocStoreBundle/Resources/views/DocumentCategory/new.html.twig

@@ -29,12 +29,12 @@
     {{ form_widget(form) }}
     <ul class="record_actions">
         <li class="cancel">
-            <a href="{{ path('document_category_index') }}" class="sc-button bt-cancel">
+            <a href="{{ path('document_category_index') }}" class="btn btn-cancel">
                 {{ 'Back to the category list' | trans }}
             </a>
         </li>
         <li>
-            <button class="sc-button bt-new">{{ button_label|default('New')|trans }}</button>
+            <button class="btn btn-new">{{ button_label|default('New')|trans }}</button>
         </li>
     </ul>
     {{ form_end(form) }}

src/Bundle/ChillDocStoreBundle/Resources/views/DocumentCategory/show.html.twig

@@ -45,11 +45,11 @@
     <ul class="record_actions">
         <li class="cancel">
             <a href="{{ path('document_category_index') }}"
-               class="sc-button bt-cancel">{{ 'Back to the category list' | trans }}</a>
+               class="btn btn-cancel">{{ 'Back to the category list' | trans }}</a>
         </li>
         <li>
             <a href="{{ path('document_category_edit', {'bundleId': document_category.bundleId, 'idInsideBundle': document_category.idInsideBundle}) }}"
-               class="sc-button bt-edit">{{ 'Edit' | trans }}</a>
+               class="btn btn-edit">{{ 'Edit' | trans }}</a>
         </li>
         <li>
             {{ include('ChillDocStoreBundle:DocumentCategory:_delete_form.html.twig') }}

src/Bundle/ChillDocStoreBundle/Resources/views/Macro/macro.html.twig

@@ -2,7 +2,7 @@
     {% if storedObject is null %}
         <!-- No document to download -->
     {% else %}
-        <a class="sc-button bt-download" 
+        <a class="btn btn-download" 
            data-label-preparing="{{ ('Preparing'|trans ~ '...')|escape('html_attr') }}" 
            data-label-ready="{{ 'Ready to show'|trans|escape('html_attr') }}" 
            data-download-button 

src/Bundle/ChillDocStoreBundle/Resources/views/PersonDocument/_delete_form.html.twig

@@ -1,5 +1,5 @@
 <form method="post" action="{{ path('person_document_delete', {'id': document.id, 'person': person.id}) }}" onsubmit="return confirm('Are you sure you want to delete this item?');">
     <input type="hidden" name="_method" value="DELETE">
     <input type="hidden" name="_token" value="{{ csrf_token('delete' ~ document.id) }}">
-    <button  class="sc-button bt-delete">{{ 'Delete' | trans }}</button>
+    <button  class="btn btn-delete">{{ 'Delete' | trans }}</button>
 </form>

src/Bundle/ChillDocStoreBundle/Resources/views/PersonDocument/edit.html.twig

@@ -15,7 +15,7 @@
  * along with this program.  If not, see <http://www.gnu.org/licenses/>.
 #}
 
-{% extends "@ChillPerson/layout.html.twig"  %}
+{% extends "@ChillPerson/Person/layout.html.twig"  %}
 
 {% set activeRouteKey = '' %}
 
@@ -36,12 +36,12 @@
 
     <ul class="record_actions">
         <li class="cancel">
-            <a href="{{ path('person_document_index', {'person': person.id}) }}" class="sc-button bt-cancel">
+            <a href="{{ path('person_document_index', {'person': person.id}) }}" class="btn btn-cancel">
                 {{ 'Back to the list' | trans }}
             </a>
         </li>
         <li class="edit">
-            <button class="sc-button bt-edit">{{ 'Edit'|trans }}</button>
+            <button class="btn btn-edit">{{ 'Edit'|trans }}</button>
         </li>
         {# {% if is_granted('CHILL_PERSON_DOCUMENT_DELETE', document) %}
             <li class="delete">

src/Bundle/ChillDocStoreBundle/Resources/views/PersonDocument/index.html.twig

@@ -15,7 +15,7 @@
  * along with this program.  If not, see <http://www.gnu.org/licenses/>.
 #}
 
-{% extends "@ChillPerson/layout.html.twig"  %}
+{% extends "@ChillPerson/Person/layout.html.twig"  %}
 
 {% set activeRouteKey = '' %}
 
@@ -52,12 +52,12 @@
                             {{ m.download_button(document.object, document.title) }}
                         </li>
                         <li>
-                            <a href="{{ path('person_document_show', {'person': person.id, 'id': document.id}) }}" class="sc-button bt-show"></a>
+                            <a href="{{ path('person_document_show', {'person': person.id, 'id': document.id}) }}" class="btn btn-show"></a>
                         </li>
                     {% endif %}
                     {% if is_granted('CHILL_PERSON_DOCUMENT_UPDATE', document) %}
                         <li>
-                            <a href="{{ path('person_document_edit', {'person': person.id, 'id': document.id}) }}" class="sc-button bt-update"></a>
+                            <a href="{{ path('person_document_edit', {'person': person.id, 'id': document.id}) }}" class="btn btn-update"></a>
                         </li>
                     {% endif %}
                     </ul>
@@ -74,7 +74,7 @@
     {% if is_granted('CHILL_PERSON_DOCUMENT_CREATE', person) %}
         <ul class="record_actions">
             <li class="create">
-                <a href="{{ path('person_document_new', {'person': person.id}) }}" class="sc-button bt-create">
+                <a href="{{ path('person_document_new', {'person': person.id}) }}" class="btn btn-create">
                     {{ 'Create new document' | trans }}
                 </a>
             </li>

src/Bundle/ChillDocStoreBundle/Resources/views/PersonDocument/new.html.twig

@@ -14,7 +14,7 @@
  * You should have received a copy of the GNU Affero General Public License
  * along with this program.  If not, see <http://www.gnu.org/licenses/>.
 #}
-{% extends "@ChillPerson/layout.html.twig"  %}
+{% extends "@ChillPerson/Person/layout.html.twig"  %}
 
 {% set activeRouteKey = '' %}
 
@@ -36,12 +36,12 @@
 
     <ul class="record_actions">
         <li class="cancel">
-            <a href="{{ path('person_document_index', {'person': person.id}) }}" class="sc-button bt-cancel">
+            <a href="{{ path('person_document_index', {'person': person.id}) }}" class="btn btn-cancel">
                 {{ 'Back to the list' | trans }}
             </a>
         </li>
         <li class="create">
-            <button  class="sc-button bt-create">{{ 'Create'|trans }}</button>
+            <button  class="btn btn-create">{{ 'Create'|trans }}</button>
         </li>
     </ul>
     {{ form_end(form) }}

src/Bundle/ChillDocStoreBundle/Resources/views/PersonDocument/show.html.twig

@@ -14,7 +14,7 @@
  * You should have received a copy of the GNU Affero General Public License
  * along with this program.  If not, see <http://www.gnu.org/licenses/>.
 #}
-{% extends "@ChillPerson/layout.html.twig"  %}
+{% extends "@ChillPerson/Person/layout.html.twig"  %}
 
 {% set activeRouteKey = '' %}
 
@@ -54,7 +54,7 @@
 
     <ul class="record_actions">
         <li class="cancel">
-            <a href="{{ path('person_document_index', {'person': person.id}) }}" class="sc-button bt-cancel">
+            <a href="{{ path('person_document_index', {'person': person.id}) }}" class="btn btn-cancel">
                 {{ 'Back to the list' | trans }}
             </a>
         </li>
@@ -65,7 +65,7 @@
 
         {% if is_granted('CHILL_PERSON_DOCUMENT_UPDATE', document) %}
             <li>
-                <a href="{{ path('person_document_edit', {'id': document.id, 'person': person.id}) }}" class="sc-button bt-edit">
+                <a href="{{ path('person_document_edit', {'id': document.id, 'person': person.id}) }}" class="btn btn-edit">
                     {{ 'Edit' | trans }}
                 </a>
             </li>

src/Bundle/ChillEventBundle/Resources/views/Event/edit.html.twig

@@ -20,12 +20,12 @@
             {% set returnPath = app.request.get('return_path') %}
             {% set returnLabel = app.request.get('return_label') %}
 
-            <a href="{{ returnPath |default( path('chill_event_list_most_recent') ) }}" class="sc-button bt-cancel">
+            <a href="{{ returnPath |default( path('chill_event_list_most_recent') ) }}" class="btn btn-cancel">
                 {{ returnLabel |default('Back to the most recent events'|trans) }}
             </a>
         </li>
         <li>
-            {{ form_widget(edit_form.submit, { 'attr' : { 'class' : 'sc-button bt-update' } }) }}
+            {{ form_widget(edit_form.submit, { 'attr' : { 'class' : 'btn btn-update' } }) }}
         </li>
     </ul>
             

src/Bundle/ChillEventBundle/Resources/views/Event/list.html.twig

@@ -25,12 +25,12 @@
                         <ul class="record_actions">
                             <li>
                                 {# {% if is_granted('CHILL_EVENT_SEE_DETAILS', event) %} #}
-                                <a href="{{ path('chill_event__event_show', { 'event_id' : event.id } ) }}" class="sc-button black">
+                                <a href="{{ path('chill_event__event_show', { 'event_id' : event.id } ) }}" class="btn btn-dark">
                                     {{ 'See'|trans }}
                                 </a>
                                 {# {% endif %} #}
                                 {% if is_granted('CHILL_EVENT_UPDATE', event) %}
-                                <a href="{{ path('chill_event__event_edit', { 'event_id' : event.id } ) }}" class="sc-button bt-update">
+                                <a href="{{ path('chill_event__event_edit', { 'event_id' : event.id } ) }}" class="btn btn-update">
                                     {{ 'Edit'|trans }}
                                 </a>
                                 {% endif %}
@@ -46,13 +46,13 @@
 
 <ul class="record_actions">
     <li>
-        <a href="{{ path('chill_event__event_new_pickcenter') }}" class="sc-button bt-create" >
+        <a href="{{ path('chill_event__event_new_pickcenter') }}" class="btn btn-create" >
             {{ 'New event'|trans }}
         </a>
     </li>                
     {% if preview == true and events|length < total %}
     <li>
-        <a href="{{ path('chill_main_search', { "name": search_name, "q" : pattern }) }}" class="sc-button btn-next">
+        <a href="{{ path('chill_main_search', { "name": search_name, "q" : pattern }) }}" class="btn btn-next">
             {{ 'See all results'|trans }}
         </a>
     </li>

src/Bundle/ChillEventBundle/Resources/views/Event/listByPerson.html.twig

@@ -14,7 +14,7 @@
  * You should have received a copy of the GNU Affero General Public License
  * along with this program.  If not, see <http://www.gnu.org/licenses/>.
 #}
-{% extends "@ChillPerson/layout.html.twig"  %}
+{% extends "@ChillPerson/Person/layout.html.twig"  %}
 
 {% set activeRouteKey = 'chill_event__list_by_person' %}
 {% set currentPerson =  person.firstName ~ ' ' ~ person.lastName %}
@@ -24,7 +24,7 @@
 {% block personcontent %}
 <h2>{{ 'Events participation' |trans }}</h2>
 
-<table class="events">
+<table class="table table-striped table-bordered mt-3 events">
     <thead>
         <tr>
             <th class="chill-green">{{ 'Date'|trans }}</th>
@@ -44,53 +44,58 @@
                 <td>{{ participation.role.name|localize_translatable_string }}</td>
                 <td>{{ participation.status.name|localize_translatable_string }}</td>
                 <td>
-                    <ul class="record_actions">
-                        <li>
+                    <ul class="list-inline">
 
-                            {% set currentPath = path(app.request.attributes.get('_route'), app.request.attributes.get('_route_params')) %}
-                            {% set returnLabel = 'Back to %person% events'|trans({ '%person%' : currentPerson } ) %}
+                        {% set currentPath = path(app.request.attributes.get('_route'), app.request.attributes.get('_route_params')) %}
+                        {% set returnLabel = 'Back to %person% events'|trans({ '%person%' : currentPerson } ) %}
 
-                            {% if is_granted('CHILL_EVENT_SEE_DETAILS', participation.event) %}
-                                <a  href="{{ path('chill_event__event_show', { 'event_id' : participation.event.id, 'return_path' : currentPath, 'return_label' : returnLabel } ) }}"
-                                    class="sc-button bt-show" title="{{ 'See details of the event'|trans }}"></a>
-                            {% endif %}
+                        {% if is_granted('CHILL_EVENT_SEE_DETAILS', participation.event) %}
+                        <li class="list-inline-item">
+                            <a  href="{{ path('chill_event__event_show', { 'event_id' : participation.event.id, 'return_path' : currentPath, 'return_label' : returnLabel } ) }}"
+                                class="btn btn-primary btn-sm" title="{{ 'See details of the event'|trans }}"><i class="fa fa-fw fa-eye"></i></a>
+                        </li>
+                        {% endif %}
 
-                            {% if  is_granted('CHILL_EVENT_UPDATE', participation.event)
-                               and is_granted('CHILL_EVENT_PARTICIPATION_UPDATE', participation) %}
+                        {% if  is_granted('CHILL_EVENT_UPDATE', participation.event)
+                           and is_granted('CHILL_EVENT_PARTICIPATION_UPDATE', participation) %}
 
-                                <div class="bt-dropdown">
-                                    <a href="" class="sc-button bt-update"></a>
-                                    <div class="bt-dropdown-content">
+                        <li class="list-inline-item">
+                            <div class="btn dropdown-toggle">
+                                <a href="" class="btn btn-warning btn-sm"><i class="fa fa-fw fa-pencil"></i></a>
+                                <div class="dropdown-menu">
 
-                                        <a  href="{{ path('chill_event__event_edit', { 'event_id' : participation.event.id, 'return_path' : currentPath, 'return_label' : returnLabel }) }}"
-                                            class="sc-button bt-update">
-                                            {{ 'Edit the event'|trans }}
-                                        </a>
-                                        <a  href="{{ path('chill_event_participation_edit', { 'participation_id' : participation.id, 'return_path' : currentPath, 'return_label' : returnLabel }) }}"
-                                            class="sc-button bt-update">
-                                            {{ 'Edit the participation'|trans }}
-                                        </a>
-
-                                    </div>
-                                </div>
-                            {% else %}
-
-                                {% if is_granted('CHILL_EVENT_UPDATE', participation.event) %}
                                     <a  href="{{ path('chill_event__event_edit', { 'event_id' : participation.event.id, 'return_path' : currentPath, 'return_label' : returnLabel }) }}"
-                                        class="sc-button bt-update">
+                                        class="btn btn-warning btn-sm">
                                         {{ 'Edit the event'|trans }}
                                     </a>
-                                {% endif %}
-                                {% if is_granted('CHILL_EVENT_PARTICIPATION_UPDATE', participation) %}
                                     <a  href="{{ path('chill_event_participation_edit', { 'participation_id' : participation.id, 'return_path' : currentPath, 'return_label' : returnLabel }) }}"
-                                        class="sc-button bt-update">
+                                        class="btn btn-warning btn-sm">
                                         {{ 'Edit the participation'|trans }}
                                     </a>
-                                {% endif %}
-
-                            {% endif %}
 
+                                </div>
+                            </div>
                         </li>
+                        {% else %}
+
+                        <li class="list-inline-item">
+                            {% if is_granted('CHILL_EVENT_UPDATE', participation.event) %}
+                                <a  href="{{ path('chill_event__event_edit', { 'event_id' : participation.event.id, 'return_path' : currentPath, 'return_label' : returnLabel }) }}"
+                                    class="btn btn-warning btn-sm">
+                                    {{ 'Edit the event'|trans }}
+                                </a>
+                            {% endif %}
+                            {% if is_granted('CHILL_EVENT_PARTICIPATION_UPDATE', participation) %}
+                                <a  href="{{ path('chill_event_participation_edit', { 'participation_id' : participation.id, 'return_path' : currentPath, 'return_label' : returnLabel }) }}"
+                                    class="btn btn-warning btn-sm">
+                                    {{ 'Edit the participation'|trans }}
+                                </a>
+                            {% endif %}
+                        </li>
+
+                        {% endif %}
+
+
                     </ul>
                 </td>
             </tr>
@@ -103,12 +108,33 @@
     {{ chill_pagination(paginator) }}
 {% endif %}
 
-<div style="margin-bottom: 1.5em; margin-top: 2.5em;">
-    {{ form_start(form_add_event_participation_by_person) }}
-    {{ form_widget(form_add_event_participation_by_person.event_id, { 'attr' : { 'style' : 'width: 25em; display:inline-block; ' } } ) }}
-    {{ form_widget(form_add_event_participation_by_person.submit, { 'attr' : { 'class' : 'sc-button bt-create' } } ) }}
-    {{ form_rest(form_add_event_participation_by_person) }}
-    {{ form_end(form_add_event_participation_by_person) }}
+{% form_theme form_add_event_participation_by_person 'bootstrap_4_layout.html.twig' %}
+
+<div class="input-group mb-3">
+{{ form_start(form_add_event_participation_by_person) }}
+    {#
+    <input type="text" class="form-control" placeholder="Recipient's username" aria-label="Recipient's username" aria-describedby="button-addon2">
+    #}
+    {{ form_widget(form_add_event_participation_by_person.event_id, { 'attr' : { 'class' : 'form-control' } } ) }}
+    <div class="input-group-append input-group-btn">
+        {#
+        <button class="btn btn-outline-secondary" type="button" id="button-addon2">Button</button>
+        #}
+        {{ form_widget(form_add_event_participation_by_person.submit, { 'attr' : { 'class' : 'btn btn-success' } } ) }}
+    </div>
+{{ form_rest(form_add_event_participation_by_person) }}
+{{ form_end(form_add_event_participation_by_person) }}
+</div>
+
+{#
+{{ form(form_add_event_participation_by_person) }}
+#}
+
+<div class="input-group mb-3">
+    <input class="form-control" placeholder="Recipient's username">
+    <div class="input-group-append">
+        <button class="btn btn-success">Button</button>
+    </div>
 </div>
 
 {% endblock %}

src/Bundle/ChillEventBundle/Resources/views/Event/new.html.twig

@@ -16,12 +16,12 @@
 
     <ul class="record_actions">
         <li class="cancel">
-            <a href="{{ path('chill_event_list_most_recent') }}" class="sc-button bt-cancel">
+            <a href="{{ path('chill_event_list_most_recent') }}" class="btn btn-cancel">
                 {{ 'Back to the most recent events'|trans }}
             </a>
         </li>
         <li>
-            {{ form_widget(form.submit, { 'attr' : { 'class' : 'sc-button bt-create' } }) }}
+            {{ form_widget(form.submit, { 'attr' : { 'class' : 'btn btn-create' } }) }}
         </li>
     </ul>
             

src/Bundle/ChillEventBundle/Resources/views/Event/newPickCenter.html.twig

@@ -12,12 +12,12 @@
 
     <ul class="record_actions">
         <li class="cancel">
-            <a href="{{ path('chill_event_list_most_recent') }}" class="sc-button bt-cancel">
+            <a href="{{ path('chill_event_list_most_recent') }}" class="btn btn-cancel">
                 {{ 'Back to the most recent events'|trans }}
             </a>
         </li>
         <li>
-            {{ form_widget(form.submit, { 'attr' : { 'class' : 'sc-button green' } }) }}
+            {{ form_widget(form.submit, { 'attr' : { 'class' : 'btn btn-chill-green' } }) }}
         </li>
     </ul>
             

src/Bundle/ChillEventBundle/Resources/views/Event/show.html.twig

@@ -40,26 +40,26 @@
 
         {% if returnPath and returnLabel %}
             <li class="cancel">
-                <a href="{{ returnPath }}" class="sc-button bt-cancel">{{ returnLabel }}</a>
+                <a href="{{ returnPath }}" class="btn btn-cancel">{{ returnLabel }}</a>
             </li>
             <li>
                 <a href="{{ path('chill_event__event_edit', {
                     'event_id': event.id,
                     'return_path': app.request.getRequestUri,
                     'return_label': 'Back to details of the event'|trans
-                    }) }}" class="sc-button bt-edit">{{ 'Edit'|trans }}
+                    }) }}" class="btn btn-edit">{{ 'Edit'|trans }}
                 </a>
             </li>
         {% else %}
             <li>
-                <a href="{{ path('chill_event__event_edit', {'event_id': event.id }) }}" class="sc-button bt-edit">
+                <a href="{{ path('chill_event__event_edit', {'event_id': event.id }) }}" class="btn btn-edit">
                     {{ 'Edit'|trans }}
                 </a>
             </li>
         {% endif %}
         <li>
             <a href="{{ path('chill_event__event_delete', {'event_id' : event.id } ) }}"
-               class="sc-button bt-delete">{{ 'Delete event'|trans }}</a>
+               class="btn btn-delete">{{ 'Delete event'|trans }}</a>
         </li>
 
     </ul>
@@ -94,11 +94,11 @@
                             {% if is_granted('CHILL_EVENT_PARTICIPATION_UPDATE', participation) %}
                             <li>
                                 <a href="{{ path('chill_event_participation_edit', { 'participation_id' : participation.id } ) }}"
-                                   class="sc-button bt-edit" title="{{ 'Edit'|trans }}"></a>
+                                   class="btn btn-edit" title="{{ 'Edit'|trans }}"></a>
                             </li>
                             <li>
                                 <a href="{{ path('chill_event_participation_delete', {'participation_id' : participation.id } ) }}"
-                                    class="sc-button bt-delete" title="{{ 'Delete'|trans }}"></a>
+                                    class="btn btn-delete" title="{{ 'Delete'|trans }}"></a>
                             </li>
                             {% endif %}
                         </ul>
@@ -113,12 +113,12 @@
         
     <ul class="record_actions">
         {% if count > 0 %}
-            <li><a href="{{ path('chill_event_participation_edit_multiple', { 'event_id' : event.id } ) }}" class="sc-button bt-edit">{{ 'Edit all the participations'|trans }}</a></li>
+            <li><a href="{{ path('chill_event_participation_edit_multiple', { 'event_id' : event.id } ) }}" class="btn btn-edit">{{ 'Edit all the participations'|trans }}</a></li>
         {% endif %}
     </ul>
 
     <div style="margin-bottom: 10em;">
-        <div class="grid-8">
+        <div class="col-8">
             {{ form_start(form_add_participation_by_person) }}
             <div class="input-group">
                 {{ form_widget(form_add_participation_by_person.person_id, { 'attr' : {
@@ -126,19 +126,19 @@
                     'style': 'min-width: 15em; max-width: 18em; display: inline-block;'
                 }} ) }}
                 <div class="input-group-append">
-                    {{ form_widget(form_add_participation_by_person.submit, { 'attr' : { 'class' : 'sc-button bt-create' } } ) }}
+                    {{ form_widget(form_add_participation_by_person.submit, { 'attr' : { 'class' : 'btn btn-create' } } ) }}
                 </div>
             </div>
             {{ form_rest(form_add_participation_by_person) }}
             {{ form_end(form_add_participation_by_person) }}
         </div>
 
-        <div class="grid-4">
+        <div class="col-4">
             {{ form_start(form_export, {'attr': {'id': 'export_tableur'}}) }}
             <div class="input-group">
                 {{ form_widget(form_export.format, { 'attr' : { 'class': 'custom-select' } }) }}
                 <div class="input-group-append">
-                    {{ form_widget(form_export.submit, { 'attr' : { 'class': 'sc-button bt-save' } }) }}
+                    {{ form_widget(form_export.submit, { 'attr' : { 'class': 'btn btn-save' } }) }}
                 </div>
                 <a class="bt-"></a>
             </div>

src/Bundle/ChillEventBundle/Resources/views/EventType/edit.html.twig

@@ -10,10 +10,10 @@
 
     <ul class="record_actions">
         <li class="cancel">
-            <a href="{{ path('chill_eventtype_admin') }}" class="sc-button bt-cancel">{{ 'Back to the list'|trans }}</a>
+            <a href="{{ path('chill_eventtype_admin') }}" class="btn btn-cancel">{{ 'Back to the list'|trans }}</a>
         </li>
         <li>
-            {{ form_row(edit_form.submit, { 'attr': { 'class' : 'sc-button bt-edit' }}) }}
+            {{ form_row(edit_form.submit, { 'attr': { 'class' : 'btn btn-edit' }}) }}
         </li>
     </ul>
 

src/Bundle/ChillEventBundle/Resources/views/EventType/index.html.twig

@@ -22,10 +22,10 @@
                 <td>
                 <ul class="record_actions">
                     <li>
-                        <a href="{{ path('chill_eventtype_admin_show', { 'id': entity.id }) }}" class="sc-button bt-show" title="{{ 'show'|trans }}"></a>
+                        <a href="{{ path('chill_eventtype_admin_show', { 'id': entity.id }) }}" class="btn btn-show" title="{{ 'show'|trans }}"></a>
                     </li>
                     <li>
-                        <a href="{{ path('chill_eventtype_admin_edit', { 'id': entity.id }) }}" class="sc-button bt-edit" title="{{ 'edit'|trans }}"></a>
+                        <a href="{{ path('chill_eventtype_admin_edit', { 'id': entity.id }) }}" class="btn btn-edit" title="{{ 'edit'|trans }}"></a>
                     </li>
                 </ul>
                 </td>
@@ -36,7 +36,7 @@
 
     <ul class="record_actions">
         <li>
-            <a href="{{ path('chill_eventtype_admin_new') }}" class="sc-button bt-new">{{ 'Create a new type'|trans }}</a>
+            <a href="{{ path('chill_eventtype_admin_new') }}" class="btn btn-new">{{ 'Create a new type'|trans }}</a>
         </li>
     </ul>
 {% endblock %}

src/Bundle/ChillEventBundle/Resources/views/EventType/new.html.twig

@@ -10,10 +10,10 @@
 
     <ul class="record_actions">
         <li class="cancel">
-            <a href="{{ path('chill_eventtype_admin') }}" class="sc-button bt-cancel">{{ 'Back to the list'|trans }}</a>
+            <a href="{{ path('chill_eventtype_admin') }}" class="btn btn-cancel">{{ 'Back to the list'|trans }}</a>
         </li>
         <li>
-            {{ form_row(form.submit, { 'attr': { 'class' : 'sc-button bt-new' }}) }}
+            {{ form_row(form.submit, { 'attr': { 'class' : 'btn btn-new' }}) }}
         </li>
     </ul>
 

src/Bundle/ChillEventBundle/Resources/views/EventType/show.html.twig

@@ -23,14 +23,14 @@
 
     <ul class="record_actions">
         <li class="cancel">
-            <a href="{{ path('chill_eventtype_admin') }}" class="sc-button bt-cancel">{{ 'Back to the list'|trans }}</a>
+            <a href="{{ path('chill_eventtype_admin') }}" class="btn btn-cancel">{{ 'Back to the list'|trans }}</a>
         </li>
         <li>
-            <a href="{{ path('chill_eventtype_admin_edit', { 'id': entity.id }) }}" class="sc-button bt-edit">{{ 'Edit'|trans }}</a>
+            <a href="{{ path('chill_eventtype_admin_edit', { 'id': entity.id }) }}" class="btn btn-edit">{{ 'Edit'|trans }}</a>
         </li>
         <li>
             {{ form_start(delete_form) }}
-            {{ form_row(delete_form.submit, { 'attr': { 'class' : 'sc-button bt-delete' }}) }}
+            {{ form_row(delete_form.submit, { 'attr': { 'class' : 'btn btn-delete' }}) }}
             {{ form_end(delete_form) }}
         </li>
     </ul>

src/Bundle/ChillEventBundle/Resources/views/Participation/edit-multiple.html.twig

@@ -49,12 +49,12 @@
             
     <ul class="record_actions">
         <li>
-            <a href="{{ path('chill_event__event_show', { 'event_id' : event.id } ) }}" class="sc-button bt-cancel">
+            <a href="{{ path('chill_event__event_show', { 'event_id' : event.id } ) }}" class="btn btn-cancel">
                 {{ 'Back to the event'|trans }}
             </a>
         </li>
         <li>
-            {{ form_widget(form.submit, { 'attr' : { 'class' : 'sc-button bt-edit' } } ) }}
+            {{ form_widget(form.submit, { 'attr' : { 'class' : 'btn btn-edit' } } ) }}
         </li>
     </ul>
     

src/Bundle/ChillEventBundle/Resources/views/Participation/edit.html.twig

@@ -32,12 +32,12 @@
             {% set returnPath = app.request.get('return_path') %}
             {% set returnLabel = app.request.get('return_label') %}
 
-            <a href="{{ returnPath |default( path('chill_event__event_show', { 'event_id' : participation.event.id } )) }}" class="sc-button bt-cancel">
+            <a href="{{ returnPath |default( path('chill_event__event_show', { 'event_id' : participation.event.id } )) }}" class="btn btn-cancel">
                 {{ returnLabel |default('Back to the event'|trans) }}
             </a>
         </li>
         <li>
-            {{ form_widget(form.submit, { 'attr' : { 'class' : 'sc-button bt-edit' } } ) }}
+            {{ form_widget(form.submit, { 'attr' : { 'class' : 'btn btn-edit' } } ) }}
         </li>
     </ul>
     

src/Bundle/ChillEventBundle/Resources/views/Participation/new-multiple.html.twig

@@ -52,14 +52,13 @@
     </table>
         
     <ul class="record_actions">
-        <li>
-            <a href="{{ path('chill_event__event_show', { 'event_id' : participations[0].event.id } ) }}" class="sc-button btn-cancel">
-                <i class="fa fa-arrow-left"></i>
+        <li class="cancel">
+            <a href="{{ path('chill_event__event_show', { 'event_id' : participations[0].event.id } ) }}" class="btn btn-cancel">
                 {{ 'Back to the event'|trans }}
             </a>
         </li>
         <li>
-            {{ form_widget(form.submit, { 'attr' : { 'class' : 'sc-button bt-create' } } ) }}
+            {{ form_widget(form.submit, { 'attr' : { 'class' : 'btn btn-create' } } ) }}
         </li>
     </ul>
     

src/Bundle/ChillEventBundle/Resources/views/Participation/new.html.twig

@@ -33,13 +33,12 @@
 
     <ul class="record_actions">
         <li class="cancel">
-            <a href="{{ path('chill_event__event_show', { 'event_id' : participation.event.id } ) }}" class="sc-button btn-cancel">
-                <i class="fa fa-arrow-left"></i>
+            <a href="{{ path('chill_event__event_show', { 'event_id' : participation.event.id } ) }}" class="btn btn-cancel">
                 {{ 'Back to the event'|trans }}
             </a>
         </li>
         <li>
-            {{ form_widget(form.submit, { 'attr' : { 'class' : 'sc-button bt-create' } } ) }}
+            {{ form_widget(form.submit, { 'attr' : { 'class' : 'btn btn-create' } } ) }}
         </li>
     </ul>
     

src/Bundle/ChillEventBundle/Resources/views/Role/edit.html.twig

@@ -10,10 +10,10 @@
 
     <ul class="record_actions">
         <li class="cancel">
-            <a href="{{ path('chill_event_admin_role') }}" class="sc-button bt-cancel">{{ 'Back to the list'|trans }}</a>
+            <a href="{{ path('chill_event_admin_role') }}" class="btn btn-cancel">{{ 'Back to the list'|trans }}</a>
         </li>
         <li>
-            {{ form_row(edit_form.submit, { 'attr': { 'class' : 'sc-button bt-edit' }}) }}
+            {{ form_row(edit_form.submit, { 'attr': { 'class' : 'btn btn-edit' }}) }}
         </li>
     </ul>
 

src/Bundle/ChillEventBundle/Resources/views/Role/index.html.twig

@@ -24,10 +24,10 @@
                 <td>
                     <ul class="record_actions">
                         <li>
-                            <a href="{{ path('chill_event_admin_role_show', { 'id': entity.id }) }}" class="sc-button bt-show" title="{{ 'show'|trans }}"></a>
+                            <a href="{{ path('chill_event_admin_role_show', { 'id': entity.id }) }}" class="btn btn-show" title="{{ 'show'|trans }}"></a>
                         </li>
                         <li>
-                            <a href="{{ path('chill_event_admin_role_edit', { 'id': entity.id }) }}" class="sc-button bt-edit" title="{{ 'edit'|trans }}"></a>
+                            <a href="{{ path('chill_event_admin_role_edit', { 'id': entity.id }) }}" class="btn btn-edit" title="{{ 'edit'|trans }}"></a>
                         </li>
                     </ul>
                 </td>
@@ -38,7 +38,7 @@
 
     <ul class="record_actions">
         <li>
-            <a href="{{ path('chill_event_admin_role_new') }}" class="sc-button bt-new">{{ 'Create a new role'|trans }}</a>
+            <a href="{{ path('chill_event_admin_role_new') }}" class="btn btn-new">{{ 'Create a new role'|trans }}</a>
         </li>
     </ul>
     {% endblock %}

src/Bundle/ChillEventBundle/Resources/views/Role/new.html.twig

@@ -11,10 +11,10 @@
 
     <ul class="record_actions">
         <li class="cancel">
-            <a href="{{ path('chill_event_admin_role') }}" class="sc-button bt-cancel">{{ 'Back to the list'|trans }}</a>
+            <a href="{{ path('chill_event_admin_role') }}" class="btn btn-cancel">{{ 'Back to the list'|trans }}</a>
         </li>
         <li>
-            {{ form_row(form.submit, { 'attr': { 'class' : 'sc-button bt-new' }}) }}
+            {{ form_row(form.submit, { 'attr': { 'class' : 'btn btn-new' }}) }}
         </li>
     </ul>
 

src/Bundle/ChillEventBundle/Resources/views/Role/show.html.twig

@@ -27,14 +27,14 @@
 
     <ul class="record_actions">
         <li class="cancel">
-            <a href="{{ path('chill_event_admin_role') }}" class="sc-button bt-cancel">{{ 'Back to the list'|trans }}</a>
+            <a href="{{ path('chill_event_admin_role') }}" class="btn btn-cancel">{{ 'Back to the list'|trans }}</a>
         </li>
         <li>
-            <a href="{{ path('chill_event_admin_role_edit', { 'id': entity.id }) }}" class="sc-button bt-edit">{{ 'Edit'|trans }}</a>
+            <a href="{{ path('chill_event_admin_role_edit', { 'id': entity.id }) }}" class="btn btn-edit">{{ 'Edit'|trans }}</a>
         </li>
         <li>
             {{ form_start(delete_form) }}
-            {{ form_row(delete_form.submit, { 'attr': { 'class' : 'sc-button bt-delete' }}) }}
+            {{ form_row(delete_form.submit, { 'attr': { 'class' : 'btn btn-delete' }}) }}
             {{ form_end(delete_form) }}
         </li>
     </ul>