client/src/app/+my-library/my-subscriptions/my-subscriptions.component.scss

   1 @import '_variables';
   2 @import '_mixins';
   3
   4 input[type=text] {
   5   @include peertube-input-text(300px);
   6 }
   7
   8 .video-channel {
   9   @include row-blocks;
  10
  11   img {
  12     @include channel-avatar(80px);
  13
  14     margin-right: 10px;
  15   }
  16 }
  17
  18 .video-channel-info {
  19   flex-grow: 1;
  20
  21   a.video-channel-names {
  22     @include disable-default-a-behaviour;
  23
  24     width: fit-content;
  25     display: flex;
  26     align-items: baseline;
  27     color: pvar(--mainForegroundColor);
  28
  29     .video-channel-display-name {
  30       font-weight: $font-semibold;
  31       font-size: 18px;
  32     }
  33
  34     .video-channel-name {
  35       font-size: 14px;
  36       color: $grey-actor-name;
  37       margin-left: 5px;
  38     }
  39   }
  40 }
  41
  42 .actor-owner {
  43   @include actor-owner;
  44
  45   margin-top: 0;
  46 }
  47
  48 .video-subscriptions-header {
  49   margin-bottom: 30px;
  50 }
  51
  52 @media screen and (max-width: $small-view) {
  53   .video-subscriptions-header input[type=text] {
  54     width: 100% !important;
  55   }
  56
  57   .video-channel-info {
  58     padding-bottom: 10px;
  59     text-align: center;
  60
  61     .video-channel-names {
  62       flex-direction: column;
  63       align-items: center !important;
  64       margin: auto;
  65     }
  66   }
  67
  68   img {
  69     margin-right: 0;
  70   }
  71 }