From 72a006ccfb22ec66cc58b7920e88f300885291a6 Mon Sep 17 00:00:00 2001 From: Alexandar Mechev Date: Sun, 18 Oct 2020 12:39:01 +0200 Subject: [PATCH] More tweaks to css.. delegating search-bar style to .css --- app/static/css/themes/nord-search.css | 15 +++++++++++++ app/static/css/themes/nord.css | 28 +++++++++++++++++++----- app/static/css/themes/whoogle-search.css | 18 +++++++++++++++ app/static/css/themes/whoogle.css | 22 +++++++++++++++++++ app/templates/header.html | 8 ++----- 5 files changed, 80 insertions(+), 11 deletions(-) diff --git a/app/static/css/themes/nord-search.css b/app/static/css/themes/nord-search.css index 78a1b3c..10438d5 100644 --- a/app/static/css/themes/nord-search.css +++ b/app/static/css/themes/nord-search.css @@ -25,6 +25,21 @@ border-bottom: 1px solid #242424; } +body.dark * div#search-bar-autocomplete-list div{ + padding: 10px; + cursor: pointer; + color: #ECEFF4 !important; + background-color: #3B4252 !important; + border-bottom: 1px solid #fff; +} + +body.dark * div#search-bar-autocomplete-list div:hover { + background-color: #4C566A !important; + color: #ECEFF4 !important; +} + + + .autocomplete-items div:hover { background-color: #4C566A !important; color: #ECEFF4 !important; diff --git a/app/static/css/themes/nord.css b/app/static/css/themes/nord.css index a75356c..ff55133 100644 --- a/app/static/css/themes/nord.css +++ b/app/static/css/themes/nord.css @@ -25,6 +25,10 @@ a:visited h3 div { color: #A3BE8C !important; } +body.dark * a:visited h3 div{ + color: #A3BE8C !important; +} + a:link h3 div { color: #4C566A } @@ -33,12 +37,12 @@ a:link div { color: #81a1c1 !important; } -div span { - color: #3B4252; +div span.dark { + color: #f9fafb !important; } -div span.dark { - color: #f9fafb; +div span { + color: #3B4252; } input { @@ -46,8 +50,22 @@ input { color: #3B4252 !important; } +body.dark * input { + background-color: #4C566A !important; + color: #f9fafb !important; +} + +body.dark * #search-bar { + width: 100%; + border: 1px solid #e9e9e9; + color: #f9fafb; + background-color: #4C566A; + +} + + #search-bar { - color: #4C566A !important; + color: #4C566A; background-color: #ffffff ; } diff --git a/app/static/css/themes/whoogle-search.css b/app/static/css/themes/whoogle-search.css index a79522b..5cb57ef 100644 --- a/app/static/css/themes/whoogle-search.css +++ b/app/static/css/themes/whoogle-search.css @@ -24,6 +24,24 @@ border-bottom: 1px solid #d4d4d4; } +body.dark * div#search-bar-autocomplete-list div{ + padding: 10px; + cursor: pointer; + color: #ddd; + background-color: #000; + border-bottom: 1px solid #fff; +} + +body.dark * div#search-bar-autocomplete-list div:hover { + background-color: #222; +} + +body.dark * #search-bar { + width: 100%; + border: 3px solid #e9e9e9; + color: #fff; + +} .autocomplete-items div:hover { background-color: #e9e9e9; } diff --git a/app/static/css/themes/whoogle.css b/app/static/css/themes/whoogle.css index 396f4f9..8baaad8 100644 --- a/app/static/css/themes/whoogle.css +++ b/app/static/css/themes/whoogle.css @@ -1,4 +1,26 @@ +html.dark { + background-color: #222 !important; +} + +body.dark { + background-color: #222 !important; +} + +body.dark>#search-bar-autocomplete-list div{ + padding: 10px; + cursor: pointer; + color: #ddd; + background-color: #000; + border-bottom: 1px solid #fff; +} + + .reskin { background-color: #fff; color: #333; +} + +.reskin-dark { + background-color: #000; + color: #fff; } \ No newline at end of file diff --git a/app/templates/header.html b/app/templates/header.html index 53bc35e..e8f065d 100644 --- a/app/templates/header.html +++ b/app/templates/header.html @@ -12,9 +12,7 @@
@@ -38,9 +36,7 @@
+ style="border: {{ '1px solid #685e79' if dark_mode else '' }}">