mirror of
https://github.com/searxng/searxng.git
synced 2024-11-22 12:10:11 +01:00
[enh] simple theme: add "simple-style" preferences
This commit is contained in:
parent
f6bfc8f461
commit
ec5a82fccd
@ -393,7 +393,13 @@ class Preferences:
|
|||||||
'oscar-style': EnumStringSetting(
|
'oscar-style': EnumStringSetting(
|
||||||
settings['ui']['theme_args']['oscar_style'],
|
settings['ui']['theme_args']['oscar_style'],
|
||||||
is_locked('oscar-style'),
|
is_locked('oscar-style'),
|
||||||
choices=['', 'logicodev', 'logicodev-dark', 'pointhi']),
|
choices=['', 'logicodev', 'logicodev-dark', 'pointhi']
|
||||||
|
),
|
||||||
|
'simple_style': EnumStringSetting(
|
||||||
|
settings['ui']['theme_args']['simple_style'],
|
||||||
|
is_locked('simple_style'),
|
||||||
|
choices=['', 'auto', 'light', 'dark']
|
||||||
|
),
|
||||||
'advanced_search': MapSetting(
|
'advanced_search': MapSetting(
|
||||||
settings['ui']['advanced_search'],
|
settings['ui']['advanced_search'],
|
||||||
is_locked('advanced_search'),
|
is_locked('advanced_search'),
|
||||||
|
@ -74,6 +74,8 @@ ui:
|
|||||||
theme_args:
|
theme_args:
|
||||||
# default style of oscar
|
# default style of oscar
|
||||||
oscar_style: logicodev
|
oscar_style: logicodev
|
||||||
|
# style of simple theme: auto, light, dark
|
||||||
|
simple_style: auto
|
||||||
# Open result links in a new tab by default
|
# Open result links in a new tab by default
|
||||||
# results_on_new_tab: false
|
# results_on_new_tab: false
|
||||||
# categories_order :
|
# categories_order :
|
||||||
|
@ -19,6 +19,7 @@ logger = logging.getLogger('searx')
|
|||||||
OUTPUT_FORMATS = ['html', 'csv', 'json', 'rss']
|
OUTPUT_FORMATS = ['html', 'csv', 'json', 'rss']
|
||||||
LANGUAGE_CODES = ['all'] + list(l[0] for l in languages)
|
LANGUAGE_CODES = ['all'] + list(l[0] for l in languages)
|
||||||
OSCAR_STYLE = ('logicodev', 'logicodev-dark', 'pointhi')
|
OSCAR_STYLE = ('logicodev', 'logicodev-dark', 'pointhi')
|
||||||
|
SIMPLE_STYLE = ('auto', 'light', 'dark')
|
||||||
CATEGORY_ORDER = [
|
CATEGORY_ORDER = [
|
||||||
'general',
|
'general',
|
||||||
'images',
|
'images',
|
||||||
@ -183,6 +184,7 @@ SCHEMA = {
|
|||||||
'default_locale': SettingsValue(str, ''),
|
'default_locale': SettingsValue(str, ''),
|
||||||
'theme_args': {
|
'theme_args': {
|
||||||
'oscar_style': SettingsValue(OSCAR_STYLE, 'logicodev'),
|
'oscar_style': SettingsValue(OSCAR_STYLE, 'logicodev'),
|
||||||
|
'simple_style': SettingsValue(SIMPLE_STYLE, 'auto'),
|
||||||
},
|
},
|
||||||
'results_on_new_tab': SettingsValue(bool, False),
|
'results_on_new_tab': SettingsValue(bool, False),
|
||||||
'advanced_search': SettingsValue(bool, False),
|
'advanced_search': SettingsValue(bool, False),
|
||||||
|
@ -27,5 +27,10 @@
|
|||||||
};
|
};
|
||||||
|
|
||||||
// update the css
|
// update the css
|
||||||
d.getElementsByTagName("html")[0].className = (w.searxng.touch)?"js touch":"js";
|
var hmtlElement = d.getElementsByTagName("html")[0];
|
||||||
|
hmtlElement.classList.remove('no-js');
|
||||||
|
hmtlElement.classList.add('js');
|
||||||
|
if (w.searxng.touch) {
|
||||||
|
hmtlElement.classList.add('touch');
|
||||||
|
}
|
||||||
})(window, document);
|
})(window, document);
|
@ -106,9 +106,7 @@
|
|||||||
--color-toolkit-loader-borderleft: rgba(255, 255, 255, 0);
|
--color-toolkit-loader-borderleft: rgba(255, 255, 255, 0);
|
||||||
}
|
}
|
||||||
|
|
||||||
/// Dark Theme (autoswitch based on device pref)
|
.dark-themes() {
|
||||||
@media (prefers-color-scheme: dark) {
|
|
||||||
:root {
|
|
||||||
/// Base Colors
|
/// Base Colors
|
||||||
--color-base-font: #bbb;
|
--color-base-font: #bbb;
|
||||||
--color-base-font-rgb: 187, 187, 187;
|
--color-base-font-rgb: 187, 187, 187;
|
||||||
@ -207,9 +205,20 @@
|
|||||||
--color-toolkit-engine-tooltip-background: #222;
|
--color-toolkit-engine-tooltip-background: #222;
|
||||||
--color-toolkit-loader-border: rgba(255, 255, 255, 0.2);
|
--color-toolkit-loader-border: rgba(255, 255, 255, 0.2);
|
||||||
--color-toolkit-loader-borderleft: rgba(0, 0, 0, 0);
|
--color-toolkit-loader-borderleft: rgba(0, 0, 0, 0);
|
||||||
|
}
|
||||||
|
|
||||||
|
/// Dark Theme (autoswitch based on device pref)
|
||||||
|
@media (prefers-color-scheme: dark) {
|
||||||
|
:root.theme-auto {
|
||||||
|
.dark-themes();
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Dark Theme by preferences
|
||||||
|
:root.theme-dark {
|
||||||
|
.dark-themes();
|
||||||
|
}
|
||||||
|
|
||||||
/// General Size
|
/// General Size
|
||||||
@results-width: 45rem;
|
@results-width: 45rem;
|
||||||
@results-offset: 10rem;
|
@results-offset: 10rem;
|
||||||
|
@ -333,10 +333,15 @@ select {
|
|||||||
}
|
}
|
||||||
|
|
||||||
@media (prefers-color-scheme: dark) {
|
@media (prefers-color-scheme: dark) {
|
||||||
select {
|
html.theme-auto select,
|
||||||
|
html.theme-dark select {
|
||||||
background-image: data-uri('image/svg+xml;charset=UTF-8', @select-dark-svg-path);
|
background-image: data-uri('image/svg+xml;charset=UTF-8', @select-dark-svg-path);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
html.theme-dark select {
|
||||||
|
background-image: data-uri('image/svg+xml;charset=UTF-8', @select-dark-svg-path);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
/* -- checkbox-onoff -- */
|
/* -- checkbox-onoff -- */
|
||||||
|
@ -1,5 +1,5 @@
|
|||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html class="no-js" lang="{{ locale_rfc5646 }}" {% if rtl %} dir="rtl"{% endif %}>
|
<html class="no-js theme-{{ preferences.get_value('simple_style') or 'auto' }}" lang="{{ locale_rfc5646 }}" {% if rtl %} dir="rtl"{% endif %}>
|
||||||
<head>
|
<head>
|
||||||
<meta charset="UTF-8" />
|
<meta charset="UTF-8" />
|
||||||
<meta name="description" content="SearXNG — a privacy-respecting, hackable metasearch engine">
|
<meta name="description" content="SearXNG — a privacy-respecting, hackable metasearch engine">
|
||||||
|
@ -204,6 +204,17 @@
|
|||||||
</p>
|
</p>
|
||||||
<div class="description">{{ _('Change SearXNG layout') }}</div>
|
<div class="description">{{ _('Change SearXNG layout') }}</div>
|
||||||
</fieldset>
|
</fieldset>
|
||||||
|
<fieldset>
|
||||||
|
<legend>{{ _('Theme style') }}</legend>
|
||||||
|
<p class="value">
|
||||||
|
<select name="simple_style">
|
||||||
|
{%- for name in ['auto', 'light', 'dark'] -%}
|
||||||
|
<option value="{{ name }}" {% if name == preferences.get_value('simple_style') %}selected="selected"{% endif %}>{{ _(name) }}</option>
|
||||||
|
{%- endfor -%}
|
||||||
|
</select>
|
||||||
|
</p>
|
||||||
|
<div class="description">{{ _('Choose auto to follow your browser settings') }}</div>
|
||||||
|
</fieldset>
|
||||||
{% endif %}
|
{% endif %}
|
||||||
{% if 'results_on_new_tab' not in locked_preferences %}
|
{% if 'results_on_new_tab' not in locked_preferences %}
|
||||||
<fieldset>
|
<fieldset>
|
||||||
|
@ -174,6 +174,12 @@ _category_names = (
|
|||||||
gettext('science')
|
gettext('science')
|
||||||
)
|
)
|
||||||
|
|
||||||
|
_simple_style = (
|
||||||
|
gettext('auto'),
|
||||||
|
gettext('light'),
|
||||||
|
gettext('dark')
|
||||||
|
)
|
||||||
|
|
||||||
#
|
#
|
||||||
timeout_text = gettext('timeout')
|
timeout_text = gettext('timeout')
|
||||||
parsing_error_text = gettext('parsing error')
|
parsing_error_text = gettext('parsing error')
|
||||||
|
Loading…
Reference in New Issue
Block a user