adds almsot working dark mode

This commit is contained in:
Alexandar Mechev 2020-10-17 13:35:51 +02:00
parent eb809a1608
commit 0e6c020975
No known key found for this signature in database
GPG Key ID: 1B754EA636091772
5 changed files with 43 additions and 12 deletions

View File

@ -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:

View File

@ -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;
}

View File

@ -0,0 +1,4 @@
.reskin {
background-color: #fff;
color: #333;
}

View File

@ -1,4 +1,4 @@
<html>
<html class="{{ 'dark' if dark_mode else '' }}">
<head>
<link rel="shortcut icon" href="/static/img/favicon.ico" type="image/x-icon">
<link rel="icon" href="/static/img/favicon.ico" type="image/x-icon">
@ -16,11 +16,11 @@
<link rel="stylesheet" href="/static/css/header.css">
<title>{{ query }} - Whoogle Search</title>
</head>
<body>
<body class="{{ 'dark' if dark_mode else '' }}">
{{ search_header|safe }}
{{ response|safe }}
</body>
<footer>
<footer class="{{ 'dark' if dark_mode else '' }}">
<p>
Whoogle Search v{{ version_number }} ||
<a style="color: #685e79" href="https://github.com/benbusby/whoogle-search">View on GitHub</a>

View File

@ -1,4 +1,4 @@
<html>
<html class="{{ 'dark' if config['dark'] else '' }}">
<head>
<link rel="apple-touch-icon" sizes="57x57" href="/static/img/favicon/apple-icon-57x57.png">
<link rel="apple-touch-icon" sizes="60x60" href="/static/img/favicon/apple-icon-60x60.png">
@ -35,7 +35,7 @@
<title>Whoogle Search</title>
</head>
<body id="main" style="display: none;">
<body class="{{ 'dark' if config['dark'] else '' }}" id="main" style="display: none;">
<div class="search-container">
<img class="logo" src="/static/img/logo.png">
<form id="search-form" action="/search" method="{{ 'get' if config.get_only else 'post' }}">