Changement général pour avoir une bonne

hauteur et largeur sur toutes les pages
This commit is contained in:
Sébastien André
2020-04-29 16:47:24 +02:00
parent e60ad1d3fa
commit 5f89b51db1
33 changed files with 629 additions and 521 deletions

View File

@@ -11,3 +11,11 @@ table {
min-width: 200px;
word-wrap: break-word;
}
.content {
height: 90vh;
display: flex;
justify-content: left;
flex-direction: column;
align-items: initial;
}

View File

@@ -1,60 +1,62 @@
<div *ngIf="dataSourceTable != null else loading" class="table-container">
<button mat-raised-button color="accent" (click)="openDialogToAdd()">Add a drop zone</button>
<div class="content">
<div *ngIf="dataSourceTable != null else loading">
<button mat-raised-button color="accent" (click)="openDialogToAdd()">Add a drop zone</button>
<table mat-table [dataSource]="dataSourceTable">
<ng-container matColumnDef="isfavorite">
<th mat-header-cell *matHeaderCellDef></th>
<td mat-cell *matCellDef="let element" style="text-align: center;">
<mat-icon aria-hidden="false" aria-label="Favorit" *ngIf="element.isFavorite === true"
(click)="removeToFavorite(element)">favorite</mat-icon>
<mat-icon aria-hidden="false" aria-label="Not favorite" *ngIf="element.isFavorite === false"
(click)="setToFavorite(element)">favorite_border</mat-icon>
</td>
</ng-container>
<table mat-table [dataSource]="dataSourceTable">
<ng-container matColumnDef="isfavorite">
<th mat-header-cell *matHeaderCellDef></th>
<td mat-cell *matCellDef="let element" style="text-align: center;">
<mat-icon aria-hidden="false" aria-label="Favorit" *ngIf="element.isFavorite === true"
(click)="removeToFavorite(element)">favorite</mat-icon>
<mat-icon aria-hidden="false" aria-label="Not favorite" *ngIf="element.isFavorite === false"
(click)="setToFavorite(element)">favorite_border</mat-icon>
</td>
</ng-container>
<ng-container matColumnDef="id">
<th mat-header-cell *matHeaderCellDef>ID</th>
<td mat-cell *matCellDef="let element">{{element.id}}</td>
</ng-container>
<ng-container matColumnDef="id">
<th mat-header-cell *matHeaderCellDef>ID</th>
<td mat-cell *matCellDef="let element">{{element.id}}</td>
</ng-container>
<ng-container matColumnDef="name">
<th mat-header-cell *matHeaderCellDef>Name</th>
<td mat-cell *matCellDef="let element">
<span class="spanWithBreakWord" [innerHTML]="element.name"></span>
<a href='http://{{element.website}}'>ici</a>
</td>
</ng-container>
<ng-container matColumnDef="name">
<th mat-header-cell *matHeaderCellDef>Name</th>
<td mat-cell *matCellDef="let element">
<span class="spanWithBreakWord" [innerHTML]="element.name"></span>
<a href='http://{{element.website}}'>ici</a>
</td>
</ng-container>
<ng-container matColumnDef="latitude">
<th mat-header-cell *matHeaderCellDef>Latitude</th>
<td mat-cell *matCellDef="let element">{{element.latitude}}</td>
</ng-container>
<ng-container matColumnDef="longitude">
<th mat-header-cell *matHeaderCellDef>Longitude</th>
<td mat-cell *matCellDef="let element">{{element.longitude}}</td>
</ng-container>
<ng-container matColumnDef="latitude">
<th mat-header-cell *matHeaderCellDef>Latitude</th>
<td mat-cell *matCellDef="let element">{{element.latitude}}</td>
</ng-container>
<ng-container matColumnDef="longitude">
<th mat-header-cell *matHeaderCellDef>Longitude</th>
<td mat-cell *matCellDef="let element">{{element.longitude}}</td>
</ng-container>
<ng-container matColumnDef="address">
<th mat-header-cell *matHeaderCellDef>Address</th>
<td mat-cell *matCellDef="let element">
<span class="spanWithBreakWord" [innerHTML]="element.address"></span>
</td>
</ng-container>
<ng-container matColumnDef="email">
<th mat-header-cell *matHeaderCellDef>E-mail</th>
<td mat-cell *matCellDef="let element">{{element.email}}</td>
</ng-container>
<ng-container matColumnDef="type">
<th mat-header-cell *matHeaderCellDef>Type</th>
<td mat-cell *matCellDef="let element">{{element.type}}</td>
</ng-container>
<ng-container matColumnDef="address">
<th mat-header-cell *matHeaderCellDef>Address</th>
<td mat-cell *matCellDef="let element">
<span class="spanWithBreakWord" [innerHTML]="element.address"></span>
</td>
</ng-container>
<ng-container matColumnDef="email">
<th mat-header-cell *matHeaderCellDef>E-mail</th>
<td mat-cell *matCellDef="let element">{{element.email}}</td>
</ng-container>
<ng-container matColumnDef="type">
<th mat-header-cell *matHeaderCellDef>Type</th>
<td mat-cell *matCellDef="let element">{{element.type}}</td>
</ng-container>
<tr mat-header-row *matHeaderRowDef="displayedColumns; sticky: true"></tr>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
</table>
<tr mat-header-row *matHeaderRowDef="displayedColumns; sticky: true"></tr>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
</table>
</div>
<mat-paginator [length]="resultsLength" [pageSize]="20"></mat-paginator>
<ng-template #loading>
<mat-progress-spinner [mode]="'indeterminate'"></mat-progress-spinner>
</ng-template>
</div>
<mat-paginator [length]="resultsLength" [pageSize]="20"></mat-paginator>
<ng-template #loading>
<mat-progress-spinner [mode]="'indeterminate'"></mat-progress-spinner>
</ng-template>