WebCompDev / COMPONENTS

  .dropdown-content {
    @extend .z-depth-1;
    background-color: $dropdown-bg-color;
    margin: 0;
    display: none;
    min-width: 100px;
    max-height: 650px;
    overflow-y: auto;
    opacity: 0;
    position: absolute;
    z-index: 999;
    will-change: width, height;
  
    li {
      clear: both;
      color: $off-black;
      cursor: pointer;

      line-height: 1.5rem;
      width: 100%;
      text-align: left;
      text-transform: none;
  

      &:hover, &.active {

        background-color: $dropdown-hover-bg-color;
      }
  

      & > a, & > span {

        font-size: 1.2rem;

        color: $dropdown-color;
        display: block;

        padding: 1rem 1rem;

      }
  
      // Icon alignment override
      & > a > i {
        height: inherit;
        line-height: inherit;
      }
    }
  }