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