mirror of
https://github.com/searxng/searxng.git
synced 2024-11-17 09:50:13 +01:00
Merge pull request #521 from dalf/simple-theme-style-pref
Simple theme: allow the user to choose auto, light, dark style
This commit is contained in:
Alexandre Flament
GitHub
commit
bc0cf9e83e
@ -393,7 +393,13 @@ class Preferences:
|
||||
'oscar-style': EnumStringSetting(
|
||||
settings['ui']['theme_args']['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(
|
||||
settings['ui']['advanced_search'],
|
||||
is_locked('advanced_search'),
|
||||
|
||||
@ -74,6 +74,8 @@ ui:
|
||||
theme_args:
|
||||
# default style of oscar
|
||||
oscar_style: logicodev
|
||||
# style of simple theme: auto, light, dark
|
||||
simple_style: auto
|
||||
# Open result links in a new tab by default
|
||||
# results_on_new_tab: false
|
||||
# categories_order :
|
||||
|
||||
@ -19,6 +19,7 @@ logger = logging.getLogger('searx')
|
||||
OUTPUT_FORMATS = ['html', 'csv', 'json', 'rss']
|
||||
LANGUAGE_CODES = ['all'] + list(l[0] for l in languages)
|
||||
OSCAR_STYLE = ('logicodev', 'logicodev-dark', 'pointhi')
|
||||
SIMPLE_STYLE = ('auto', 'light', 'dark')
|
||||
CATEGORY_ORDER = [
|
||||
'general',
|
||||
'images',
|
||||
@ -183,6 +184,7 @@ SCHEMA = {
|
||||
'default_locale': SettingsValue(str, ''),
|
||||
'theme_args': {
|
||||
'oscar_style': SettingsValue(OSCAR_STYLE, 'logicodev'),
|
||||
'simple_style': SettingsValue(SIMPLE_STYLE, 'auto'),
|
||||
},
|
||||
'results_on_new_tab': SettingsValue(bool, False),
|
||||
'advanced_search': SettingsValue(bool, False),
|
||||
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -819,7 +819,7 @@ template {
|
||||
--color-toolkit-loader-borderleft: rgba(255, 255, 255, 0);
|
||||
}
|
||||
@media (prefers-color-scheme: dark) {
|
||||
:root {
|
||||
:root.theme-auto {
|
||||
--color-base-font: #bbb;
|
||||
--color-base-font-rgb: 187, 187, 187;
|
||||
--color-base-background: #222;
|
||||
@ -904,6 +904,90 @@ template {
|
||||
--color-toolkit-loader-borderleft: rgba(0, 0, 0, 0);
|
||||
}
|
||||
}
|
||||
:root.theme-dark {
|
||||
--color-base-font: #bbb;
|
||||
--color-base-font-rgb: 187, 187, 187;
|
||||
--color-base-background: #222;
|
||||
--color-url-font: #8af;
|
||||
--color-url-visited-font: #96b;
|
||||
--color-header-background: #181818;
|
||||
--color-header-border: #333;
|
||||
--color-footer-background: #181818;
|
||||
--color-footer-border: #333;
|
||||
--color-sidebar-border: #555;
|
||||
--color-sidebar-font: #fff;
|
||||
--color-backtotop-font: #bbb;
|
||||
--color-backtotop-border: #333;
|
||||
--color-backtotop-background: #181818;
|
||||
--color-btn-background: #58f;
|
||||
--color-btn-font: #222;
|
||||
--color-search-border: #555;
|
||||
--color-search-background: #222;
|
||||
--color-search-font: #fff;
|
||||
--color-search-background-hover: #58f;
|
||||
--color-error: #f55b5b;
|
||||
--color-error-background: #390a0a;
|
||||
--color-warning: #f1d561;
|
||||
--color-warning-background: #39300a;
|
||||
--color-success: #79f56e;
|
||||
--color-success-background: #0e390a;
|
||||
--color-categories-item-selected-font: #58f;
|
||||
--color-categories-item-border-selected: #58f;
|
||||
--color-autocomplete-font: #fff;
|
||||
--color-autocomplete-border: #555;
|
||||
--color-autocomplete-background: #222;
|
||||
--color-autocomplete-background-hover: #181818;
|
||||
--color-answer-border: #333;
|
||||
--color-answer-font: #bbb;
|
||||
--color-answer-background: #181818;
|
||||
--color-result-border: #333;
|
||||
--color-result-url-font: #fff;
|
||||
--color-result-vim-selected: #181818;
|
||||
--color-result-vim-arrow: #8af;
|
||||
--color-result-description-highlight-font: #fff;
|
||||
--color-result-link-font: #8af;
|
||||
--color-result-link-font-highlight: #8af;
|
||||
--color-result-link-visited-font: #96b;
|
||||
--color-result-publishdate-font: #777;
|
||||
--color-result-engines-font: #777;
|
||||
--color-result-search-url-border: #555;
|
||||
--color-result-search-url-font: #fff;
|
||||
--color-result-detail-font: #fff;
|
||||
--color-result-detail-label-font: lightgray;
|
||||
--color-result-detail-background: #000;
|
||||
--color-result-detail-hr: #555;
|
||||
--color-result-detail-link: #8af;
|
||||
--color-result-detail-loader-border: rgba(255, 255, 255, 0.2);
|
||||
--color-result-detail-loader-borderleft: rgba(0, 0, 0, 0);
|
||||
--color-result-image-span-background-hover: rgba(0, 0, 0, 0.6);
|
||||
--color-result-image-span-font: #fff;
|
||||
--color-result-image-background: #8af;
|
||||
--color-settings-tr-hover: #2d2d2d;
|
||||
--color-settings-engine-description-font: #909090;
|
||||
--color-toolkit-badge-font: #fff;
|
||||
--color-toolkit-badge-background: #777;
|
||||
--color-toolkit-kbd-font: #000;
|
||||
--color-toolkit-kbd-background: #fff;
|
||||
--color-toolkit-dialog-border: #555;
|
||||
--color-toolkit-dialog-background: #222;
|
||||
--color-toolkit-tabs-label-border: #222;
|
||||
--color-toolkit-tabs-section-border: #555;
|
||||
--color-toolkit-select-border: #555;
|
||||
--color-toolkit-select-border-hover: #777;
|
||||
--color-toolkit-input-text-font: #fff;
|
||||
--color-toolkit-input-text-border: #555;
|
||||
--color-toolkit-input-text-border-hover: #777;
|
||||
--color-toolkit-checkbox-onoff-background: #3c3b31;
|
||||
--color-toolkit-checkbox-onoff-label-background: #58f;
|
||||
--color-toolkit-checkbox-onoff-checked-background: #ddd;
|
||||
--color-toolkit-checkbox-label-background: #fff;
|
||||
--color-toolkit-checkbox-label-border: #333;
|
||||
--color-toolkit-checkbox-input-border: #58f;
|
||||
--color-toolkit-engine-tooltip-border: #333;
|
||||
--color-toolkit-engine-tooltip-background: #222;
|
||||
--color-toolkit-loader-border: rgba(255, 255, 255, 0.2);
|
||||
--color-toolkit-loader-borderleft: rgba(0, 0, 0, 0);
|
||||
}
|
||||
/*
|
||||
* SearXNG, A privacy-respecting, hackable metasearch engine
|
||||
*/
|
||||
@ -1601,10 +1685,14 @@ select:focus {
|
||||
background-color: var(--color-base-background);
|
||||
}
|
||||
@media (prefers-color-scheme: dark) {
|
||||
select {
|
||||
html.theme-auto select,
|
||||
html.theme-dark select {
|
||||
background-image: url("data:image/svg+xml;charset=UTF-8,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22utf-8%22%3F%3E%0A%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22512%22%20height%3D%22512%22%20viewBox%3D%220%200%20512%20512%22%3E%0A%3Cg%3E%3Cpolygon%20fill%3D%22%23ddd%22%20points%3D%22128%2C192%20256%2C320%20384%2C192%22%2F%3E%3C%2Fg%3E%0A%3C%2Fsvg%3E");
|
||||
}
|
||||
}
|
||||
html.theme-dark select {
|
||||
background-image: url("data:image/svg+xml;charset=UTF-8,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22utf-8%22%3F%3E%0A%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22512%22%20height%3D%22512%22%20viewBox%3D%220%200%20512%20512%22%3E%0A%3Cg%3E%3Cpolygon%20fill%3D%22%23ddd%22%20points%3D%22128%2C192%20256%2C320%20384%2C192%22%2F%3E%3C%2Fg%3E%0A%3C%2Fsvg%3E");
|
||||
}
|
||||
}
|
||||
/* -- checkbox-onoff -- */
|
||||
@supports (border-radius: 50px) {
|
||||
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -819,7 +819,7 @@ template {
|
||||
--color-toolkit-loader-borderleft: rgba(255, 255, 255, 0);
|
||||
}
|
||||
@media (prefers-color-scheme: dark) {
|
||||
:root {
|
||||
:root.theme-auto {
|
||||
--color-base-font: #bbb;
|
||||
--color-base-font-rgb: 187, 187, 187;
|
||||
--color-base-background: #222;
|
||||
@ -904,6 +904,90 @@ template {
|
||||
--color-toolkit-loader-borderleft: rgba(0, 0, 0, 0);
|
||||
}
|
||||
}
|
||||
:root.theme-dark {
|
||||
--color-base-font: #bbb;
|
||||
--color-base-font-rgb: 187, 187, 187;
|
||||
--color-base-background: #222;
|
||||
--color-url-font: #8af;
|
||||
--color-url-visited-font: #96b;
|
||||
--color-header-background: #181818;
|
||||
--color-header-border: #333;
|
||||
--color-footer-background: #181818;
|
||||
--color-footer-border: #333;
|
||||
--color-sidebar-border: #555;
|
||||
--color-sidebar-font: #fff;
|
||||
--color-backtotop-font: #bbb;
|
||||
--color-backtotop-border: #333;
|
||||
--color-backtotop-background: #181818;
|
||||
--color-btn-background: #58f;
|
||||
--color-btn-font: #222;
|
||||
--color-search-border: #555;
|
||||
--color-search-background: #222;
|
||||
--color-search-font: #fff;
|
||||
--color-search-background-hover: #58f;
|
||||
--color-error: #f55b5b;
|
||||
--color-error-background: #390a0a;
|
||||
--color-warning: #f1d561;
|
||||
--color-warning-background: #39300a;
|
||||
--color-success: #79f56e;
|
||||
--color-success-background: #0e390a;
|
||||
--color-categories-item-selected-font: #58f;
|
||||
--color-categories-item-border-selected: #58f;
|
||||
--color-autocomplete-font: #fff;
|
||||
--color-autocomplete-border: #555;
|
||||
--color-autocomplete-background: #222;
|
||||
--color-autocomplete-background-hover: #181818;
|
||||
--color-answer-border: #333;
|
||||
--color-answer-font: #bbb;
|
||||
--color-answer-background: #181818;
|
||||
--color-result-border: #333;
|
||||
--color-result-url-font: #fff;
|
||||
--color-result-vim-selected: #181818;
|
||||
--color-result-vim-arrow: #8af;
|
||||
--color-result-description-highlight-font: #fff;
|
||||
--color-result-link-font: #8af;
|
||||
--color-result-link-font-highlight: #8af;
|
||||
--color-result-link-visited-font: #96b;
|
||||
--color-result-publishdate-font: #777;
|
||||
--color-result-engines-font: #777;
|
||||
--color-result-search-url-border: #555;
|
||||
--color-result-search-url-font: #fff;
|
||||
--color-result-detail-font: #fff;
|
||||
--color-result-detail-label-font: lightgray;
|
||||
--color-result-detail-background: #000;
|
||||
--color-result-detail-hr: #555;
|
||||
--color-result-detail-link: #8af;
|
||||
--color-result-detail-loader-border: rgba(255, 255, 255, 0.2);
|
||||
--color-result-detail-loader-borderleft: rgba(0, 0, 0, 0);
|
||||
--color-result-image-span-background-hover: rgba(0, 0, 0, 0.6);
|
||||
--color-result-image-span-font: #fff;
|
||||
--color-result-image-background: #8af;
|
||||
--color-settings-tr-hover: #2d2d2d;
|
||||
--color-settings-engine-description-font: #909090;
|
||||
--color-toolkit-badge-font: #fff;
|
||||
--color-toolkit-badge-background: #777;
|
||||
--color-toolkit-kbd-font: #000;
|
||||
--color-toolkit-kbd-background: #fff;
|
||||
--color-toolkit-dialog-border: #555;
|
||||
--color-toolkit-dialog-background: #222;
|
||||
--color-toolkit-tabs-label-border: #222;
|
||||
--color-toolkit-tabs-section-border: #555;
|
||||
--color-toolkit-select-border: #555;
|
||||
--color-toolkit-select-border-hover: #777;
|
||||
--color-toolkit-input-text-font: #fff;
|
||||
--color-toolkit-input-text-border: #555;
|
||||
--color-toolkit-input-text-border-hover: #777;
|
||||
--color-toolkit-checkbox-onoff-background: #3c3b31;
|
||||
--color-toolkit-checkbox-onoff-label-background: #58f;
|
||||
--color-toolkit-checkbox-onoff-checked-background: #ddd;
|
||||
--color-toolkit-checkbox-label-background: #fff;
|
||||
--color-toolkit-checkbox-label-border: #333;
|
||||
--color-toolkit-checkbox-input-border: #58f;
|
||||
--color-toolkit-engine-tooltip-border: #333;
|
||||
--color-toolkit-engine-tooltip-background: #222;
|
||||
--color-toolkit-loader-border: rgba(255, 255, 255, 0.2);
|
||||
--color-toolkit-loader-borderleft: rgba(0, 0, 0, 0);
|
||||
}
|
||||
/*
|
||||
* SearXNG, A privacy-respecting, hackable metasearch engine
|
||||
*/
|
||||
@ -1601,10 +1685,14 @@ select:focus {
|
||||
background-color: var(--color-base-background);
|
||||
}
|
||||
@media (prefers-color-scheme: dark) {
|
||||
select {
|
||||
html.theme-auto select,
|
||||
html.theme-dark select {
|
||||
background-image: url("data:image/svg+xml;charset=UTF-8,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22utf-8%22%3F%3E%0A%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22512%22%20height%3D%22512%22%20viewBox%3D%220%200%20512%20512%22%3E%0A%3Cg%3E%3Cpolygon%20fill%3D%22%23ddd%22%20points%3D%22128%2C192%20256%2C320%20384%2C192%22%2F%3E%3C%2Fg%3E%0A%3C%2Fsvg%3E");
|
||||
}
|
||||
}
|
||||
html.theme-dark select {
|
||||
background-image: url("data:image/svg+xml;charset=UTF-8,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22utf-8%22%3F%3E%0A%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22512%22%20height%3D%22512%22%20viewBox%3D%220%200%20512%20512%22%3E%0A%3Cg%3E%3Cpolygon%20fill%3D%22%23ddd%22%20points%3D%22128%2C192%20256%2C320%20384%2C192%22%2F%3E%3C%2Fg%3E%0A%3C%2Fsvg%3E");
|
||||
}
|
||||
}
|
||||
/* -- checkbox-onoff -- */
|
||||
@supports (border-radius: 50px) {
|
||||
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -27,5 +27,10 @@
|
||||
};
|
||||
|
||||
// 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);
|
||||
@ -4,5 +4,5 @@
|
||||
* (C) Copyright Contributors to the searx project (2014 - 2021).
|
||||
* SPDX-License-Identifier: AGPL-3.0-or-later
|
||||
*/
|
||||
(function(t,e){"use strict";var a=e.currentScript||function(){var t=e.getElementsByTagName("script");return t[t.length-1]}();t.searxng={touch:"ontouchstart"in t||t.DocumentTouch&&document instanceof DocumentTouch||false,method:a.getAttribute("data-method"),autocompleter:a.getAttribute("data-autocompleter")==="true",search_on_category_select:a.getAttribute("data-search-on-category-select")==="true",infinite_scroll:a.getAttribute("data-infinite-scroll")==="true",hotkeys:a.getAttribute("data-hotkeys")==="true",static_path:a.getAttribute("data-static-path"),translations:JSON.parse(a.getAttribute("data-translations"))};e.getElementsByTagName("html")[0].className=t.searxng.touch?"js touch":"js"})(window,document);
|
||||
(function(t,e){"use strict";var a=e.currentScript||function(){var t=e.getElementsByTagName("script");return t[t.length-1]}();t.searxng={touch:"ontouchstart"in t||t.DocumentTouch&&document instanceof DocumentTouch||false,method:a.getAttribute("data-method"),autocompleter:a.getAttribute("data-autocompleter")==="true",search_on_category_select:a.getAttribute("data-search-on-category-select")==="true",infinite_scroll:a.getAttribute("data-infinite-scroll")==="true",hotkeys:a.getAttribute("data-hotkeys")==="true",static_path:a.getAttribute("data-static-path"),translations:JSON.parse(a.getAttribute("data-translations"))};var r=e.getElementsByTagName("html")[0];r.classList.remove("no-js");r.classList.add("js");if(t.searxng.touch){r.classList.add("touch")}})(window,document);
|
||||
//# sourceMappingURL=searxng.head.min.js.map
|
||||
@ -1 +1 @@
|
||||
{"version":3,"file":"searxng.head.min.js","sources":["searxng.head.js"],"names":["w","d","script","currentScript","scripts","getElementsByTagName","length","searxng","touch","DocumentTouch","document","method","getAttribute","autocompleter","search_on_category_select","infinite_scroll","hotkeys","static_path","translations","JSON","parse","className","window"],"mappings":";;;;;;CAOA,SAAUA,EAAGC,gBAIT,IAAIC,EAASD,EAAEE,eAAkB,WAC7B,IAAIC,EAAUH,EAAEI,qBAAqB,UACrC,OAAOD,EAAQA,EAAQE,OAAS,GAFH,GAMjCN,EAAEO,QAAU,CACRC,MAAS,iBAAkBR,GAAMA,EAAES,eAAiBC,oBAAoBD,eAAkB,MAC1FE,OAAQT,EAAOU,aAAa,eAC5BC,cAAeX,EAAOU,aAAa,wBAA0B,OAC7DE,0BAA2BZ,EAAOU,aAAa,oCAAsC,OACrFG,gBAAiBb,EAAOU,aAAa,0BAA4B,OACjEI,QAASd,EAAOU,aAAa,kBAAoB,OACjDK,YAAaf,EAAOU,aAAa,oBACjCM,aAAcC,KAAKC,MAAMlB,EAAOU,aAAa,uBAIjDX,EAAEI,qBAAqB,QAAQ,GAAGgB,UAAarB,EAAEO,QAAa,MAAE,WAAW,MAtB/E,CAuBGe,OAAQZ"}
|
||||
{"version":3,"file":"searxng.head.min.js","sources":["searxng.head.js"],"names":["w","d","script","currentScript","scripts","getElementsByTagName","length","searxng","touch","DocumentTouch","document","method","getAttribute","autocompleter","search_on_category_select","infinite_scroll","hotkeys","static_path","translations","JSON","parse","hmtlElement","classList","remove","add","window"],"mappings":";;;;;;CAOA,SAAUA,EAAGC,gBAIT,IAAIC,EAASD,EAAEE,eAAkB,WAC7B,IAAIC,EAAUH,EAAEI,qBAAqB,UACrC,OAAOD,EAAQA,EAAQE,OAAS,GAFH,GAMjCN,EAAEO,QAAU,CACRC,MAAS,iBAAkBR,GAAMA,EAAES,eAAiBC,oBAAoBD,eAAkB,MAC1FE,OAAQT,EAAOU,aAAa,eAC5BC,cAAeX,EAAOU,aAAa,wBAA0B,OAC7DE,0BAA2BZ,EAAOU,aAAa,oCAAsC,OACrFG,gBAAiBb,EAAOU,aAAa,0BAA4B,OACjEI,QAASd,EAAOU,aAAa,kBAAoB,OACjDK,YAAaf,EAAOU,aAAa,oBACjCM,aAAcC,KAAKC,MAAMlB,EAAOU,aAAa,uBAIjD,IAAIS,EAAcpB,EAAEI,qBAAqB,QAAQ,GACjDgB,EAAYC,UAAUC,OAAO,SAC7BF,EAAYC,UAAUE,IAAI,MAC1B,GAAIxB,EAAEO,QAAQC,MAAO,CACjBa,EAAYC,UAAUE,IAAI,WA1BlC,CA4BGC,OAAQf"}
|
||||
File diff suppressed because one or more lines are too long
@ -27,5 +27,10 @@
|
||||
};
|
||||
|
||||
// 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);
|
||||
@ -106,110 +106,119 @@
|
||||
--color-toolkit-loader-borderleft: rgba(255, 255, 255, 0);
|
||||
}
|
||||
|
||||
.dark-themes() {
|
||||
/// Base Colors
|
||||
--color-base-font: #bbb;
|
||||
--color-base-font-rgb: 187, 187, 187;
|
||||
--color-base-background: #222;
|
||||
--color-url-font: #8af;
|
||||
--color-url-visited-font: #96b;
|
||||
/// Header Colors
|
||||
--color-header-background: #181818;
|
||||
--color-header-border: #333;
|
||||
/// Footer Colors
|
||||
--color-footer-background: #181818;
|
||||
--color-footer-border: #333;
|
||||
/// Sidebar Colors
|
||||
--color-sidebar-border: #555;
|
||||
--color-sidebar-font: #fff;
|
||||
/// BackToTop Colors
|
||||
--color-backtotop-font: #bbb;
|
||||
--color-backtotop-border: #333;
|
||||
--color-backtotop-background: #181818;
|
||||
/// Button Colors
|
||||
--color-btn-background: #58f;
|
||||
--color-btn-font: #222;
|
||||
/// Search Input Colors
|
||||
--color-search-border: #555;
|
||||
--color-search-background: #222;
|
||||
--color-search-font: #fff;
|
||||
--color-search-background-hover: #58f;
|
||||
/// Modal Colors
|
||||
--color-error: #f55b5b;
|
||||
--color-error-background: darken(#db3434, 40%);
|
||||
--color-warning: #f1d561;
|
||||
--color-warning-background: darken(#dbba34, 40%);
|
||||
--color-success: #79f56e;
|
||||
--color-success-background: darken(#42db34, 40%);
|
||||
/// Categories Colors
|
||||
--color-categories-item-selected-font: #58f;
|
||||
--color-categories-item-border-selected: #58f;
|
||||
/// Autocomplete Colors
|
||||
--color-autocomplete-font: #fff;
|
||||
--color-autocomplete-border: #555;
|
||||
--color-autocomplete-background: #222;
|
||||
--color-autocomplete-background-hover: #181818;
|
||||
/// Answer Colors
|
||||
--color-answer-border: #333; // same as --color-header-border
|
||||
--color-answer-font: #bbb; // same as --color-base-font
|
||||
--color-answer-background: #181818; // same as --color-header-background:
|
||||
/// Results Colors
|
||||
--color-result-border: #333;
|
||||
--color-result-url-font: #fff;
|
||||
--color-result-vim-selected: #181818;
|
||||
--color-result-vim-arrow: #8af;
|
||||
--color-result-description-highlight-font: #fff;
|
||||
--color-result-link-font: #8af;
|
||||
--color-result-link-font-highlight: #8af;
|
||||
--color-result-link-visited-font: #96b;
|
||||
--color-result-publishdate-font: #777;
|
||||
--color-result-engines-font: #777;
|
||||
--color-result-search-url-border: #555;
|
||||
--color-result-search-url-font: #fff;
|
||||
/// Detail modal : same as the light version
|
||||
--color-result-detail-font: #fff;
|
||||
--color-result-detail-label-font: lightgray;
|
||||
--color-result-detail-background: #000;
|
||||
--color-result-detail-hr: #555;
|
||||
--color-result-detail-link: #8af;
|
||||
--color-result-detail-loader-border: rgba(255, 255, 255, 0.2);
|
||||
--color-result-detail-loader-borderleft: rgba(0, 0, 0, 0);
|
||||
// Images Colors
|
||||
--color-result-image-span-background-hover: rgba(0, 0, 0, 0.6);
|
||||
--color-result-image-span-font: #fff;
|
||||
--color-result-image-background: #8af;
|
||||
/// Settings Colors
|
||||
--color-settings-tr-hover: #2d2d2d;
|
||||
--color-settings-engine-description-font: darken(#dcdcdc, 30%);
|
||||
/// Toolkit Colors
|
||||
--color-toolkit-badge-font: #fff;
|
||||
--color-toolkit-badge-background: #777;
|
||||
--color-toolkit-kbd-font: #000;
|
||||
--color-toolkit-kbd-background: #fff;
|
||||
--color-toolkit-dialog-border: #555;
|
||||
--color-toolkit-dialog-background: #222;
|
||||
--color-toolkit-tabs-label-border: #222;
|
||||
--color-toolkit-tabs-section-border: #555;
|
||||
--color-toolkit-select-border: #555;
|
||||
--color-toolkit-select-border-hover: #777;
|
||||
--color-toolkit-input-text-font: #fff;
|
||||
--color-toolkit-input-text-border: #555;
|
||||
--color-toolkit-input-text-border-hover: #777;
|
||||
--color-toolkit-checkbox-onoff-background: #3c3b31;
|
||||
--color-toolkit-checkbox-onoff-label-background: #58f;
|
||||
--color-toolkit-checkbox-onoff-checked-background: #ddd;
|
||||
--color-toolkit-checkbox-label-background: #fff;
|
||||
--color-toolkit-checkbox-label-border: #333;
|
||||
--color-toolkit-checkbox-input-border: #58f;
|
||||
--color-toolkit-engine-tooltip-border: #333;
|
||||
--color-toolkit-engine-tooltip-background: #222;
|
||||
--color-toolkit-loader-border: rgba(255, 255, 255, 0.2);
|
||||
--color-toolkit-loader-borderleft: rgba(0, 0, 0, 0);
|
||||
}
|
||||
|
||||
/// Dark Theme (autoswitch based on device pref)
|
||||
@media (prefers-color-scheme: dark) {
|
||||
:root {
|
||||
/// Base Colors
|
||||
--color-base-font: #bbb;
|
||||
--color-base-font-rgb: 187, 187, 187;
|
||||
--color-base-background: #222;
|
||||
--color-url-font: #8af;
|
||||
--color-url-visited-font: #96b;
|
||||
/// Header Colors
|
||||
--color-header-background: #181818;
|
||||
--color-header-border: #333;
|
||||
/// Footer Colors
|
||||
--color-footer-background: #181818;
|
||||
--color-footer-border: #333;
|
||||
/// Sidebar Colors
|
||||
--color-sidebar-border: #555;
|
||||
--color-sidebar-font: #fff;
|
||||
/// BackToTop Colors
|
||||
--color-backtotop-font: #bbb;
|
||||
--color-backtotop-border: #333;
|
||||
--color-backtotop-background: #181818;
|
||||
/// Button Colors
|
||||
--color-btn-background: #58f;
|
||||
--color-btn-font: #222;
|
||||
/// Search Input Colors
|
||||
--color-search-border: #555;
|
||||
--color-search-background: #222;
|
||||
--color-search-font: #fff;
|
||||
--color-search-background-hover: #58f;
|
||||
/// Modal Colors
|
||||
--color-error: #f55b5b;
|
||||
--color-error-background: darken(#db3434, 40%);
|
||||
--color-warning: #f1d561;
|
||||
--color-warning-background: darken(#dbba34, 40%);
|
||||
--color-success: #79f56e;
|
||||
--color-success-background: darken(#42db34, 40%);
|
||||
/// Categories Colors
|
||||
--color-categories-item-selected-font: #58f;
|
||||
--color-categories-item-border-selected: #58f;
|
||||
/// Autocomplete Colors
|
||||
--color-autocomplete-font: #fff;
|
||||
--color-autocomplete-border: #555;
|
||||
--color-autocomplete-background: #222;
|
||||
--color-autocomplete-background-hover: #181818;
|
||||
/// Answer Colors
|
||||
--color-answer-border: #333; // same as --color-header-border
|
||||
--color-answer-font: #bbb; // same as --color-base-font
|
||||
--color-answer-background: #181818; // same as --color-header-background:
|
||||
/// Results Colors
|
||||
--color-result-border: #333;
|
||||
--color-result-url-font: #fff;
|
||||
--color-result-vim-selected: #181818;
|
||||
--color-result-vim-arrow: #8af;
|
||||
--color-result-description-highlight-font: #fff;
|
||||
--color-result-link-font: #8af;
|
||||
--color-result-link-font-highlight: #8af;
|
||||
--color-result-link-visited-font: #96b;
|
||||
--color-result-publishdate-font: #777;
|
||||
--color-result-engines-font: #777;
|
||||
--color-result-search-url-border: #555;
|
||||
--color-result-search-url-font: #fff;
|
||||
/// Detail modal : same as the light version
|
||||
--color-result-detail-font: #fff;
|
||||
--color-result-detail-label-font: lightgray;
|
||||
--color-result-detail-background: #000;
|
||||
--color-result-detail-hr: #555;
|
||||
--color-result-detail-link: #8af;
|
||||
--color-result-detail-loader-border: rgba(255, 255, 255, 0.2);
|
||||
--color-result-detail-loader-borderleft: rgba(0, 0, 0, 0);
|
||||
// Images Colors
|
||||
--color-result-image-span-background-hover: rgba(0, 0, 0, 0.6);
|
||||
--color-result-image-span-font: #fff;
|
||||
--color-result-image-background: #8af;
|
||||
/// Settings Colors
|
||||
--color-settings-tr-hover: #2d2d2d;
|
||||
--color-settings-engine-description-font: darken(#dcdcdc, 30%);
|
||||
/// Toolkit Colors
|
||||
--color-toolkit-badge-font: #fff;
|
||||
--color-toolkit-badge-background: #777;
|
||||
--color-toolkit-kbd-font: #000;
|
||||
--color-toolkit-kbd-background: #fff;
|
||||
--color-toolkit-dialog-border: #555;
|
||||
--color-toolkit-dialog-background: #222;
|
||||
--color-toolkit-tabs-label-border: #222;
|
||||
--color-toolkit-tabs-section-border: #555;
|
||||
--color-toolkit-select-border: #555;
|
||||
--color-toolkit-select-border-hover: #777;
|
||||
--color-toolkit-input-text-font: #fff;
|
||||
--color-toolkit-input-text-border: #555;
|
||||
--color-toolkit-input-text-border-hover: #777;
|
||||
--color-toolkit-checkbox-onoff-background: #3c3b31;
|
||||
--color-toolkit-checkbox-onoff-label-background: #58f;
|
||||
--color-toolkit-checkbox-onoff-checked-background: #ddd;
|
||||
--color-toolkit-checkbox-label-background: #fff;
|
||||
--color-toolkit-checkbox-label-border: #333;
|
||||
--color-toolkit-checkbox-input-border: #58f;
|
||||
--color-toolkit-engine-tooltip-border: #333;
|
||||
--color-toolkit-engine-tooltip-background: #222;
|
||||
--color-toolkit-loader-border: rgba(255, 255, 255, 0.2);
|
||||
--color-toolkit-loader-borderleft: rgba(0, 0, 0, 0);
|
||||
:root.theme-auto {
|
||||
.dark-themes();
|
||||
}
|
||||
}
|
||||
|
||||
// Dark Theme by preferences
|
||||
:root.theme-dark {
|
||||
.dark-themes();
|
||||
}
|
||||
|
||||
/// General Size
|
||||
@results-width: 45rem;
|
||||
@results-offset: 10rem;
|
||||
|
||||
@ -333,10 +333,15 @@ select {
|
||||
}
|
||||
|
||||
@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);
|
||||
}
|
||||
}
|
||||
|
||||
html.theme-dark select {
|
||||
background-image: data-uri('image/svg+xml;charset=UTF-8', @select-dark-svg-path);
|
||||
}
|
||||
}
|
||||
|
||||
/* -- checkbox-onoff -- */
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
<!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>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="description" content="SearXNG — a privacy-respecting, hackable metasearch engine">
|
||||
|
||||
@ -204,6 +204,17 @@
|
||||
</p>
|
||||
<div class="description">{{ _('Change SearXNG layout') }}</div>
|
||||
</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 %}
|
||||
{% if 'results_on_new_tab' not in locked_preferences %}
|
||||
<fieldset>
|
||||
|
||||
@ -174,6 +174,12 @@ _category_names = (
|
||||
gettext('science')
|
||||
)
|
||||
|
||||
_simple_style = (
|
||||
gettext('auto'),
|
||||
gettext('light'),
|
||||
gettext('dark')
|
||||
)
|
||||
|
||||
#
|
||||
timeout_text = gettext('timeout')
|
||||
parsing_error_text = gettext('parsing error')
|
||||
|
||||
Loading…
Reference in New Issue
Block a user