Skip to content

Commit

Permalink
Make sidebar sticky
Browse files Browse the repository at this point in the history
Do this by making the contents area max out to 100vh so that it scrolls
independently of the sidebar.
  • Loading branch information
jonathansick committed Jun 18, 2024
1 parent 6b47d18 commit 5500082
Showing 1 changed file with 4 additions and 0 deletions.
4 changes: 4 additions & 0 deletions src/assets/styles/base/_layout.scss
Original file line number Diff line number Diff line change
Expand Up @@ -120,6 +120,7 @@ body {
.technote-container {
grid-template-columns: var(--tn-sidebar-width) 1fr;
grid-template-rows: auto 1fr;
height: 100vh; /* Full height to allow for sticky sidebar */
}

.technote-logo-container {
Expand All @@ -139,6 +140,9 @@ body {
grid-column: 2 / 3;
grid-row: 1 / 3;

/* Allow overflow because .technote-container is full height */
overflow-y: auto;

/* Create a grid within article to constrain content but allow
full-bleed blocks.
*/
Expand Down

0 comments on commit 5500082

Please sign in to comment.