sticky sidebar

This commit is contained in:
Tanishq Dubey 2024-10-20 20:22:31 -04:00
parent 3dbdd354b5
commit 6335751f0f

View File

@ -15,12 +15,13 @@
background-color: #f0f0f0;
display: flex;
flex-direction: row;
height: 100dvh;
min-height: 100vh;
}
.main-content {
flex-grow: 1;
padding: 20px;
overflow-y: auto;
}
.grid-container {
display: grid;
@ -95,15 +96,14 @@
}
.sidebar {
min-width: 20rem;
width: 20rem;
background-color: #f0f0f0;
padding: 20px;
box-sizing: border-box;
position: sticky;
top: 0;
height: 100vh;
overflow: hidden;
overflow-y: auto;
display: flex;
flex-direction: column;
justify-content: space-between;
@ -160,6 +160,7 @@
height: auto;
position: static;
padding: 10px;
overflow-y: visible;
}
.sidebar-nav ul {
display: none;
@ -179,10 +180,7 @@
<div class="nav-toggle"></div>
<nav>
<ul>
<li><a href="#">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Contact</a></li>
<!-- divider line -->
<li><a href="/">Home</a></li>
<li><hr></li>
<li>Powered by <a href="https://dws.rip">DWS</a></li>
</ul>