nakidai
/
whoogle-search
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Expand custom css theming support 

Also adds new default dark theme designed by @gripped.
main
Ben Busby 2021-04-09 11:00:02 -04:00
parent 13abb0ae7f
commit 1030118d0b
No known key found for this signature in database
GPG Key ID: 3B08611DF6E62ED2
8 changed files with 28 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
app/filter.py
View File

@ -153,7 +153,9 @@ class Filter:
if src.startswith(LOGO_URL): if src.startswith(LOGO_URL):
# Re-brand with Whoogle logo # Re-brand with Whoogle logo
element.replace_with(BeautifulSoup(render_template('logo.html'))) element.replace_with(BeautifulSoup(
render_template('logo.html', dark=self.dark),
features='html.parser'))
return return
elif src.startswith(GOOG_IMG) or GOOG_STATIC in src: elif src.startswith(GOOG_IMG) or GOOG_STATIC in src:
element['src'] = BLANK_B64 element['src'] = BLANK_B64
@ -164,7 +166,6 @@ class Filter:
is_element=True) + '&type=' + urlparse.quote(mime) is_element=True) + '&type=' + urlparse.quote(mime)
def update_styling(self, soup) -> None: def update_styling(self, soup) -> None:
""""""
# Remove unnecessary button(s) # Remove unnecessary button(s)
for button in soup.find_all('button'): for button in soup.find_all('button'):
button.decompose() button.decompose()

4
app/routes.py
View File

@ -128,7 +128,7 @@ def index():
countries=app.config['COUNTRIES'], countries=app.config['COUNTRIES'],
logo=render_template( logo=render_template(
'logo.html', 'logo.html',
config=g.user_config), dark=g.user_config.dark),
config=g.user_config, config=g.user_config,
tor_available=int(os.environ.get('TOR_AVAILABLE')), tor_available=int(os.environ.get('TOR_AVAILABLE')),
version_number=app.config['VERSION_NUMBER']) version_number=app.config['VERSION_NUMBER'])
@ -227,7 +227,7 @@ def search():
search_header=(render_template( search_header=(render_template(
'header.html', 'header.html',
config=g.user_config, config=g.user_config,
logo=render_template('logo.html'), logo=render_template('logo.html', dark=g.user_config.dark),
query=urlparse.unquote(query), query=urlparse.unquote(query),
search_type=search_util.search_type, search_type=search_util.search_type,
mobile=g.user_request.mobile) mobile=g.user_request.mobile)

8
app/static/css/dark-theme.css
View File

@ -90,11 +90,11 @@ select {
} }
.collapsible { .collapsible {
color: var(--whoogle-dark-element-bg) !important; color: var(--whoogle-dark-text);
} }
.collapsible:after { .collapsible:after {
color: var(--whoogle-dark-element-bg) !important; color: var(--whoogle-dark-text);
} }
.active { .active {
@ -108,11 +108,11 @@ select {
} }
.active:after { .active:after {
color: var(--whoogle-dark-contrast-text); color: var(--whoogle-dark-contrast-text) !important;
} }
#gh-link { #gh-link {
color: var(--whoogle-dark-element-bg); color: var(--whoogle-dark-contrast-text);
} }
.autocomplete-items { .autocomplete-items {

4
app/static/css/light-theme.css
View File

@ -86,11 +86,11 @@ input {
} }
.collapsible { .collapsible {
color: var(--whoogle-element-bg) !important; color: var(--whoogle-text) !important;
} }
.collapsible:after { .collapsible:after {
color: var(--whoogle-element-bg) !important; color: var(--whoogle-text);
} }
.active { .active {

20
app/static/css/variables.css
View File

@ -13,14 +13,14 @@
--whoogle-result-visited: #4b11a8; --whoogle-result-visited: #4b11a8;
/* DARK THEME COLORS */ /* DARK THEME COLORS */
--whoogle-dark-logo: #685e79; --whoogle-dark-logo: #888888;
--whoogle-dark-page-bg: #222222; --whoogle-dark-page-bg: #080808;
--whoogle-dark-element-bg: #685e79; --whoogle-dark-element-bg: #111111;
--whoogle-dark-text: #ffffff; --whoogle-dark-text: #dddddd;
--whoogle-dark-contrast-text: #000000; --whoogle-dark-contrast-text: #aaaaaa;
--whoogle-dark-secondary-text: #bbbbbb; --whoogle-dark-secondary-text: #8a8b8c;
--whoogle-dark-result-bg: #000000; --whoogle-dark-result-bg: #111111;
--whoogle-dark-result-title: #1967d2; --whoogle-dark-result-title: #dddddd;
--whoogle-dark-result-url: #4b11a8; --whoogle-dark-result-url: #eceff4;
--whoogle-dark-result-visited: #bbbbff; --whoogle-dark-result-visited: #959595;
} }

4
app/templates/display.html
View File

@ -17,9 +17,9 @@
{{ response|safe }} {{ response|safe }}
</body> </body>
<footer> <footer>
<p style="color: {{ '#fff' if config.dark else '#000' }};"> <p style="color: {{ 'var(--whoogle-dark-text)' if config.dark else 'var(--whoogle-text)' }};">
Whoogle Search v{{ version_number }} || Whoogle Search v{{ version_number }} ||
<a style="color: #685e79" href="https://github.com/benbusby/whoogle-search">View on GitHub</a> <a id="gh-link" href="https://github.com/benbusby/whoogle-search">View on GitHub</a>
</p> </p>
</footer> </footer>
<script src="static/js/autocomplete.js"></script> <script src="static/js/autocomplete.js"></script>

2
app/templates/index.html
View File

@ -144,7 +144,7 @@
</div> </div>
</div> </div>
<footer> <footer>
<p style="color: {{ '#fff' if config.dark else '#000' }};"> <p style="color: {{ 'var(--whoogle-dark-text)' if config.dark else 'var(--whoogle-text)' }};">
Whoogle Search v{{ version_number }} || Whoogle Search v{{ version_number }} ||
<a id="gh-link" href="https://github.com/benbusby/whoogle-search">View on GitHub</a> <a id="gh-link" href="https://github.com/benbusby/whoogle-search">View on GitHub</a>
</p> </p>

2
app/templates/logo.html
View File

@ -2,7 +2,7 @@
<svg id="Layer_1" class="whoogle-svg" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1028 254"> <svg id="Layer_1" class="whoogle-svg" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1028 254">
<style> <style>
path { path {
fill: {{ 'var(--whoogle-dark-logo)' if config.dark else 'var(--whoogle-logo)' }}; fill: {{ 'var(--whoogle-dark-logo)' if dark else 'var(--whoogle-logo)' }};
} }
</style> </style>
<defs> <defs>