client/src/app/shared/shared-main/buttons/action-dropdown.component.scss

   1 @use '_variables' as *;
   2 @use '_mixins' as *;
   3
   4 .dropdown-divider:last-child {
   5   display: none;
   6 }
   7
   8 .action-button {
   9   @include peertube-button;
  10
  11   display: inline-block;
  12
  13   &.button-styled {
  14
  15     &.grey {
  16       @include grey-button;
  17     }
  18
  19     &.orange {
  20       @include orange-button;
  21     }
  22
  23     &:hover,
  24     &:active,
  25     &:focus {
  26       background-color: $grey-background-color;
  27     }
  28   }
  29
  30   &::after {
  31     display: none;
  32   }
  33
  34   .more-icon {
  35     width: 21px;
  36
  37     ::ng-deep {
  38       @include apply-svg-color(pvar(--actionButtonColor));
  39     }
  40   }
  41
  42   &.small {
  43     font-size: 14px;
  44     padding: 0 10px;
  45   }
  46 }
  47
  48 .dropdown-toggle::after {
  49   position: relative;
  50   top: 1px;
  51 }
  52
  53 .dropdown-menu {
  54   max-width: 75vw;
  55
  56   .dropdown-header {
  57     padding: 0.2rem 1rem;
  58   }
  59
  60   .dropdown-item {
  61     display: flex;
  62     cursor: pointer;
  63
  64     &.with-icon {
  65       @include dropdown-with-icon-item;
  66     }
  67
  68     a,
  69     span {
  70       display: block;
  71       width: 100%;
  72     }
  73   }
  74 }
  75
  76 .item-label {
  77   display: flex;
  78   flex-direction: column;
  79   min-width: 1px;
  80
  81   > * {
  82     @include ellipsis;
  83   }
  84 }