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

   1 @use '_variables' as *;
   2 @use '_mixins' as *;
   3
   4 .header {
   5   display: flex;
   6   margin-bottom: 1.25rem;
   7
   8   a {
   9     @include button-with-icon(18px, 3px, -1px);
  10   }
  11
  12   button {
  13     @include button-with-icon(20px, 3px, -1px);
  14   }
  15
  16   .peertube-select-container {
  17     @include peertube-select-container(auto);
  18   }
  19 }
  20
  21 @media screen and (max-width: $mobile-view) {
  22   .header {
  23     flex-direction: column;
  24
  25     > :first-child,
  26     .peertube-select-container {
  27       margin-bottom: 15px;
  28     }
  29
  30     .peertube-select-container {
  31       @include margin-left(0 !important);
  32     }
  33   }
  34 }
  35
  36 @media screen and (min-width: $mobile-view) and (max-width: $small-view) {
  37   .header {
  38     a {
  39       font-size: 0;
  40       padding: 0 13px;
  41     }
  42
  43     .peertube-select-container {
  44       width: auto !important;
  45     }
  46   }
  47 }
  48
  49 @media screen and (min-width: $mobile-view) and (max-width: #{$small-view + $menu-width}) {
  50   :host-context(.main-col:not(.expanded)) {
  51     .header {
  52       a {
  53         font-size: 0;
  54         padding: 0 13px;
  55       }
  56
  57       .peertube-select-container {
  58         width: auto !important;
  59       }
  60     }
  61   }
  62 }