49 lines
901 B
CSS
49 lines
901 B
CSS
:root {
|
|
--sidebar-width: 3.5vw;
|
|
}
|
|
|
|
/* sidebar stuff */
|
|
.sidebar {
|
|
height: 100%; /* 100% Full-height */
|
|
width: var(--sidebar-width); /* 0 width - change this with JavaScript */
|
|
position: fixed; /* Stay in place */
|
|
top: 0;
|
|
left: 0;
|
|
overflow-x: hidden; /* Disable horizontal scroll */
|
|
transition: 0.5s; /* 0.5 second transition effect to slide in the sidebar */
|
|
z-index: 100;
|
|
}
|
|
|
|
.sidebar:hover {
|
|
width: 11vw;
|
|
}
|
|
|
|
.sidebar a {
|
|
padding: .4vw .4vw .4vw .4vw;
|
|
display: block;
|
|
color: white;
|
|
white-space: nowrap;
|
|
text-decoration: none;
|
|
}
|
|
|
|
.sidebar a img {
|
|
margin-right: .6vw;
|
|
width: 2.5vw;
|
|
}
|
|
|
|
.sidebar a b {
|
|
font-size: .85vw;
|
|
}
|
|
|
|
.sidebar a:hover {
|
|
background-color: hsl(0, 0%, 8%);
|
|
color: rgb(210, 210, 210);
|
|
}
|
|
|
|
@media screen and (max-width: 992px) {
|
|
:root {
|
|
--sidebar-width: 0px;
|
|
}
|
|
.sidebar {display: none;}
|
|
}
|