Enfin du style en utilisant Material Angular

This commit is contained in:
Sébastien André
2020-04-01 19:55:11 +02:00
parent c4e9ac5c52
commit 5c961f8f3d
12 changed files with 89 additions and 145 deletions

View File

@@ -1,26 +1 @@
/* label {
display: inline-block;
width: 150px;
}
input[type="text"] {
width: 200px;
}
input[type="email"] {
width: 200px;
}
textarea {
width: 200px;
} */
mat-form-field.mat-form-field {
font-size: 16px;
}
mat-label {
color: #424242;
}

View File

@@ -1,31 +1,34 @@
<form [formGroup]="addForm" (ngSubmit)="onSubmit(addForm.value)">
<mat-form-field>
<mat-label>Dropzone name</mat-label>
<input matInput formControlName="dzName">
</mat-form-field>
<br>
<mat-form-field>
<mat-label>GPS</mat-label>
<input matInput formControlName="gps">
</mat-form-field>
<br>
<mat-form-field>
<mat-label>Address</mat-label>
<textarea matInput formControlName="address" placeholder="Address of the DZ"></textarea>
</mat-form-field>
<br>
<mat-form-field>
<mat-label>Mail of contact</mat-label>
<input matInput formControlName="contactMail">
</mat-form-field>
<br>
<mat-form-field>
<p>
<mat-form-field>
<mat-label>Dropzone name</mat-label>
<input matInput type="text" formControlName="dzName" />
</mat-form-field>
</p>
<p>
<mat-form-field>
<mat-label>GPS</mat-label>
<input matInput type="text" formControlName="gps" />
</mat-form-field>
</p>
<p>
<mat-form-field>
<mat-label>Address of the DZ</mat-label>
<textarea matInput formControlName="address"></textarea>
</mat-form-field>
</p>
<p>
<mat-form-field>
<mat-label>Mail of contact</mat-label>
<input matInput type="text" formControlName="contactMail" />
</mat-form-field>
</p>
<p>
<mat-checkbox formControlName="isDz">Is a dropzone</mat-checkbox>
</mat-form-field>
<br>
<mat-form-field>
</p>
<p>
<mat-checkbox formControlName="isTunnel">Is a tunnel</mat-checkbox>
</mat-form-field>
<br>
</p>
<button type="submit" mat-raised-button color="accent">Add</button>
</form>