react-toolbox/docs/app/components/layout/main/components/navigation.scss

@import "../config";

.root {
  display: flex;
  width: $navigation-width;
  flex-direction: column;
  background-color: $color-background;
}

.list {
  @include no-webkit-scrollbar;
  flex-grow: 1;
  overflow-y: auto;
}

.item {
  > span{
    padding: $navigation-v-padding $navigation-h-padding;
  }
  [data-react-toolbox="list-item-text"] {
    font-size: $font-size-small;
    font-weight: $font-weight-semi-bold;
  }
}

.active {
  background: $color-divider;
}

.footer {
  flex-grow: 0;
  padding: $navigation-h-padding;
  overflow: hidden;
  font-size: $font-size-small;
  color: $color-text-secondary;
  border-top: $navigation-footer-border;
  > * {
    display: block;
  }
}