X-Git-Url: https://git.immae.eu/?a=blobdiff_plain;f=client%2Fsrc%2Fapp%2Fheader%2Fheader.component.scss;h=cea415d9b229001eaeeb91da515d2179caa21a2a;hb=b718fd22374d64534bcfe69932cf562894abed6a;hp=6ce92fc22b9a0443fa1501a622878d7551dbcbe1;hpb=f6eebcb336c067e160a62020a5140d8d992ba384;p=github%2FChocobozzz%2FPeerTube.git diff --git a/client/src/app/header/header.component.scss b/client/src/app/header/header.component.scss index 6ce92fc22..cea415d9b 100644 --- a/client/src/app/header/header.component.scss +++ b/client/src/app/header/header.component.scss @@ -3,11 +3,17 @@ #search-video { @include peertube-input-text($search-input-width); + padding-left: 10px; margin-right: 15px; padding-right: 40px; // For the search icon + font-size: 14px; &::placeholder { - color: #000; + color: var(--inputPlaceholderColor); + } + + &:focus::placeholder { + opacity: 0 !important; } @media screen and (max-width: 800px) { @@ -23,7 +29,8 @@ @include icon(25px); height: 21px; - background-image: url('../../assets/images/header/search.svg'); + background-color: var(--mainForegroundColor); + mask: url('../../assets/images/header/search.svg') no-repeat 50% 50%; // yolo position: absolute; @@ -34,6 +41,7 @@ .upload-button { @include peertube-button-link; @include orange-button; + @include button-with-icon(22px, 3px, -1px); margin-right: 25px; @@ -41,15 +49,6 @@ margin-right: 0; } - .icon.icon-upload { - @include icon(22px); - - background-image: url('../../assets/images/header/upload.svg'); - height: 24px; - vertical-align: middle; - margin-right: 6px; - } - @media screen and (max-width: 600px) { margin-right: 10px; padding: 0 10px;