client/src/app/shared/video-playlist/video-playlist-miniature.component.scss

   1 @import '_variables';
   2 @import '_mixins';
   3 @import '_miniature';
   4
   5 .miniature {
   6   display: inline-block;
   7
   8   &.no-videos:not(.to-manage){
   9     a {
  10       cursor: default !important;
  11     }
  12   }
  13
  14   &.to-manage,
  15   &.no-videos {
  16     .play-overlay {
  17       display: none;
  18     }
  19   }
  20
  21   .miniature-thumbnail {
  22     @include miniature-thumbnail;
  23
  24     .miniature-playlist-info-overlay {
  25       @include static-thumbnail-overlay;
  26
  27       position: absolute;
  28       right: 0;
  29       bottom: 0;
  30       height: $video-thumbnail-height;
  31       padding: 0 10px;
  32       display: flex;
  33       align-items: center;
  34       font-size: 14px;
  35       font-weight: $font-semibold;
  36     }
  37   }
  38
  39   .miniature-info {
  40     width: 200px;
  41     margin-top: 2px;
  42     line-height: normal;
  43
  44     .miniature-name {
  45       @include miniature-name;
  46
  47       @include ellipsis-multiline(1.3em, 2);
  48
  49       margin: 0;
  50     }
  51
  52     .by {
  53       @include disable-default-a-behaviour;
  54
  55       display: block;
  56       color: $grey-foreground-color;
  57     }
  58
  59     .privacy-date {
  60       margin-top: 5px;
  61
  62       .video-info-privacy {
  63         font-size: 14px;
  64         font-weight: $font-semibold;
  65
  66         &::after {
  67           content: '-';
  68           margin: 0 3px;
  69         }
  70       }
  71     }
  72
  73     .video-info-description {
  74       margin-top: 10px;
  75       color: $grey-foreground-color;
  76     }
  77   }
  78 }