X-Git-Url: https://git.immae.eu/?a=blobdiff_plain;f=client%2Fsrc%2Fapp%2Fheader%2Fsearch-typeahead.component.scss;h=3e0350ba0b7184d11bbf963adbb547d94b1184cc;hb=ad35265d743e621d86f3f0796dd9d8795c599dca;hp=f8d68e9867565b74699bee768588df6d46de5641;hpb=5d666c0eb25a1b665caa46c4210c1dc2a6b5b333;p=github%2FChocobozzz%2FPeerTube.git diff --git a/client/src/app/header/search-typeahead.component.scss b/client/src/app/header/search-typeahead.component.scss index f8d68e986..3e0350ba0 100644 --- a/client/src/app/header/search-typeahead.component.scss +++ b/client/src/app/header/search-typeahead.component.scss @@ -5,6 +5,7 @@ #search-video { @include peertube-input-text($search-input-width); + padding-left: 10px; padding-right: 40px; // For the search icon font-size: 14px; @@ -14,7 +15,7 @@ } } -.icon.icon-search { +.icon-search { @include icon(25px); height: 18px; @@ -43,7 +44,8 @@ li.suggestion { // soft border-radius for the last suggestion and the link inside &:last-of-type { - &, & ::ng-deep a { + &, + ::ng-deep a { border-bottom-right-radius: 3px; border-bottom-left-radius: 3px; } @@ -73,7 +75,7 @@ li.suggestion { #typeahead-container { input { border: 1px solid pvar(--mainBackgroundColor) !important; - box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 20px 0px; + box-shadow: rgba(0, 0, 0, 0.1) 0 1px 20px 0; flex-grow: 1; transition: box-shadow .3s ease, width .2s ease; } @@ -86,7 +88,7 @@ li.suggestion { flex: 1; input { - width: unset; + width: 70px; } } @@ -94,7 +96,7 @@ li.suggestion { right: 10px; } - & > div:last-child { + > div:last-child { // we have to switch the display and not the opacity, // to avoid clashing with the rest of the interface. display: none; @@ -102,7 +104,7 @@ li.suggestion { &:focus, ::ng-deep &:focus-within { - & > div:last-child { + > div:last-child { @media screen and (min-width: $mobile-view) { display: initial !important; } @@ -110,12 +112,12 @@ li.suggestion { #typeahead-help, #typeahead-instructions, li.suggestion { - box-shadow: rgba(0, 0, 0, 0.2) 0px 10px 20px -5px; + box-shadow: rgba(0, 0, 0, 0.2) 0 10px 20px -5px; } } ::ng-deep input { - box-shadow: rgba(0, 0, 0, 0.2) 0px 1px 20px 0px; + box-shadow: rgba(0, 0, 0, 0.2) 0 1px 20px 0; border-end-start-radius: 0; border-end-end-radius: 0;