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

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