Contents

$md-col: 250px;

.sidebar-layout {
  display: flex;
  height: 100%;
  flex-direction: column;
  position: relative;
  &.no-scroll .sidebar-layout-container{
    flex: auto;
  }
  &-container {
    display: flex;
    flex: 1 0 auto;
    flex-direction: row;
    @each $name, $size in $grid-breakpoints {
      @include media-max-width($size) {
        &.collapse-#{$name} {
          flex-direction: column;
          .sidebar-layout-nav {
            border-width: 0 0 1px 0;
            flex-basis: auto;
          }
        }
      }
    }
  }
  &-content {
    box-orient: vertical;
    display: flex;
    flex-direction: column;
    width: 100%;
    &-container {
      display: flex;
      flex-direction: column;
      height: 100%;
    }
  }
  &-nav {
    order: -1;
    flex: 0 0 $md-col;
    border-width: 0 1px 0 0;
    border-style: solid;
    z-index: 0;
    &-item {
      display: block;
      padding: $space-small $space-smallest $space-small $space-base;
      color: $ink-lighter;
      &:hover {
        background: $p-blue-opacity-6;
        color: $white;
      }
      &.active {
        background: $power-blue;
        color: $white;
      }
    }

  }
}

Version data entries

2 entries across 2 versions & 1 rubygems

Version	Path
nitro_sg-3.0.2	sass-mixins/nitro-ui/layouts/_sidebar-layout.scss
nitro_sg-3.0.1	sass-mixins/nitro-ui/layouts/_sidebar-layout.scss