18F/18f.gsa.gov

View on GitHub
_sass/_components/nav-mobile.scss

Summary

Maintainability
Test Coverage
// Mobile sidenav
// ==========================
// $sliding-panel-width: 26rem;

.nav-mobile {
  @include u-padding(2);
  @include u-position(fixed);
  @include u-top(0);
  @include u-right(0);
  @include u-bottom(0);
  @include u-left(auto);
  @include u-width('card');
  @include u-height('full');
  background: color('white');
  border-left: 1px solid color('gray-cool-30');
  border-right: 0;
  display: block;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  transform: translateX('card');
  z-index: 999999;

  .usa-sidenav-list {
    margin-top: 6rem;
  }

  &.is-visible {
    transition: all 0.3s ease-in-out;
    transform: translateX(0);
  }
}

.nav-mobile {

  @include at-media('tablet-lg') {
    display: none;
  }
}