andi/perfdb
1
0
Fork 0
Code Issues 1 Pull Requests Packages Projects Releases Activity

make main page a little bit nicer

Browse Source
This commit is contained in:
Andreas Huber
2023-02-28 19:18:49 +01:00
parent 66da69a57a
commit 17c0cd5ca9
4 changed files with 61 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
pdb-js/src/app/app.component.html
View File

@@ -1,7 +1,7 @@
<div id="main-toolbar">
<button mat-button [routerLink]="['/']"><img src="assets/img/scatter-chart2.svg" aria-hidden="false" aria-label="go to home page" /> Plotilio</button>
<button mat-button [routerLink]="['/']"><img src="assets/img/strip-chart.svg" aria-hidden="false" aria-label="go to home page" /> Plotilio</button>
<button mat-button [routerLink]="['/vis']">Visualization</button>
<button mat-button [routerLink]="['/dashboard']">Dashboards</button>
</div>

34
pdb-js/src/app/main-page/main-page.component.html
View File

@@ -9,11 +9,41 @@
left: 50%;
transform: translate(-50%, -50%);
}
h1 {
font-size: 5em;
text-align: center;
}
.link-section {
display: flex;
}
.sub-section {
display: inline;
display: flex;
flex-direction: column;
justify-content: flex-start;
margin: 2em;
}
.sub-section > * {
text-align: center;
}
</style>
<div id="main-page-links">
<a [routerLink]="['/vis']" class="button-large" title="Visualization"><img src="assets/img/scatter-chart2.svg" class="icon-large" aria-hidden="false" aria-label="go to visualization page" /></a>
<a [routerLink]="['/dashboard']" class="button-large" title="Dashboards"><img src="assets/img/dashboard-line.svg" class="icon-large" aria-hidden="false" aria-label="go to dashboard page" /></a>
<!--
<div style="text-align: center;"><img src="assets/img/strip-chart.svg" class="icon-huge" aria-hidden="true"/></div>
-->
<h1>Plotilio</h1>
<div class="link-section">
<div class="sub-section">
<a [routerLink]="['/vis']" class="button-large" title="Visualization"><img src="assets/img/scatter-chart3.svg" class="icon-large" aria-hidden="false" aria-label="go to visualization page" /></a>
<p>Do awesome visualizations.</p>
</div>
<div class="sub-section">
<a [routerLink]="['/dashboard']" class="button-large" title="Dashboards"><img src="assets/img/dashboard-line.svg" class="icon-large" aria-hidden="false" aria-label="go to dashboard page" /></a>
<p>Create the most sophisticated dashboards.</p>
</div>
</div>
<!--a href="/upload" class="button-large" title="upload data"><img src="assets/img/upload.svg" class="icon-large" aria-hidden="false" aria-label="upload data" /></a-->
</div>