support-foo/web

View on GitHub
app/assets/stylesheets/modules/navbar.scss

Summary

Maintainability
Test Coverage
.navbar {
  border-bottom: none;

  .badge {
    margin-left: 5px;
  }
}

.navbar-inverse {
  .dropdown-menu {
    background-color: darken($navbar-inverse-bg, 6%);

    > .divider {
      background-color: lighten($navbar-inverse-bg, 6%);
    }

    > li:not(.active) {
      color: $navbar-inverse-color;

      > a {
        color: $navbar-inverse-link-color;

        &:hover {
          color: $navbar-inverse-link-hover-color;
          background-color: $navbar-inverse-link-hover-bg;
        }
      }
    }
  }

  .navbar-input-group {
    > .input-group-addon {
      color: $navbar-inverse-color;
    }

    > .form-control {
      color: $navbar-inverse-link-active-color;
    }
  }
}

.navbar-header {
  > .navbar-brand {
    padding: $padding-large-vertical $padding-large-horizontal;
  }
}

.navbar-homepage {
  height: 72px;
  background: #4D5055;

  .navbar-header {
    height: 72px;
  }

  .navbar-brand {
    background-color: transparent;

    img {
      width: 20px;
      height: 20px;
      margin: -4px 5px 0 0;
    }
    &:hover {
      cursor: pointer;
    }
  }

  .navbar-nav {
    li a {
        -webkit-transition: .6s all;
      }
      li > a:hover {
        color: #e6e6e6;
        background-color: rgba(0,0,0,.1);
        -webkit-transition: .3s all;
      }
    }

  .btn {
    margin-top: 18px;
  }

  .btn-default {
    &:hover,
    &.hover {
      background-color: $gray-darker;
    }
  }

  .navbar-header,
  .navbar-nav {
    a {
      padding-top: 25px;
      padding-bottom: 25px;
    }
  }

  .navbar-toggle {
    margin-top: 19px;
    border: 0;
    .icon-bar {
      background: rgba(255,255,255,.8);
    }
    &:hover {
      background: rgba(0,0,0,.1);
    }
  }
}

.navbar-placeholder {
  height: 72px;
}

.navbar-tabs {
  border-bottom: 1px solid #B5CBD0;
  margin-top: 10px;
}