93 lines
3.2 KiB
Vue
93 lines
3.2 KiB
Vue
<template>
|
|
<div class="container-add-client">
|
|
<div class="container-form-add-client">
|
|
<form action="" method="">
|
|
<div class="container-form-input">
|
|
<div class="left-form-client">
|
|
<div class="container-form-add-client-entry">
|
|
<Entry height="3" width="15" type="text" placeholder="Nom du client" required="true"></Entry>
|
|
</div>
|
|
<div class="container-form-add-client-entry">
|
|
<Entry height="3" width="15" type="email" placeholder="Adresse mail" required="true"></Entry>
|
|
</div>
|
|
<div class="container-form-add-client-entry">
|
|
<Entry height="3" width="15" type="text" placeholder="Téléphone" required="true"></Entry>
|
|
</div>
|
|
<div class="container-form-add-client-entry">
|
|
<Checkbox text="Client VIP" id="vip"></Checkbox>
|
|
</div>
|
|
</div>
|
|
<div class="sperator-form-add-client">
|
|
|
|
</div>
|
|
<div class="right-form-client">
|
|
<div class="container-form-add-client-entry">
|
|
<Entry height="3" width="15" type="text" placeholder="Adresse" required="true"></Entry>
|
|
</div>
|
|
<div class="container-form-add-client-entry">
|
|
<Entry height="3" width="15" type="text" placeholder="Ville" required="true"></Entry>
|
|
</div>
|
|
<div class="container-form-add-client-entry">
|
|
<Entry height="3" width="15" type="text" placeholder="Code postal" required="true"></Entry>
|
|
</div>
|
|
<div class="container-form-add-client-entry">
|
|
<Checkbox text="Prospect" id="prospect"></Checkbox>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<ButtonCustom class="btn" text="AJOUTER"/>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import Entry from '@/components/Entry.vue';
|
|
import ButtonCustom from '@/components/ButtonCustom.vue';
|
|
import Checkbox from '@/components/checkbox.vue';
|
|
|
|
|
|
</script>
|
|
|
|
<style>
|
|
.sperator-form-add-client{
|
|
border-right: 2px solid #2D4570;
|
|
}
|
|
.container-add-client {
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
height: 100%;
|
|
width: 100%;
|
|
}
|
|
.container-form-add-client {
|
|
height: 80%;
|
|
width: 60%;
|
|
z-index: 0;
|
|
background-color: #FFFFFF;
|
|
border: 2px solid #FFFFFF;
|
|
border-radius: 10px;
|
|
-webkit-box-shadow: -3px 10px 11px -4px rgba(0,0,0,0.42);
|
|
box-shadow: -3px 10px 11px -4px rgba(0,0,0,0.42);
|
|
}
|
|
.container-form-input {
|
|
display: flex;
|
|
justify-content: space-around;
|
|
margin-top: 5vh;
|
|
}
|
|
.container-form-add-client-entry{
|
|
margin-bottom: 5vh;
|
|
}
|
|
form {
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: stretch;
|
|
height: 100%;
|
|
width: 100%;
|
|
}
|
|
form > .btn {
|
|
display: flex;
|
|
justify-content: center;
|
|
margin-top: 10vh;
|
|
}
|
|
</style> |