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
  48     .video-info-by-date {
  49       display: flex;
  50       font-size: 13px;
  51       margin: 5px 0;
  52
  53       .by {
  54         @include disable-default-a-behaviour;
  55
  56         display: block;
  57         color: var(--mainForegroundColor);
  58
  59         &::after {
  60           content: '-';
  61           margin: 0 3px;
  62         }
  63       }
  64     }
  65
  66     .video-info-privacy {
  67       font-size: 13px;
  68       font-weight: $font-semibold;
  69     }
  70
  71     .video-info-description {
  72       margin-top: 10px;
  73       color: $grey-foreground-color;
  74     }
  75   }
  76 }