aboutsummaryrefslogtreecommitdiffhomepage
path: root/client/src/app/header
diff options
context:
space:
mode:
Diffstat (limited to 'client/src/app/header')
-rw-r--r--client/src/app/header/search-typeahead.component.scss13
-rw-r--r--client/src/app/header/suggestion.component.scss8
2 files changed, 12 insertions, 9 deletions
diff --git a/client/src/app/header/search-typeahead.component.scss b/client/src/app/header/search-typeahead.component.scss
index c754a99d1..3e0350ba0 100644
--- a/client/src/app/header/search-typeahead.component.scss
+++ b/client/src/app/header/search-typeahead.component.scss
@@ -44,7 +44,8 @@ li.suggestion {
44 44
45 // soft border-radius for the last suggestion and the link inside 45 // soft border-radius for the last suggestion and the link inside
46 &:last-of-type { 46 &:last-of-type {
47 &, & ::ng-deep a { 47 &,
48 ::ng-deep a {
48 border-bottom-right-radius: 3px; 49 border-bottom-right-radius: 3px;
49 border-bottom-left-radius: 3px; 50 border-bottom-left-radius: 3px;
50 } 51 }
@@ -74,7 +75,7 @@ li.suggestion {
74#typeahead-container { 75#typeahead-container {
75 input { 76 input {
76 border: 1px solid pvar(--mainBackgroundColor) !important; 77 border: 1px solid pvar(--mainBackgroundColor) !important;
77 box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 20px 0px; 78 box-shadow: rgba(0, 0, 0, 0.1) 0 1px 20px 0;
78 flex-grow: 1; 79 flex-grow: 1;
79 transition: box-shadow .3s ease, width .2s ease; 80 transition: box-shadow .3s ease, width .2s ease;
80 } 81 }
@@ -95,7 +96,7 @@ li.suggestion {
95 right: 10px; 96 right: 10px;
96 } 97 }
97 98
98 & > div:last-child { 99 > div:last-child {
99 // we have to switch the display and not the opacity, 100 // we have to switch the display and not the opacity,
100 // to avoid clashing with the rest of the interface. 101 // to avoid clashing with the rest of the interface.
101 display: none; 102 display: none;
@@ -103,7 +104,7 @@ li.suggestion {
103 104
104 &:focus, 105 &:focus,
105 ::ng-deep &:focus-within { 106 ::ng-deep &:focus-within {
106 & > div:last-child { 107 > div:last-child {
107 @media screen and (min-width: $mobile-view) { 108 @media screen and (min-width: $mobile-view) {
108 display: initial !important; 109 display: initial !important;
109 } 110 }
@@ -111,12 +112,12 @@ li.suggestion {
111 #typeahead-help, 112 #typeahead-help,
112 #typeahead-instructions, 113 #typeahead-instructions,
113 li.suggestion { 114 li.suggestion {
114 box-shadow: rgba(0, 0, 0, 0.2) 0px 10px 20px -5px; 115 box-shadow: rgba(0, 0, 0, 0.2) 0 10px 20px -5px;
115 } 116 }
116 } 117 }
117 118
118 ::ng-deep input { 119 ::ng-deep input {
119 box-shadow: rgba(0, 0, 0, 0.2) 0px 1px 20px 0px; 120 box-shadow: rgba(0, 0, 0, 0.2) 0 1px 20px 0;
120 border-end-start-radius: 0; 121 border-end-start-radius: 0;
121 border-end-end-radius: 0; 122 border-end-end-radius: 0;
122 123
diff --git a/client/src/app/header/suggestion.component.scss b/client/src/app/header/suggestion.component.scss
index 692a81daa..9163de0b1 100644
--- a/client/src/app/header/suggestion.component.scss
+++ b/client/src/app/header/suggestion.component.scss
@@ -2,9 +2,11 @@
2 2
3a { 3a {
4 @include disable-default-a-behaviour; 4 @include disable-default-a-behaviour;
5
5 width: 100%; 6 width: 100%;
6 7
7 &, &:hover { 8 &,
9 &:hover {
8 color: pvar(--mainForegroundColor); 10 color: pvar(--mainForegroundColor);
9 11
10 &.focus-visible { 12 &.focus-visible {
@@ -23,10 +25,10 @@ a {
23} 25}
24 26
25my-global-icon { 27my-global-icon {
28 @include apply-svg-color(pvar(--mainForegroundColor));
29
26 width: 17px; 30 width: 17px;
27 position: relative; 31 position: relative;
28 top: -2px; 32 top: -2px;
29 margin: 5px; 33 margin: 5px;
30
31 @include apply-svg-color(pvar(--mainForegroundColor));
32} 34}