diff --git a/public/sass/_variables.dark.scss b/public/sass/_variables.dark.scss index ef9f1a06996..6e86aa1872e 100644 --- a/public/sass/_variables.dark.scss +++ b/public/sass/_variables.dark.scss @@ -259,6 +259,7 @@ $navbar-button-border: #2f2f32; // Sidemenu // ------------------------- $side-menu-bg: $black; +$side-menu-bg-mobile: $side-menu-bg; $side-menu-item-hover-bg: $dark-2; $side-menu-shadow: 0 0 20px black; $side-menu-link-color: $link-color; diff --git a/public/sass/_variables.light.scss b/public/sass/_variables.light.scss index eb598f27d4c..a59350d2195 100644 --- a/public/sass/_variables.light.scss +++ b/public/sass/_variables.light.scss @@ -200,6 +200,7 @@ $input-invalid-border-color: lighten($red, 5%); // Sidemenu // ------------------------- $side-menu-bg: $dark-2; +$side-menu-bg-mobile: rgba(0, 0, 0, 0); //$gray-6; $side-menu-item-hover-bg: $gray-1; $side-menu-shadow: 5px 0px 10px -5px $gray-1; $side-menu-link-color: $gray-6; diff --git a/public/sass/components/_sidemenu.scss b/public/sass/components/_sidemenu.scss index 5f21bbc8cd0..8a5c3779714 100644 --- a/public/sass/components/_sidemenu.scss +++ b/public/sass/components/_sidemenu.scss @@ -71,7 +71,7 @@ // important to overlap it otherwise it can be hidden // again by the mouse getting outside the hover space left: $side-menu-width - 2px; - @include animation("dropdown-anim 150ms ease-in-out 100ms forwards"); + @include animation('dropdown-anim 150ms ease-in-out 100ms forwards'); z-index: $zindex-sidemenu; } } @@ -193,9 +193,13 @@ li.sidemenu-org-switcher { @include media-breakpoint-down(xs) { .sidemenu-open--xs { + li { + font-size: $font-size-lg; + } + .sidemenu { width: 100%; - background: $side-menu-bg; + background: $side-menu-bg-mobile; position: initial; height: auto; box-shadow: $side-menu-shadow; @@ -214,6 +218,9 @@ li.sidemenu-org-switcher { .sidemenu__bottom { display: block; } + .sidemenu-item { + border-right: 2px solid transparent; + } } .sidemenu {