client/src/app/header/header.component.scss

   1 @import '_variables';
   2 @import '_mixins';
   3
   4 my-search-typeahead {
   5   margin-right: 15px;
   6 }
   7
   8 #search-video {
   9   @include peertube-input-text($search-input-width);
  10   padding-left: 10px;
  11   padding-right: 40px; // For the search icon
  12   font-size: 14px;
  13
  14   &::placeholder {
  15     color: var(--inputPlaceholderColor);
  16   }
  17 }
  18
  19 .icon.icon-search {
  20   @include icon(25px);
  21   height: 21px;
  22
  23   background-color: var(--mainForegroundColor);
  24   mask: url('../../assets/images/header/search.svg') no-repeat 50% 50%;
  25
  26   // yolo
  27   position: absolute;
  28   margin-left: -35px;
  29   margin-top: 5px;
  30 }
  31
  32 .upload-button {
  33   @include peertube-button-link;
  34   @include orange-button;
  35   @include button-with-icon(22px, 3px, -1px);
  36
  37   color: var(--mainBackgroundColor) !important;
  38   margin-right: 25px;
  39
  40   @media screen and (max-width: 600px) {
  41     margin-right: 10px;
  42     padding: 0 10px;
  43
  44     .icon.icon-upload {
  45       margin-right: 0;
  46     }
  47
  48     .upload-button-label {
  49       display: none;
  50     }
  51   }
  52 }