ajout couleur
This commit is contained in:
parent
98374d8a47
commit
a881b6cee6
7 changed files with 98 additions and 36 deletions
|
|
@ -1,31 +1,42 @@
|
|||
<app-header></app-header>
|
||||
<app-side-bar></app-side-bar>
|
||||
<div class="row">
|
||||
<div class="col-md-auto">
|
||||
<app-side-bar></app-side-bar>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<button class="w-100 btn btn-lg btn-secondary "
|
||||
type="submit">Tous les contacts
|
||||
</button>
|
||||
<div class=" col compte text-center">
|
||||
<div>
|
||||
<button class="w-100 btn btn-lg btn-secondary " type="submit">Tous les contacts
|
||||
</button>
|
||||
|
||||
<button routerLink="/ajouter-contact" class="w-100 btn btn-lg btn-rounded btn-secondary">
|
||||
Ajouter un contact
|
||||
</button>
|
||||
<button routerLink="/ajouter-contact" class="w-100 btn btn-lg btn-rounded btn-secondary">
|
||||
Ajouter un contact
|
||||
</button>
|
||||
|
||||
<div class="input-group mb-3">
|
||||
<input type="text" class="form-control"
|
||||
placeholder="Rechercher un contact"
|
||||
aria-label="Rechercher un contact"
|
||||
aria-describedby="basic-addon2"
|
||||
#word
|
||||
(keyup)="onSearchChange(word.value)">
|
||||
<div class="input-group mb-3 d-flex justify-content-center">
|
||||
<input type="text" class="form-control" placeholder="Rechercher un contact"
|
||||
aria-label="Rechercher un contact" aria-describedby="basic-addon2" #word
|
||||
(keyup)="onSearchChange(word.value)">
|
||||
|
||||
<div class="input-group-append"></div>
|
||||
</div>
|
||||
<div>
|
||||
<h4>Liste des Contacts</h4>
|
||||
</div>
|
||||
|
||||
<div class="row justify-content-evenly">
|
||||
<div class="col-4">
|
||||
<div *ngFor="let personne of listContact" (click)="onClick(personne)">
|
||||
<img style="max-height: 12% ; max-width: 12%" src="../../../assets/images/contact-1.png" />
|
||||
<p class="fiche-contact">{{ personne.prenom }} {{ personne.nom }}</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="input-group-append">
|
||||
<div class="col-4" *ngIf="openDetails">
|
||||
<app-fiche-contact [personne]="openDetails" (clickDelete)="onClickDelete($event)"></app-fiche-contact>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div *ngFor="let personne of listContact" (click)="onClick(personne)" >
|
||||
<img style="max-height: 12% ; max-width: 12%" src="../../../assets/images/contact-1.png"/>
|
||||
<p class="fiche-contact" >{{ personne.prenom }} {{ personne.nom }}</p>
|
||||
</div>
|
||||
<div *ngIf="openDetails"><app-fiche-contact [personne]="openDetails" (clickDelete)="onClickDelete($event)"></app-fiche-contact></div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -7,9 +7,16 @@
|
|||
margin: auto;
|
||||
}
|
||||
|
||||
.input-group mb-3 {
|
||||
width: 100%;
|
||||
.input-group.mb-3 {
|
||||
width: 50%;
|
||||
max-width: 330px;
|
||||
padding: 15px;
|
||||
margin: auto;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
;h4 {
|
||||
color: black;
|
||||
font-weight: bold;
|
||||
}
|
||||
Loading…
Add table
Add a link
Reference in a new issue