You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
84 lines
1.6 KiB
84 lines
1.6 KiB
<template>
|
|
<aside class="menu has-background-black">
|
|
<div class="container mx-5 my-4">
|
|
<p class="menu-label">
|
|
General
|
|
</p>
|
|
<ul class="menu-list">
|
|
<li>
|
|
<a>
|
|
<span class="icon-text">
|
|
<span class="icon">
|
|
<i class="fas fa-digital-tachograph"/>
|
|
</span>
|
|
<span> Dashboard</span>
|
|
</span>
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a>
|
|
<span class="icon-text">
|
|
<span class="icon">
|
|
<i class="fas fa-users"/>
|
|
</span>
|
|
<span> Athletes</span>
|
|
</span>
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
<p class="menu-label">
|
|
Athlete Data
|
|
</p>
|
|
<ul class="menu-list">
|
|
<li>
|
|
<a>
|
|
<span class="icon-text">
|
|
<span class="icon">
|
|
<i class="fas fa-table"/>
|
|
</span>
|
|
<span> Tables</span>
|
|
</span>
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a>
|
|
<span class="icon-text">
|
|
<span class="icon">
|
|
<i class="fas fa-chart-area"/>
|
|
</span>
|
|
<span> Charts</span>
|
|
</span>
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</aside>
|
|
</template>
|
|
|
|
<script lang="ts">
|
|
import {Vue} from 'vue-class-component';
|
|
|
|
export default class Sidebar extends Vue {
|
|
|
|
}
|
|
</script>
|
|
|
|
<style scoped>
|
|
|
|
@media (max-width: 572px) {
|
|
aside {
|
|
position: relative;
|
|
top: 5vh;
|
|
min-width: 100%;
|
|
}
|
|
}
|
|
|
|
@media (min-width: 572px) {
|
|
aside {
|
|
position: fixed;
|
|
height: 95vh;
|
|
width: 15rem;
|
|
top: 5vh;
|
|
}
|
|
}
|
|
</style>
|