ToneAPI/ToneAPI_webclient
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

responsive and some finishing touches

Browse Source
This commit is contained in:
legonzaur
2023-03-28 22:11:19 +02:00
parent 8ade9d79a1
commit b72bf04d49
7 changed files with 167 additions and 54 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/App.vue
+16 -5
View File
@@ -2,11 +2,11 @@
<header>
<nav>
<!-- <div class="navbar-element">hamburger</div> -->
<div class="navbar-element"><span>logo&nbsp;</span>TONE&nbsp;API</div>
<div class="navbar-element"><!--<span>logo&nbsp;</span>--->TONE&nbsp;API</div>
<div class="spacer"></div>
<router-link to="/" class="navbar-element">Home</router-link>
<router-link to="/about" class="navbar-element">About</router-link>
<router-link to="/players" class="navbar-element">Players</router-link>
<!-- <router-link to="/" class="navbar-element">Home</router-link>
<router-link to="/about" class="navbar-element">About</router-link> -->
<router-link to="/" class="navbar-element">Players</router-link>
</nav>
</header>
<router-view />
@@ -31,7 +31,7 @@ body {
#app {
height: 100vh;
width: 100vw;
font-family: Avenir, Helvetica, Arial, sans-serif;
font-family: 'Helvetica', 'Arial', sans-serif;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
text-align: center;
@@ -46,6 +46,17 @@ body {
grid-template-rows: auto 1fr auto auto;
}
@media only screen and (max-width: 922px) {
#app{
grid-template-areas:
'header header'
'filters filters'
'body body ';
grid-template-rows: auto auto 1fr;
}
}
header {
grid-area: header;
height: 64px;