MetaPhase-Consulting/State-TalentMAP

View on GitHub
src/sass/_clientView.scss

Summary

Maintainability
Test Coverage
.client-header-sticky-container {
  position: relative;
  z-index: $client-header-z;
}

.client-header {
  background-color: $tertiary-cool-blue-lightest;

  a {
    color: $color-black;
  }

  .fa {
    margin-right: 5px;
  }

  > div {
    display: flex;
  }

  .hidden {
    visibility: hidden;
  }

  .usa-banner-inner {
    display: flex;
    padding: 2.5rem 0;

    > div:nth-child(1) {
      flex: 1;
      font-size: 16px;
    }

    > div:nth-child(2) {
      display: flex;
      flex: 2;
      font-size: 18px;
      justify-content: center;
    }

    > div:nth-child(3) {
      display: flex;
      flex: 1;
      flex-direction: row-reverse;
      font-size: 16px;
      font-weight: bold;
      justify-content: right;
    }
  }

  &.client-header--is-loading {
    *[class^="react-loading-theme-"] {
      width: 100%;
    }

    .usa-banner-inner {
      > div {
        display: initial;
      }
    }
  }

  &.client-header--alternate {
    background-color: $tertiary-gold-lightest;
  }
}