katja/WebAdmin3.0
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Header

Browse Source
This commit is contained in:
Katja Hedemann
2023-04-20 13:28:44 +02:00
parent d48a51f0e3
commit cd8918f21b
4 changed files with 52 additions and 86 deletions
Download Patch File Download Diff File Expand all files Collapse all files

93
app.vue
View File

@ -1,14 +1,21 @@
<template>
<div class="main-container">
<div class="header">
<p>
<router-link to="/header/help">
HILFE
</router-link>
<router-link to="/header/info">
INFO
</router-link>
</p>
<table id="header-table">
<tr>
<th>
<router-link to="/header/help">
Hilfe
</router-link>
</th>
<th>
<router-link to="/header/info">
Info
</router-link>
</th>
<th> Logout </th>
</tr>
</table>
</div>
<div class="sidenav">
<div class="sidenav-content">
@ -33,72 +40,4 @@
<script></script>
<style scoped>
.main-container {
max-width: 70vw;
margin: auto;
}
/* Navigation */
/* The side navigation menu */
.sidenav {
height: 100%;
width: 250px;
position: fixed;
z-index: 1;
top: 0;
left: 0;
background-color: #a5aeb5;
overflow-x: hidden;
padding-top: 20px;
}
.sidenav-content {
padding: 15px;
}
/* The menu title */
.menu-heading {
color: #f1f1f1;
width: 200px;
height: 75px;
font-weight: 600;
font-size: 40px;
}
/* The navigation menu links */
.sidenav a {
text-decoration: none;
font-size: 25px;
color: #e0e2e3;
display: block;
transition: 0.3s;
}
/* When you mouse over the navigation links, change their color */
.sidenav a:hover {
color: #f1f1f1;
}
/* Position and style the close button (top right corner) */
.sidenav .closebtn {
position: absolute;
top: 0;
right: 25px;
font-size: 36px;
margin-left: 50px;
}
/* Style page content - use this if you want to push the page content to the right when you open the side navigation */
#main {
transition: margin-left .5s;
padding: 20px;
}
/* On smaller screens, where height is less than 450px, change the style of the sidenav (less padding and a smaller font size) */
@media screen and (max-height: 450px) {
.sidenav {padding-top: 15px;}
.sidenav a {font-size: 18px;}
}
</style>
<style src="@/assets/main.css"></style>