client/src/app/+my-library/my-ownership/my-ownership.component.scss

   1 @use 'sass:math';
   2 @use '_miniature' as *;
   3 @use '_mixins' as *;
   4
   5 .chip {
   6   @include chip;
   7 }
   8
   9 .video-table-video {
  10   display: inline-flex;
  11
  12   .video-table-video-image {
  13     $image-height: 45px;
  14
  15     @include miniature-thumbnail;
  16     @include margin-right(0.5rem);
  17
  18     height: $image-height;
  19     width: #{math.div(16, 9) * $image-height};
  20     border-radius: 2px;
  21     border: 0;
  22     background: transparent;
  23     display: inline-flex;
  24     justify-content: center;
  25     align-items: center;
  26     position: relative;
  27
  28     img {
  29       height: 100%;
  30       width: 100%;
  31       border-radius: 2px;
  32     }
  33
  34     span {
  35       color: pvar(--inputPlaceholderColor);
  36     }
  37
  38     .video-table-video-image-label {
  39       @include static-thumbnail-overlay;
  40       position: absolute;
  41       border-radius: 3px;
  42       font-size: 10px;
  43       padding: 0 3px;
  44       line-height: 1.3;
  45       bottom: 2px;
  46       right: 2px;
  47     }
  48   }
  49
  50   .video-table-video-text {
  51     display: inline-flex;
  52     flex-direction: column;
  53     justify-content: center;
  54     font-size: 90%;
  55     color: pvar(--mainForegroundColor);
  56     line-height: 1rem;
  57
  58     div .glyphicon {
  59       @include margin-left(0.1rem);
  60
  61       font-size: 80%;
  62       color: #808080;
  63     }
  64
  65     div + div {
  66       font-size: 80%;
  67     }
  68   }
  69 }