diff options
author | 2018-07-05 02:37:43 -0300 | |
---|---|---|
committer | 2018-07-05 02:37:43 -0300 | |
commit | 25c6cbd29aff90f694d72afe28ab56b0113fb16a (patch) | |
tree | 9907623b3a7b835e58b895d08b62c5339b8e0376 /src/styles/searchInput.scss | |
parent | 5.0.0 beta.18 (diff) | |
download | ferdium-app-25c6cbd29aff90f694d72afe28ab56b0113fb16a.tar.gz ferdium-app-25c6cbd29aff90f694d72afe28ab56b0113fb16a.tar.zst ferdium-app-25c6cbd29aff90f694d72afe28ab56b0113fb16a.zip |
Update stylesheets and added darkMode variable and toggle.
Diffstat (limited to 'src/styles/searchInput.scss')
-rw-r--r-- | src/styles/searchInput.scss | 30 |
1 files changed, 21 insertions, 9 deletions
diff --git a/src/styles/searchInput.scss b/src/styles/searchInput.scss index 633a31e09..32b9da065 100644 --- a/src/styles/searchInput.scss +++ b/src/styles/searchInput.scss | |||
@@ -1,20 +1,32 @@ | |||
1 | @import './config.scss'; | ||
2 | @import './mixins.scss'; | ||
3 | |||
4 | .theme__dark .search-input { | ||
5 | @extend %headline__dark; | ||
6 | background: $dark-theme-gray-dark; | ||
7 | border: 1px solid $dark-theme-gray-light; | ||
8 | border-radius: $theme-border-radius; | ||
9 | color: $dark-theme-gray-lightest; | ||
10 | |||
11 | input { color: $dark-theme-gray-lightest; } | ||
12 | } | ||
13 | |||
1 | .search-input { | 14 | .search-input { |
2 | width: 100%; | 15 | @extend %headline; |
3 | height: auto; | ||
4 | display: flex; | ||
5 | align-items: center; | 16 | align-items: center; |
6 | padding: 0 10px; | ||
7 | border-radius: 30px; | ||
8 | background: $theme-gray-lightest; | 17 | background: $theme-gray-lightest; |
9 | padding: 5px 10px; | 18 | border-radius: 30px; |
10 | @extend %headline; | ||
11 | color: $theme-gray-light; | 19 | color: $theme-gray-light; |
20 | display: flex; | ||
21 | height: auto; | ||
22 | padding: 5px 10px; | ||
23 | width: 100%; | ||
12 | 24 | ||
13 | input { | 25 | input { |
14 | padding-left: 10px; | ||
15 | background: none; | 26 | background: none; |
16 | border: 0; | 27 | border: 0; |
17 | flex: 1; | ||
18 | color: $theme-gray-light; | 28 | color: $theme-gray-light; |
29 | flex: 1; | ||
30 | padding-left: 10px; | ||
19 | } | 31 | } |
20 | } | 32 | } |