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,17 +1 @@
/* label {
display: inline-block;
width: 150px;
}
input[type="text"] {
width: 200px;
} */
mat-form-field.mat-form-field {
font-size: 16px;
}
mat-label {
color: #424242;
}

View File

@@ -1,31 +1,45 @@
<form [formGroup]="addForm" (ngSubmit)="onSubmit(addForm.value)">
<p class="form-group">
<label for="name">Name of gear</label>
<input id="name" type="text" formControlName="name" class="form-control">
<p>
<mat-form-field>
<mat-label>Name of gear</mat-label>
<input matInput type="text" formControlName="name">
</mat-form-field>
</p>
<p class="form-group">
<label for="manufacturer">Manufacturer</label>
<input id="manufacturer" type="text" formControlName="manufacturer" class="form-control">
<p>
<mat-form-field>
<mat-label>Manufacturer</mat-label>
<input matInput type="text" formControlName="manufacturer">
</mat-form-field>
</p>
<p class="form-group">
<label for="minSize">Min size of canopy</label>
<input id="minSize" type="text" formControlName="minSize" class="form-control">
<p>
<mat-form-field>
<mat-label>Min size of canopy</mat-label>
<input matInput type="text" formControlName="minSize">
</mat-form-field>
</p>
<p class="form-group">
<label for="maxSize">Max size of canopy</label>
<input id="maxSize" type="text" formControlName="maxSize" class="form-control">
<p>
<mat-form-field>
<mat-label>Max size of canopy</mat-label>
<input matInput type="text" formControlName="maxSize">
</mat-form-field>
</p>
<p class="form-group">
<label for="aad">AAD system</label>
<input id="aad" type="text" formControlName="aad" class="form-control">
<p>
<mat-form-field>
<mat-label>AAD system</mat-label>
<input matInput type="text" formControlName="aad">
</mat-form-field>
</p>
<p class="form-group">
<label for="mainCanopy">Main Canopy</label>
<input id="mainCanopy" type="text" formControlName="mainCanopy" class="form-control">
<p>
<mat-form-field>
<mat-label>Main Canopy</mat-label>
<input matInput type="text" formControlName="mainCanopy">
</mat-form-field>
</p>
<p class="form-group">
<label for="reserveCanopy">Reserve canopy</label>
<input id="reserveCanopy" type="text" formControlName="reserveCanopy" class="form-control">
<p>
<mat-form-field>
<mat-label>Reserve canopy</mat-label>
<input matInput type="text" formControlName="reserveCanopy">
</mat-form-field>
</p>
<button mat-raised-button color="accent" type="submit">Add</button>