client/src/app/+my-account/my-account-history/my-account-history.component.scss

   1 @import '_variables';
   2 @import '_mixins';
   3
   4 .video {
   5   @include row-blocks;
   6
   7   my-video-thumbnail {
   8     margin-right: 10px;
   9   }
  10
  11   .video-info {
  12     flex-grow: 1;
  13
  14     .video-info-name {
  15       @include disable-default-a-behaviour;
  16
  17       color: var(--mainForegroundColor);
  18       display: block;
  19       width: fit-content;
  20       font-size: 18px;
  21       font-weight: $font-semibold;
  22     }
  23
  24     .video-info-date-views {
  25       font-size: 14px;
  26     }
  27
  28     .video-info-account {
  29       @include disable-default-a-behaviour;
  30
  31       display: block;
  32       width: fit-content;
  33       overflow: hidden;
  34       text-overflow: ellipsis;
  35       white-space: nowrap;
  36       font-size: 14px;
  37       color: #585858;
  38
  39       &:hover {
  40         color: #303030;
  41       }
  42     }
  43   }
  44 }
  45
  46 @media screen and (max-width: $small-view) {
  47   .video {
  48     flex-direction: column;
  49     height: auto;
  50     text-align: center;
  51
  52     .video-info-name {
  53       margin: auto;
  54     }
  55
  56     input[type=checkbox] {
  57       display: none;
  58     }
  59
  60     my-video-thumbnail {
  61       margin-right: 0;
  62     }
  63
  64     .video-buttons {
  65       margin-top: 10px;
  66     }
  67   }
  68 }