From 0e6c020975270c39d6bfa80a733d342df5fdebd1 Mon Sep 17 00:00:00 2001 From: Alexandar Mechev Date: Sat, 17 Oct 2020 13:35:51 +0200 Subject: [PATCH] adds almsot working dark mode --- app/filter.py | 6 +++++- app/static/css/themes/nord.css | 35 +++++++++++++++++++++++++------ app/static/css/themes/whoogle.css | 4 ++++ app/templates/display.html | 6 +++--- app/templates/index.html | 4 ++-- 5 files changed, 43 insertions(+), 12 deletions(-) diff --git a/app/filter.py b/app/filter.py index e870e90..b0c730b 100644 --- a/app/filter.py +++ b/app/filter.py @@ -54,7 +54,11 @@ class Filter: result = {'background-color':'fff'} if self.theme: sheet = cssutils.parseString(self.get_theme_file()) - reskin_selector = [i for i in sheet if i.selectorText=='.reskin'] + if self.dark: + selector_name = ".reskin-dark" + else: + selector_name = ".reskin" + reskin_selector = [i for i in sheet if i.selectorText==selector_name] if len(reskin_selector) == 0: return result for css_prop in reskin_selector[0].style: diff --git a/app/static/css/themes/nord.css b/app/static/css/themes/nord.css index fa80c99..0026a51 100644 --- a/app/static/css/themes/nord.css +++ b/app/static/css/themes/nord.css @@ -2,9 +2,22 @@ html { background-color: #D8DEE9b3 !important; } +html.dark { + background-color: #292E39 !important; + color: #ECEFF4 !important; +} + +body.dark { + background-color: #292E39 !important; + color: #ECEFF4 !important; +} + div { - /*background-color: #D8DEE9b3 !important;*/ - color: #3B4252 !important; + color: #3B4252 +} + +div.dark { + color: #ECEFF4 !important; } a:visited h3 div { @@ -20,7 +33,7 @@ a:link div { } div span { - color: #3B4252 !important; + color: #3B4252; } input { @@ -30,7 +43,7 @@ input { #search-bar { color: #4C566A !important; - background-color: #ffffff !important; + background-color: #ffffff ; } footer { @@ -38,7 +51,17 @@ footer { color: #3B4252; } -.reskin { - background-color: #ECEFF4; +footer.dark { + background-color: #ECEFF4 !important; color: #3B4252; +} + +.reskin { + background-color: #292E39; + color: #ECEFF4; +} + +.reskin-dark { + background-color: #2E3440; + color: #ECEFF4; } \ No newline at end of file diff --git a/app/static/css/themes/whoogle.css b/app/static/css/themes/whoogle.css index e69de29..396f4f9 100644 --- a/app/static/css/themes/whoogle.css +++ b/app/static/css/themes/whoogle.css @@ -0,0 +1,4 @@ +.reskin { + background-color: #fff; + color: #333; +} \ No newline at end of file diff --git a/app/templates/display.html b/app/templates/display.html index 6d63e23..2386597 100644 --- a/app/templates/display.html +++ b/app/templates/display.html @@ -1,4 +1,4 @@ - + @@ -16,11 +16,11 @@ {{ query }} - Whoogle Search - + {{ search_header|safe }} {{ response|safe }} -