modal addPerson design, search field: focus and position fixed

src/Bundle/ChillMainBundle/Resources/public/modules/bootstrap/bootstrap.scss

@@ -28,7 +28,7 @@
 // @import "bootstrap/scss/card";
 // @import "bootstrap/scss/breadcrumb";
 // @import "bootstrap/scss/pagination";
-// @import "bootstrap/scss/badge";
+@import "bootstrap/scss/badge";
 // @import "bootstrap/scss/jumbotron";
 // @import "bootstrap/scss/alert";
 // @import "bootstrap/scss/progress";

src/Bundle/ChillMainBundle/Resources/public/scss/chillmain.scss

@@ -66,7 +66,7 @@ div.vue-component {
    left: 0;
    width: 100%;
    height: 100%;
-   background-color: rgba(0, 0, 0, 0.6);
+   background-color: rgba(0, 0, 0, 0.75);
    display: table;
    transition: opacity 0.3s ease;
 }
@@ -95,12 +95,29 @@ div.vue-component {
 }
 
 //// AddPersons modal
-ul.results {
-   list-style-type: none;
-   padding-left: 1em;
-   &.suggestions {
-      li {
-         line-height: 26pt;
+div.results {
+   padding: 0 1.3em;
+   div.list-item {
+      line-height: 26pt;
+      display: flex;
+      flex-direction: row;
+      div.right_actions {
+         margin: 0 0 0 auto;
+         & > * {
+            margin-left: 0.5em;
+         }
+         a.sc-button {
+            border: 1px solid lightgrey;
+            font-size: 70%;
+            padding: 4px;
+         }
+         span {
+         } 
       }
    }
 }
+
+a.discret {
+   color: grey;
+   margin-right: 1em;
+}

src/Bundle/ChillMainBundle/Resources/public/vuejs/_js/i18n.js

@@ -28,13 +28,14 @@ const messages = {
          remove: "Enlever",
          delete: "Supprimer",
          save: "Enregistrer",
+         add: "Ajouter",
          show_modal: "Ouvrir une modale",
          ok: "OK",
          cancel: "Annuler",
          close: "Fermer",
          next: "Suivant",
          previous: "Précédent",
-         back: "Retour"
+         back: "Retour",
       },
    }
 };