/* @file
 * Dropbutton partial
 * Additoinal dropbutton styling in _views.scss for specific view admin styling.
 *
 */

//table dropdown
.dropbutton-wrapper {
  display: inline-block;
  .single-btn-wrapper {
    list-style: none;
    a {
      @extend .btn;
      @extend .btn-flat;

      padding: 0 1.5rem;
      &:hover {
        background: color($utility, 'lighten-1');
      }
    }
  }
}

.dropbutton-widget {
  padding: 0 5px;
}

.dropdown-button {
  display: inline-block;
  &:hover {
    @extend .lighten-5;

    text-decoration: none;
  }
  &::after {
    @extend .material-icons;

    display: inline;
    margin-left: 10px;
    vertical-align: inherit;
    content: 'keyboard_arrow_down';
  }
  &.active::after {
    @extend .material-icons;

    display: inline;
    margin-left: 10px;
    content: 'keyboard_arrow_up';
  }
  &.ellipsis-icon::after {
    display: none;
    content: '';
  }
}

//dont show button styles in dropdowns
.dropdown-content {
  li {
    .button {
      display: block;
      box-shadow: none;
      background: none;
      padding: inherit;
      width: 100%;
      min-height: 50px;
      color: inherit;
      &.btn-paragraph-action {
        padding: 10px;
        text-align: left;
      }
    }
  }
}

table.highlight>tbody>tr.selected {
  background: color($utility, 'lighten-4');
  a {
    text-decoration: none;
  }
  a.dropdown-button {
    text-decoration: none;
    color: color($utility, 'darken-2');
  }
  .dropbutton-widget li {
    color: $black;
    a {
      text-decoration: none;
      color: $black;
    }
  }
  td {
    background: color($utility, 'lighten-4');
  }
}