diff --git a/src/style.scss b/src/style.scss index b3ec805..0a72b76 100644 --- a/src/style.scss +++ b/src/style.scss @@ -16,25 +16,31 @@ pre, code { body:not(.close) { main { - align-items: start; - display: grid; - grid-gap: 1rem; - grid-template-columns: $mobile-phone-width minmax(10px, 1fr); + display: flex; + flex-direction: row; + + @media (max-width: $mobile-phone-width) { + overflow-x: hidden; + } } .sidebar { - @extend .fr-sidemenu--sticky-full-height; background-color: var(--background-default-grey); height: calc(100vh - 38px); overflow: auto; overflow-y: scroll; + position: sticky; + top: 0; + width: $mobile-phone-width; + flex-shrink: 0; @media (max-width: $mobile-phone-width) { - height: 100%; - left: 0; position: fixed; top: 0; - z-index: 1000; + left: 0; + width: 100vw; + height: 100vh; + z-index: 20; } .app-name, .sidebar-nav { @@ -92,7 +98,6 @@ body.close { } .sidebar-toggle { - background: var(--background-default-grey); bottom: 0; left: 0; padding: 10px;