Adjust styling and wording in some places

This commit is contained in:
Marcel Schwarz 2021-01-08 12:36:03 +01:00
parent 493cdd9ea7
commit 9686dc2ea5
6 changed files with 21 additions and 18 deletions

View File

@ -1,6 +1,6 @@
<meta content="width=device-width, initial-scale=1.0" name="viewport">
<mat-toolbar class="toolbar" color="primary">
<span routerLink="/">Bike Stations in London</span>
<span routerLink="/" id="logo">Bike Stations in London</span>
<span class="spacer"></span>
<a color="primary"
href="https://gitlab.com/marcel.schwarz/geovisualisierung/-/wikis/Projektarbeit%203"

View File

@ -1,6 +1,6 @@
<div class="myApp">
<mat-toolbar class="mat-toolbar" color="primary">
<span routerLink="/">Bike Stations in London</span>
<span routerLink="/" id="logo">Bike Stations in London</span>
<span class="toolbar-spacer"></span>
<app-auto-refresh></app-auto-refresh>
<a class="button-wiki" color="primary"

View File

@ -18,3 +18,7 @@
#map {
height: 95vh;
}
#logo {
cursor: pointer;
}

View File

@ -1,12 +1,11 @@
<mat-card class="mat-elevation-z0" fxFlex fxLayout="column" style="padding: 0">
<mat-card-header fxFlex>
<mat-card-title>
{{station?.commonName}}
</mat-card-title>
<mat-card class="mat-elevation-z0 p-0">
<mat-card-header>
<mat-card-title>{{station?.commonName}}</mat-card-title>
</mat-card-header>
<mat-card-content fxFlex fxLayout="column" fxLayoutAlign="center center">
<div id="chart">
<mat-card-content class="d-flex flex-column align-items-center justify-content-center">
<div id="chart" class="w-100 ml-n4">
<apx-chart
class="w-100"
[chart]="chartOptions.chart"
[colors]="chartOptions.colors"
[dataLabels]="chartOptions.dataLabels"
@ -21,10 +20,6 @@
[yaxis]="chartOptions.yaxis"
></apx-chart>
</div>
<div class="button" fxFlex>
<button (click)="route()" color="" id="route-button" mat-raised-button>Go to dashboard</button>
</div>
<button (click)="route()" mat-raised-button id="route-button">Open in dashboard</button>
</mat-card-content>
<mat-card-actions>
</mat-card-actions>
</mat-card>

View File

@ -185,9 +185,9 @@ export class MapService {
this.legend.onAdd = () => {
const div = L.DomUtil.create('div', 'legend');
div.innerHTML += `<h4>trips from/to bike station</h4>`;
div.innerHTML += `<i style="background: red"></i><span>rents with ${this.dashBoardBikePoint.commonName} as destination</span><br>`;
div.innerHTML += `<i style="background: green"></i><span>rents with ${this.dashBoardBikePoint.commonName} as start</span><br>`;
div.innerHTML += `<i style="background: blue"></i><span>rents with ${this.dashBoardBikePoint.commonName} as destination and start</span>`;
div.innerHTML += `<i style="background: green"></i><span>inbound to ${this.dashBoardBikePoint.commonName}</span><br>`;
div.innerHTML += `<i style="background: red"></i><span>outbound from ${this.dashBoardBikePoint.commonName}</span><br>`;
div.innerHTML += `<i style="background: blue"></i><span>in- and outbound traffic line</span>`;
return div;
};
this.legend.addTo(this.miniMap);

View File

@ -16,7 +16,11 @@ body {
/* WTF ANGULAR!?!?!?! WHY DO I HAVE TO DO THIS? (see table.component.html@7 and table.component.html@50) */
label.mat-checkbox-layout {
margin: 0 !important;
margin: 0;
}
#logo {
cursor: pointer;
}
.legend {