added content container

This commit is contained in:
Angelillo15 2023-08-04 20:22:31 +02:00
parent aa13ce4698
commit 638bf4cb59
1 changed files with 30 additions and 5 deletions

View File

@ -27,16 +27,29 @@
} }
/* The side navigation menu */ /* The side navigation menu */
.sidebar { .sidebar {
position: fixed;
margin: 0; margin: 0;
padding: 0; padding: 0;
width: var(--sidebar-size); width: var(--sidebar-size);
background-color: var(--color-tertiary); background-color: var(--color-tertiary);
position: fixed;
height: 100%; height: 100%;
overflow: auto; overflow: auto;
z-index: 999999; z-index: 999999;
} }
.content-container {
margin-left: calc(var(--sidebar-size) + 40px);
margin-right: 40px;
}
.content-dashboard {
max-width: 1200px;
}
.navbar-button {
display: none;
}
/* Sidebar links */ /* Sidebar links */
.sidebar a { .sidebar a {
display: block; display: block;
@ -46,7 +59,7 @@
} }
/* Active/current link */ /* Active/current link */
.sidebar .active > .icon{ .sidebar .active > .icon {
background-color: var(--button-color-active); background-color: var(--button-color-active);
color: white; color: white;
} }
@ -92,14 +105,19 @@ div.content {
height: 1000px; height: 1000px;
} }
/* On screens that are less than 700px wide, make the sidebar into a topbar */ @media screen and (max-width: 1150px) {
@media screen and (max-width: 700px) {
.sidebar { .sidebar {
position: fixed;
width: 100%; width: 100%;
left: -700px; left: -1150px;
transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out;
} }
.content-container {
margin-left: 40px;
margin-right: 40px;
}
div.content { div.content {
margin-left: 0; margin-left: 0;
padding: 1px 16px; padding: 1px 16px;
@ -116,6 +134,13 @@ div.content {
.nav-bar { .nav-bar {
display: flex; display: flex;
} }
.navbar-button {
display: inline;
font-size: 1.5rem;
margin-left: 1rem;
cursor: pointer;
}
} }
.avatar { .avatar {