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

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