Sidebar.scss

@import 'vars';
@import 'mixins';
@import 'functions';

.sidebar {
  display: none;
  width: 100%;
  max-width: 280px;
  will-change: transform;

  @include break {
    display: block;
  }
}

.sidebar__inner {
  padding: 1.5em;
  position: sticky;
  top: -1px;
  overflow: scroll;
  max-height: 100vh;
  // To hide scrollbar in Firefox
  scrollbar-width: none;
  // To hide scrollbar in Chrome
  &::-webkit-scrollbar {
    width: 0 !important;
  }
}

.sidebar__group {
  margin-top: 1em;
  margin-left: 0.15em;
  font-weight: 600;
  text-transform: uppercase;
  color: getColor(dusty-grey);
}

.sidebar__shields {
  display: flex;
  flex-wrap: wrap;

  a {
    margin-right: 6px;

    img {
      height: 20px;
    }

    &:last-child {
      margin: 0;
    }
  }
}