sartography
/
uva-covid19-testing-frontend
mirror of https://github.com/sartography/uva-covid19-testing-frontend.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Updated graphs layout

This commit is contained in:
Nile Walker 2021-01-29 16:37:06 -05:00
parent 052ec2033a
commit a022259aed
2 changed files with 112 additions and 107 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/app/graphs/graphs.component.css
View File

@ -36,15 +36,13 @@ mat-form-field {
mat-card { mat-card {
margin: 20px; margin: 20px;
} }
button {
margin: 20px;
}
body { body {
padding: 20px; padding: 20px;
} }
.flex-grid { .flex-grid {
margin: 0 0 20px 0; margin: 0 20px 20px 0;
} }
.col { .col {
/* background: salmon; */ /* background: salmon; */

37
src/app/graphs/graphs.component.html
View File

@ -39,17 +39,25 @@
</mat-card> </mat-card>
</div> </div>
<mat-card class="row"> <mat-card class="row">
<mat-card-header class="flex-grid">
<h3 class="col">Search</h3>
<button mat-flat-button class="btn-lg col" color="primary" (click)="searchToday()">Today</button>
<button mat-flat-button class="btn-lg col" color="primary" (click)="searchAll()">All</button>
<button mat-flat-button class="btn-lg col" color="primary" (click)="updateGraphData()">Run</button>
<mat-card-header>
<div class="flex-grid">
<h1 class="col">Search</h1>
<div class="col">
<button mat-raised-button class="btn-lg" color="primary" (click)="searchToday()">Today</button>
</div>
<div class="col">
<button mat-raised-button class="btn-lg" color="primary" (click)="searchAll()">All</button>
</div>
<div class="col">
<button mat-raised-button class="btn-lg" color="primary" (click)="updateGraphData()">Run</button>
</div>
</div>
</mat-card-header> </mat-card-header>
<mat-form-field> <div class="flex-grid">
<mat-form-field class="col">
<mat-date-range-input [rangePicker]="picker"> <mat-date-range-input [rangePicker]="picker">
<input matStartDate [(ngModel)]="start_date"> <input matStartDate [(ngModel)]="start_date">
<input matEndDate [(ngModel)]="end_date"> <input matEndDate [(ngModel)]="end_date">
@ -58,24 +66,24 @@
<mat-date-range-picker #picker></mat-date-range-picker> <mat-date-range-picker #picker></mat-date-range-picker>
</mat-form-field> </mat-form-field>
<mat-form-field> <mat-form-field class="col">
<mat-label>Location ID(s)</mat-label> <mat-label>Location ID(s)</mat-label>
<textarea matInput [(ngModel)]="form.location" placeholder="Location Codes"></textarea> <textarea matInput [(ngModel)]="form.location" placeholder="Location Codes"></textarea>
</mat-form-field> </mat-form-field>
<mat-form-field>
<mat-form-field class="col">
<mat-label>Student ID(s)</mat-label> <mat-label>Student ID(s)</mat-label>
<textarea matInput [(ngModel)]="form.student_id" placeholder="Ex. It makes me feel..."></textarea> <textarea matInput [(ngModel)]="form.student_id" placeholder="Ex. It makes me feel..."></textarea>
</mat-form-field> </mat-form-field>
<mat-form-field> <mat-form-field class="col">
<mat-label>Compute ID(s)</mat-label> <mat-label>Compute ID(s)</mat-label>
<textarea matInput [(ngModel)]="form.compute_id" placeholder="Ex. It makes me feel..."></textarea> <textarea matInput [(ngModel)]="form.compute_id" placeholder="Ex. It makes me feel..."></textarea>
</mat-form-field> </mat-form-field>
</div>
</mat-card> </mat-card>
<div class="flex-grid row">
<mat-card class="col"> <mat-card class="col">
<mat-card-header> <mat-card-header>
<h1>{{ChartName}}</h1> <h1>{{ChartName}}</h1>
@ -86,8 +94,6 @@
</canvas> </canvas>
</mat-card> </mat-card>
<div class="flex-grid">
<mat-card class="col"> <mat-card class="col">
<mat-card-header> <mat-card-header>
<h1>Average Count By Weekday For {{form.start_date | date}} - {{form.end_date | date}}</h1> <h1>Average Count By Weekday For {{form.start_date | date}} - {{form.end_date | date}}</h1>
@ -112,6 +118,7 @@
</div> </div>
</mat-card> </mat-card>
</div> </div>
<mat-card> <mat-card>