adapt AddAddress modal to bootstrap: position, responsive, form

This commit is contained in:
2021-07-14 13:36:49 +02:00
parent 50f3ec9064
commit 80eb5519bc
13 changed files with 217 additions and 206 deletions

View File

@@ -1,6 +1,5 @@
<template>
<div class='person__address__create'>
<div class='person-address__create'>
<div>
<h2 v-if="!edit">{{ $t('create_a_new_address') }}</h2>
<h2 v-else>{{ $t('edit_a_new_address') }}</h2>
@@ -8,7 +7,6 @@
@addNewAddress="addNewAddress">
</add-address>
</div>
<div>
<show-address
v-if="address"
@@ -16,13 +14,18 @@
</show-address>
</div>
</div>
<div v-if="!edit" class='person__address__valid'>
<div v-if="!edit" class='person-address__valid'>
<h2>{{ $t('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>
@@ -34,19 +37,16 @@
</div>
</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>
<li v-if="!edit">
<button type="submit" class="btn btn-update centered" @click="addToPerson">
{{ $t('add_an_address_to_person') }}
</button>
</li>
</ul>
</div>
<ul class="record_actions sticky-form-buttons">
<li class="cancel">
<a :href="backUrl" class="btn btn-cancel">{{ $t('back_to_the_list') }}</a>
</li>
<li v-if="!edit">
<button type="submit" class="btn btn-update" @click="addToPerson">
{{ $t('add_an_address_to_person') }}
</button>
</li>
</ul>
</template>
<script>