18F/18f.gsa.gov

View on GitHub
_sass/_styleguide/layout.scss

Summary

Maintainability
Test Coverage
$sg-header-height: 10rem;
$margins-width: 170px;

.styleguide-details {
  margin-bottom: $theme-site-margins-width;
  margin-top: $theme-site-margins-width;
}

.styleguide-border {
  border: 1px solid color('gray-cool-5');
}

.styleguide-content-wrapper {
  display: flex;

  .styleguide-subnav {
    position: fixed;
    top: $sg-header-height;
  }
}

.styleguide-header-wrapper {
  align-items: center;
  border-bottom: 1px solid color('gray-cool-30');
  display: flex;
  height: $sg-header-height;
  padding: $theme-site-margins-width;
  position: fixed;
  width: 100%;
  z-index: 10;

  a {
    align-items: center;
    display: flex;
    text-decoration: none;
    width: 100%;
  }

  > * {
    display: inline-block;
    margin: 0;
  }

  h1 {
    font-size: $h4-font-size;
    margin: 0;
    width: 100%;
  }
}

.styleguide-logo {
  height: $sg-header-height - (2 * $theme-site-margins-width);
  margin-right: $paragraph-margins;
  width: auto;
}