client/src/app/+videos/+video-watch/shared/recommendations/recommended-videos.component.scss

   1 @use '_variables' as *;
   2 @use '_mixins' as *;
   3
   4 .title-page-container {
   5   display: flex;
   6   justify-content: space-between;
   7   align-items: baseline;
   8   margin-bottom: 25px;
   9   flex-wrap: wrap-reverse;
  10
  11   .title-page {
  12     @include margin-right(.5rem !important);
  13
  14     margin-bottom: unset;
  15     margin-top: 0;
  16   }
  17 }
  18
  19 .title-page-autoplay {
  20   @include margin-left(auto);
  21
  22   display: flex;
  23   width: max-content;
  24   height: max-content;
  25   align-items: center;
  26
  27   span {
  28     @include margin-right(0.3rem);
  29
  30     text-transform: uppercase;
  31     font-size: 85%;
  32     font-weight: 600;
  33   }
  34 }
  35
  36 .title-page-next-video-label {
  37   display: block;
  38   margin-bottom: 5px;
  39   font-weight: $font-semibold;
  40 }
  41
  42 hr {
  43   margin-top: 0;
  44 }
  45
  46 my-video-miniature {
  47   display: block;
  48 }
  49
  50 .other-videos:not(.display-as-row) my-video-miniature {
  51   min-width: $video-thumbnail-medium-width;
  52   max-width: $video-thumbnail-medium-width;
  53 }
  54
  55 .display-as-row {
  56   my-video-miniature {
  57     margin-bottom: 20px;
  58   }
  59
  60   hr {
  61     display: none;
  62   }
  63
  64   @media screen and (max-width: $mobile-view) {
  65     my-video-miniature {
  66       margin-bottom: 10px;
  67     }
  68   }
  69 }
  70