client/src/app/videos/video-list/video-overview.component.scss

   1 @import '_variables';
   2 @import '_mixins';
   3 @import '_miniature';
   4
   5 .section {
   6   max-height: 500px; // 2 rows max
   7   overflow: hidden;
   8   padding-top: 10px;
   9
  10   &:first-child {
  11     padding-top: 30px;
  12   }
  13
  14   my-video-miniature {
  15     text-align: left;
  16   }
  17 }
  18
  19 .section-title {
  20   font-size: 24px;
  21   font-weight: $font-semibold;
  22   margin-bottom: 10px;
  23
  24   a {
  25     &:hover, &:focus:not(.focus-visible), &:active {
  26       text-decoration: none;
  27       outline: none;
  28     }
  29
  30     color: var(--mainForegroundColor);
  31   }
  32 }
  33
  34 .channel {
  35   .section-title a {
  36     display: flex;
  37     width: fit-content;
  38     align-items: center;
  39
  40     img {
  41       @include avatar(28px);
  42
  43       margin-right: 8px;
  44     }
  45   }
  46 }
  47
  48 @media screen and (max-width: 500px) {
  49   .margin-content {
  50     margin: 0 !important;
  51   }
  52
  53   .section-title {
  54     font-size: 17px;
  55   }
  56
  57   .section {
  58     max-height: initial;
  59     overflow: initial;
  60
  61     @include video-miniature-small-screen;
  62   }
  63 }