adapt AddAddress modal to bootstrap: position, responsive, form

src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourseWorkCreate/App.vue

@@ -62,7 +62,7 @@
 
       <div>
         <ul class="record_actions">
-          <li class="btn btn-cancel">
+          <li class="cancel">
             <a href="#" class="btn btn-cancel">
               {{ $t('action.cancel') }}
             </a>

src/Bundle/ChillPersonBundle/Resources/public/vuejs/HouseholdAddress/App.vue

@@ -16,11 +16,15 @@
       </div>
       <div class='household__address-move__valid'>
          <h2>{{ $t('move_date') }}</h2>
-         <input
-            type="date"
-            name="validFrom"
-            :placeholder="$t('validFrom')"
-            v-model="validFrom"/>
+         
+         <div class="input-group mb-3">
+            <span class="input-group-text" id="validFrom"><i class="fa fa-fw fa-calendar"></i></span>
+            <input type="date" class="form-control form-control-lg" name="validFrom"
+               v-bind:placeholder="$t('validFrom')"
+               v-model="validFrom"
+               aria-describedby="validFrom" />
+         </div>
+         
          <div v-if="errors.length > 0">
             {{ errors }}
          </div>
@@ -33,11 +37,11 @@
       </div>
       <div>
          <ul class="record_actions sticky-form-buttons">
-            <li class="btn btn-cancel">
-               <a :href=backUrl class="btn btn-cancel">{{ $t('back_to_the_list') }}</a>
+            <li class="cancel">
+               <a :href="backUrl" class="btn btn-cancel">{{ $t('back_to_the_list') }}</a>
             </li>
             <li>
-               <button type="submit" class="btn btn-update centered" @click="addToHousehold">
+               <button type="submit" class="btn btn-update" @click="addToHousehold">
                   {{ $t('add_an_address_to_household') }}
                </button>
             </li>
@@ -129,4 +133,3 @@ export default {
 };
 
 </script>
-

src/Bundle/ChillPersonBundle/Resources/views/Address/list.html.twig

@@ -110,8 +110,8 @@
     <ul class="record_actions sticky-form-buttons">
         <li class="cancel">
             <a href="{{ path('chill_person_view', { 'person_id' : person.id } ) }}" class="btn btn-cancel">
-                    {{ 'Back to the person details'|trans }}
-                </a>
+                {{ 'Back to the person details'|trans }}
+            </a>
         </li>
         <li>
             <a class="btn btn-create"

src/Bundle/ChillPersonBundle/Resources/views/Address/new.html.twig

@@ -14,13 +14,17 @@
  * 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/Person/layout.html.twig"  %}
+{% extends "@ChillPerson/Person/layout.html.twig" %}
 
 {% set activeRouteKey = '' %}
 
 {% block title %}{{ 'New address for %name%'|trans({ '%name%': person.firstName|capitalize ~ ' ' ~ person.lastName } )|capitalize }}{% endblock %}
 
 {% block personcontent %}
+<div class="address-new">
+    <div class="row justify-content-center">
+        <div class="col-md-10">
+            
 
     {% block content %}
         <h1>{{ block('title') }}</h1>
@@ -40,6 +44,8 @@
         {{ encore_entry_script_tags('vue_address') }}
     {% endblock %}
 
-
-
+    
+        </div>    
+    </div>
+</div>
 {% endblock personcontent %}