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

   1 @import '_variables';
   2 @import '_mixins';
   3
   4 .no-history {
   5   display: flex;
   6   justify-content: center;
   7   margin-top: 50px;
   8   font-weight: $font-semibold;
   9   font-size: 16px;
  10 }
  11
  12 .top-buttons {
  13   margin-bottom: 30px;
  14   display: flex;
  15   align-items: center;
  16   flex-wrap: wrap;
  17
  18   #history-search {
  19     @include peertube-input-text(250px);
  20   }
  21
  22   .history-switch {
  23     display: flex;
  24
  25     label {
  26       margin: 0 0 0 5px;
  27       color: var(--greyForegroundColor);
  28       font-size: 15px;
  29       font-weight: $font-semibold;
  30     }
  31   }
  32
  33   .delete-history {
  34     @include peertube-button;
  35     @include grey-button;
  36     @include button-with-icon;
  37
  38     font-size: 15px;
  39   }
  40 }
  41
  42 .video {
  43   @include row-blocks;
  44
  45   .my-video-miniature {
  46     flex-grow: 1;
  47   }
  48 }
  49
  50 @media screen and (max-width: $mobile-view) {
  51   .top-buttons {
  52     .history-switch label, .delete-history {
  53       @include ellipsis;
  54     }
  55
  56     .history-switch label {
  57       width: 60%;
  58     }
  59
  60     .delete-history {
  61       margin-left: auto;
  62       max-width: 32%;
  63     }
  64   }
  65 }