Fix sidebar overlap for small width devices

This resolves a jarring text overlap issue with the sidebar by only adjusting
the `max-height` at larger widths, which matches the original rule being
overridden.

Fixes https://github.com/matrix-org/matrix-doc/issues/3049
This commit is contained in:
J. Ryan Stinnett 2021-06-17 00:19:44 +01:00 committed by Richard van der Hoff
parent 3e186da139
commit ae227b7070

View file

@ -45,9 +45,6 @@ Custom SCSS for the Matrix spec
scroll-behavior: smooth;
overscroll-behavior: contain;
/* This overrides calc(100vh - 10rem);, which gives us a blank space at the bottom of the sidebar */
max-height: calc(100vh - 6rem);
&>.td-sidebar-nav__section {
margin-top: 1rem;
}
@ -92,6 +89,15 @@ Custom SCSS for the Matrix spec
}
}
@media (min-width: 768px) {
@supports (position: sticky) {
.td-sidebar-nav {
/* This overrides calc(100vh - 10rem);, which gives us a blank space at the bottom of the sidebar */
max-height: calc(100vh - 6rem);
}
}
}
/* Customise footer */
footer {
box-shadow: 0px 0px 8px rgba(179, 179, 179, 0.25);