Switch themes to minimo

themes/minimo/src/stylesheets/layouts/sidebar/_sidebar.scss

@@ -0,0 +1,116 @@
+.sidebar {
+  visibility: hidden;
+
+  float: left;
+  left: -$sidebar__width;
+  position: absolute;
+
+  width: $sidebar__width;
+  max-width: 100%;
+  min-height: 100%;
+  padding: 2em 0;
+  margin-right: -100%;
+
+  outline: 0;
+  z-index: 99999;
+  transition: left $transition-duration;
+
+  text-align: right;
+  background: $color__pure-white;
+
+  &.toggled {
+    visibility: visible;
+    left: 0;
+  }
+
+  .sep-after {
+    &:after {
+      margin-left: auto;
+    }
+  }
+
+  @include screen($breakpoint-medium) {
+    visibility: visible;
+    left: 0;
+  }
+}
+
+.sidebar-toggler {
+  background: none;
+  border: 0;
+
+  .icon {
+    @include font-size(1.25);
+  }
+
+  &:focus,
+  &:hover,
+  &:active {
+    background: none;
+  }
+
+  .main & {
+    padding: 0;
+    position: absolute;
+    right: $container__gutter;
+
+    &[aria-expanded='true'] {
+      display: none;
+    }
+
+    .close {
+      display: none;
+    }
+  }
+
+  .main-menu & {
+    position: static;
+    margin-right: 0.75em;
+
+    &[aria-expanded='true'] {
+      display: inline-block;
+    }
+  }
+
+  .sidebar & {
+    position: absolute;
+    top: 0.5em;
+    left: 0.5em;
+
+    z-index: 2027;
+
+    .open {
+      display: none;
+    }
+  }
+
+  @include screen($breakpoint-medium) {
+    display: none;
+  }
+}
+
+.sidebar-overlay {
+  display: none;
+
+  .sidebar.toggled & {
+    display: block;
+
+    &:after {
+      content: '';
+      display: block;
+      position: fixed;
+      top: 0;
+      right: 0;
+      bottom: 0;
+      left: 0;
+      z-index: -2027;
+
+      background: $color__pure-white;
+      opacity: 0.75;
+    }
+
+    @include screen($breakpoint-medium) {
+      display: none;
+    }
+  }
+}