client/src/app/shared/video-playlist/video-add-to-playlist.component.scss

   1 @import '_variables';
   2 @import '_mixins';
   3
   4 .header {
   5   min-width: 240px;
   6   padding: 6px 24px 10px 24px;
   7
   8   margin-bottom: 10px;
   9   border-bottom: 1px solid $separator-border-color;
  10
  11   .first-row {
  12     display: flex;
  13     align-items: center;
  14
  15     .title {
  16       font-size: 18px;
  17       flex-grow: 1;
  18     }
  19
  20     .options {
  21       font-size: 14px;
  22       cursor: pointer;
  23
  24       my-global-icon {
  25         @include apply-svg-color(#333);
  26
  27         width: 16px;
  28         height: 16px;
  29       }
  30     }
  31   }
  32
  33   .options-row {
  34     margin-top: 10px;
  35
  36     > div {
  37       display: flex;
  38       align-items: center;
  39     }
  40   }
  41 }
  42
  43 .dropdown-item {
  44   padding: 6px 24px;
  45 }
  46
  47 .playlist {
  48   display: flex;
  49   cursor: pointer;
  50
  51   my-peertube-checkbox {
  52     margin-right: 10px;
  53   }
  54
  55   .display-name {
  56     display: flex;
  57     align-items: flex-end;
  58
  59     .timestamp-info {
  60       font-size: 0.9em;
  61       color: $grey-foreground-color;
  62       margin-left: 5px;
  63     }
  64   }
  65 }
  66
  67 .new-playlist-button,
  68 .new-playlist-block {
  69   padding-top: 10px;
  70   margin-top: 10px;
  71   border-top: 1px solid $separator-border-color;
  72 }
  73
  74 .new-playlist-button  {
  75   cursor: pointer;
  76
  77   my-global-icon {
  78     @include apply-svg-color(#333);
  79
  80     position: relative;
  81     left: -1px;
  82     top: -1px;
  83     margin-right: 4px;
  84     width: 21px;
  85     height: 21px;
  86   }
  87 }
  88
  89 input[type=text] {
  90   @include peertube-input-text(200px);
  91
  92   display: block;
  93 }
  94
  95 input[type=submit] {
  96   @include peertube-button;
  97   @include orange-button;
  98 }