Przeglądaj źródła

fix styles of DrawerToggler

Yuki Takei 5 lat temu
rodzic
commit
4c3e69c966
1 zmienionych plików z 16 dodań i 14 usunięć
  1. 16 14
      src/client/styles/scss/_sidebar.scss

+ 16 - 14
src/client/styles/scss/_sidebar.scss

@@ -144,6 +144,10 @@
   }
   }
 }
 }
 
 
+// Dock Mode
+@mixin dock() {
+}
+
 // Drawer Mode
 // Drawer Mode
 @mixin drawer() {
 @mixin drawer() {
   z-index: $zindex-fixed + 1;
   z-index: $zindex-fixed + 1;
@@ -180,10 +184,13 @@
 
 
   .grw-drawer-toggler {
   .grw-drawer-toggler {
     position: fixed;
     position: fixed;
-    top: 15px;
     right: -15px;
     right: -15px;
 
 
+    @include media-breakpoint-down(sm) {
+      bottom: 15px;
+    }
     @include media-breakpoint-up(md) {
     @include media-breakpoint-up(md) {
+      top: 15px;
       width: 50px;
       width: 50px;
       height: 50px;
       height: 50px;
       font-size: 24px;
       font-size: 24px;
@@ -193,22 +200,17 @@
   }
   }
 }
 }
 
 
-@mixin drawer-toggler-mobile() {
-  .grw-drawer-toggler {
-    top: unset;
-    bottom: 15px;
-    transform: translateX(100%);
-  }
-}
-
 .grw-sidebar {
 .grw-sidebar {
-  &.grw-sidebar-drawer {
-    @include drawer();
-  }
-
   @include media-breakpoint-down(sm) {
   @include media-breakpoint-down(sm) {
     @include drawer();
     @include drawer();
-    @include drawer-toggler-mobile();
+  }
+  @include media-breakpoint-up(md) {
+    &.grw-sidebar-drawer {
+      @include drawer();
+    }
+    &:not(.grw-sidebar-drawer) {
+      @include dock();
+    }
   }
   }
 }
 }