diff options
Diffstat (limited to 'client/src/app/header')
-rw-r--r-- | client/src/app/header/header.component.scss | 10 | ||||
-rw-r--r-- | client/src/app/header/search-typeahead.component.scss | 13 |
2 files changed, 13 insertions, 10 deletions
diff --git a/client/src/app/header/header.component.scss b/client/src/app/header/header.component.scss index 7364ab50b..45cef7b9a 100644 --- a/client/src/app/header/header.component.scss +++ b/client/src/app/header/header.component.scss | |||
@@ -2,22 +2,22 @@ | |||
2 | @import '_mixins'; | 2 | @import '_mixins'; |
3 | 3 | ||
4 | my-search-typeahead { | 4 | my-search-typeahead { |
5 | margin-right: 15px; | 5 | @include margin-right(15px); |
6 | } | 6 | } |
7 | 7 | ||
8 | .publish-button { | 8 | .publish-button { |
9 | @include peertube-button-link; | 9 | @include peertube-button-link; |
10 | @include orange-button; | 10 | @include orange-button; |
11 | @include button-with-icon(22px, 3px, -1px); | 11 | @include button-with-icon(22px, 3px, -1px); |
12 | 12 | @include margin-right(25px); | |
13 | margin-right: 25px; | ||
14 | 13 | ||
15 | @media screen and (max-width: 600px) { | 14 | @media screen and (max-width: 600px) { |
16 | margin-right: 10px; | 15 | @include margin-right(10px); |
16 | |||
17 | padding: 0 10px; | 17 | padding: 0 10px; |
18 | 18 | ||
19 | .icon.icon-upload { | 19 | .icon.icon-upload { |
20 | margin-right: 0; | 20 | @include margin-right(0); |
21 | } | 21 | } |
22 | 22 | ||
23 | .publish-button-label { | 23 | .publish-button-label { |
diff --git a/client/src/app/header/search-typeahead.component.scss b/client/src/app/header/search-typeahead.component.scss index 3e0350ba0..ed7f3bd65 100644 --- a/client/src/app/header/search-typeahead.component.scss +++ b/client/src/app/header/search-typeahead.component.scss | |||
@@ -6,8 +6,9 @@ | |||
6 | #search-video { | 6 | #search-video { |
7 | @include peertube-input-text($search-input-width); | 7 | @include peertube-input-text($search-input-width); |
8 | 8 | ||
9 | padding-left: 10px; | 9 | @include padding-left(10px); |
10 | padding-right: 40px; // For the search icon | 10 | @include padding-right(40px); // For the search icon |
11 | |||
11 | font-size: 14px; | 12 | font-size: 14px; |
12 | 13 | ||
13 | &::placeholder { | 14 | &::placeholder { |
@@ -17,11 +18,12 @@ | |||
17 | 18 | ||
18 | .icon-search { | 19 | .icon-search { |
19 | @include icon(25px); | 20 | @include icon(25px); |
21 | @include margin-left(-35px); | ||
22 | |||
20 | height: 18px; | 23 | height: 18px; |
21 | 24 | ||
22 | // yolo | 25 | // yolo |
23 | position: absolute; | 26 | position: absolute; |
24 | margin-left: -35px; | ||
25 | margin-top: 3.5px; | 27 | margin-top: 3.5px; |
26 | right: 10px; | 28 | right: 10px; |
27 | } | 29 | } |
@@ -65,8 +67,9 @@ li.suggestion { | |||
65 | margin-bottom: .5rem; | 67 | margin-bottom: .5rem; |
66 | 68 | ||
67 | em { | 69 | em { |
70 | @include margin-right(0.2rem); | ||
71 | |||
68 | font-weight: 600; | 72 | font-weight: 600; |
69 | margin-right: 0.2rem; | ||
70 | font-style: normal; | 73 | font-style: normal; |
71 | } | 74 | } |
72 | } | 75 | } |
@@ -81,7 +84,7 @@ li.suggestion { | |||
81 | } | 84 | } |
82 | 85 | ||
83 | @media screen and (min-width: $mobile-view) { | 86 | @media screen and (min-width: $mobile-view) { |
84 | margin-left: 10px; | 87 | @include margin-left(10px); |
85 | } | 88 | } |
86 | 89 | ||
87 | @media screen and (max-width: $small-view) { | 90 | @media screen and (max-width: $small-view) { |