blob42
/
searxng
forked from Archives/searxng
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

[theme] convert less vars to css vars in simple theme

Browse Source
dependabot/pip/master/sphinx-6.1.3
MrPaulBlack 3 years ago
parent 878d5d657c
commit 452b266387
6 changed files with 188 additions and 206 deletions
Show Stats Download Patch File Download Diff File

12
searx/static/themes/simple/src/less/autocomplete.less
Unescape Escape View File

@ -1,7 +1,5 @@
/*! Autocomplete.js v2.6.3 | license MIT | (c) 2017, Baptiste Donaux | http://autocomplete-js.com */
@background_color: white;
.autocomplete {
position: absolute;
max-height: 0;
@ -11,7 +9,7 @@
&:active,
&:focus,
&:hover {
background-color: @background_color;
background-color: var(--background_color);
}
&:empty {
@ -30,7 +28,7 @@
&.active,
&:active,
&:focus {
background-color: @color-base;
background-color: var(--color-base);
a:active,
a:focus,
@ -47,8 +45,8 @@
&.open {
display: block;
background-color: @background_color;
border: 1px solid @color-base;
background-color: var(--background_color);
border: 1px solid var(--color-base);
max-height: 500px;
overflow-y: auto;
z-index: 100;
@ -66,7 +64,7 @@
.autocomplete > ul > li {
padding: 7px 0 7px 10px;
border-bottom: 1px solid @color-result-top-border;
border-bottom: 1px solid var(--color-result-top-border);
text-align: left;
}
}

240
searx/static/themes/simple/src/less/definitions.less
Unescape Escape View File

@ -4,140 +4,124 @@
* To change the colors of the site, simple edit this variables
*/
/// Basic Colors
@color-base: #3498DB;
@color-base-dark: #084999;
@color-base-light: #ECF0F1;
@color-highlight: #094089;
@color-black: #000000;
///
@color-error: #db3434;
@color-error-background: lighten(@color-error, 40%);
@color-warning: #dbba34;
@color-warning-background: lighten(@color-warning, 40%);
@color-success: #42db34;
@color-success-background: lighten(@color-success, 40%);
/// General
@color-font: #444;
@color-font-light: #888;
@color-red: #25a55b;
@color-url-font: #29314d;
@color-url-visited-font: #684898;
html {
/// Basic Colors
--color-base: #3498db;
--color-base-dark: #084999;
--color-base-light: #ecf0f1;
--color-highlight: #094089;
--color-black: #000;
/// From autocomplete.less
--background_color: white;
/// Modal Colors
--color-error: #db3434;
--color-error-background: lighten(#db3434, 40%);
--color-warning: #dbba34;
--color-warning-background: lighten(#dbba34, 40%);
--color-success: #42db34;
--color-success-background: lighten(#42db34, 40%);
/// General Colors
--color-font: #444;
--color-font-light: #888;
--color-red: #25a55b;
--color-url-font: #29314d;
--color-url-visited-font: #684898;
/// Link Colors
--color-a-font: var(--color-base);
--color-a-font-hover: var(--color-base);
/// Header
--color-header-background: #f7f7f7;
--color-header-border: #d7d7d7;
/// Footer
--color-footer-background: #f7f7f7;
--color-footer-border: #d7d7d7;
/// Search-Input
--color-search-border: var(--color-base);
--color-search-background: #fff;
--color-search-font: #222;
/// Autocompleter
--color-autocompleter-choices-background: #fff;
--color-autocompleter-choices-border: var(--color-base);
--color-autocompleter-choices-border-left-right: var(--color-base);
--color-autocompleter-choices-border-bottom: var(--color-base);
--color-autocompleter-choices-font: #444;
/// Answers
--color-answers-border: var(--color-base-dark);
// Selected
--color-autocompleter-selected-background: #444;
--color-autocompleter-selected-font: #fff;
--color-autocompleter-selected-queried-font: #9fcfff;
/// Categories
--color-categories-item-selected: var(--color-base);
--color-categories-item-selected-font: #fff;
--color-categories-item-border-selected: var(--color-base-dark);
--color-categories-item-border-unselected: #e8e7e6;
--color-categories-item-border-unselected-hover: var(--color-base);
/// Results
--color-suggestions-button-background: var(--color-base);
--color-suggestions-button-font: #fff;
--color-download-button-background: var(--color-base);
--color-download-button-font: #fff;
--color-result-search-background: var(--color-base-light);
--color-result-definition-border: gray;
--color-result-torrent-border: lightgray;
--color-result-top-border: #e8e7e6;
// Link to result
--color-result-link-font: var(--color-base-dark);
--color-result-link-visited-font: var(--color-url-visited-font);
// Url to result
--color-result-url-font: var(--color-red);
// Publish Date
--color-result-publishdate-font: var(--color-font-light);
// Images
--color-result-image-span-background-hover: rgba(0, 0, 0, 0.6);
--color-result-image-span-font: #fff;
// Search-URL
--color-result-search-url-border: #888;
--color-result-search-url-font: #444;
/// Settings
--color-settings-fieldset: var(--color-base);
--color-settings-table-striped: #dbdbdb;
--color-settings-tr-hover: #ececec;
// Labels
--color-settings-label-allowed-background: #e74c3c;
--color-settings-label-allowed-font: #fff;
--color-settings-label-deny-background: #2eee71;
--color-settings-label-deny-font: var(--color-font);
--color-settings-return-background: var(--color-base);
--color-settings-return-font: #fff;
/// Other
--color-engines-font: var(--color-font-light);
--color-percentage-div-background: #444;
}
/// General Size
@results-width: 45rem;
@results-offset: 10rem;
@results-tablet-offset: 0.5rem;
@results-gap: 5rem;
@search-width: 40rem;
//
@color-a-font: @color-base;
@color-a-font-hover: @color-base;
/// Start-Screen
/// Header
@color-header-background: #f7f7f7;
@color-header-border: #d7d7d7;
/// Footer
@color-footer-background: #f7f7f7;
@color-footer-border: #d7d7d7;
/// Search-Input
@color-search-border: @color-base;
@color-search-background: #FFF;
@color-search-font: #222;
/// Autocompleter
@color-autocompleter-choices-background: #FFF;
@color-autocompleter-choices-border: @color-base;
@color-autocompleter-choices-border-left-right: @color-base;
@color-autocompleter-choices-border-bottom: @color-base;
@color-autocompleter-choices-font: #444;
/// Answers
@color-answers-border: @color-base-dark;
// Selected
@color-autocompleter-selected-background: #444;
@color-autocompleter-selected-font: #FFF;
@color-autocompleter-selected-queried-font: #9FCFFF;
/// Categories
@color-categories-item-selected: @color-base;
@color-categories-item-selected-font: #FFF;
@color-categories-item-border-selected: @color-base-dark;
@color-categories-item-border-unselected: #E8E7E6;
@color-categories-item-border-unselected-hover: @color-base;
/// Results
@color-suggestions-button-background: @color-base;
@color-suggestions-button-font: #FFF;
@color-download-button-background: @color-base;
@color-download-button-font: #FFF;
@color-result-search-background: @color-base-light;
@color-result-definition-border: gray;
@color-result-torrent-border: lightgray;
@color-result-top-border: #E8E7E6;
// Link to result
@color-result-link-font: @color-base-dark;
@color-result-link-visited-font: @color-url-visited-font;
// Url to result
@color-result-url-font: @color-red;
// Publish Date
@color-result-publishdate-font: @color-font-light;
// Images
@color-result-image-span-background-hover: rgba(0, 0, 0, 0.6);
@color-result-image-span-font: #FFF;
// Search-URL
@color-result-search-url-border: #888;
@color-result-search-url-font: #444;
/// Settings
@color-settings-fieldset: @color-base;
@color-settings-table-striped: #dbdbdb;
@color-settings-tr-hover: #ececec;
// Labels
@color-settings-label-allowed-background: #E74C3C;
@color-settings-label-allowed-font: #FFF;
@color-settings-label-deny-background: #2ECC71;
@color-settings-label-deny-font: @color-font;
@color-settings-return-background: @color-base;
@color-settings-return-font: #FFF;
/// Other
@color-engines-font: @color-font-light;
@color-percentage-div-background: #444;
/// Load fonts from this directory.
@icon-font-path: "../../../fonts/";
//** File name for all font files.

6
searx/static/themes/simple/src/less/preferences.less
Unescape Escape View File

@ -73,7 +73,7 @@
& > tbody > tr:nth-child(even) > th,
& > tbody > tr:nth-child(even) > td {
background-color: @color-settings-tr-hover;
background-color: var(--color-settings-tr-hover);
}
}
@ -83,7 +83,7 @@
}
.preferences_back {
background: none repeat scroll 0 0 @color-settings-return-background;
background: none repeat scroll 0 0 var(--color-settings-return-background);
color: white;
border: 0 none;
.rounded-corners;
@ -95,7 +95,7 @@
a {
display: block;
color: @color-settings-return-font;
color: var(--color-settings-return-font);
}
a::first-letter {

30
searx/static/themes/simple/src/less/search.less
Unescape Escape View File

@ -5,8 +5,8 @@
#search {
padding: 0 2em 0 @results-offset;
margin: 0;
background: @color-header-background;
border-bottom: 1px solid @color-header-border;
background: var(--color-header-background);
border-bottom: 1px solid var(--color-header-border);
}
#search_wrapper {
@ -34,19 +34,19 @@
margin: 0;
padding: 2px;
height: 2.2em;
background: none repeat scroll 0 0 @color-search-background;
border-top: 1px solid @color-search-border;
border-bottom: 1px solid @color-search-border;
background: none repeat scroll 0 0 var(--color-search-background);
border-top: 1px solid var(--color-search-border);
border-bottom: 1px solid var(--color-search-border);
border-right: none;
border-left: none;
border-radius: 0;
outline: none;
color: @color-search-font;
color: var(--color-search-font);
font-size: 16px;
z-index: 10000;
&:hover {
color: @color-search-border;
color: var(--color-search-border);
}
&.empty * {
@ -62,11 +62,11 @@
margin: 0;
padding: 2px;
height: 2.2em;
background: none repeat scroll 0 0 @color-search-background;
border: 1px solid @color-search-border;
background: none repeat scroll 0 0 var(--color-search-background);
border: 1px solid var(--color-search-border);
border-radius: 0;
outline: none;
color: @color-search-font;
color: var(--color-search-font);
font-size: 16px;
z-index: 2;
}
@ -90,8 +90,8 @@
&:hover {
cursor: pointer;
background-color: @color-search-border;
color: @color-base-light;
background-color: var(--color-search-border);
color: var(--color-base-light);
}
}
@ -233,9 +233,9 @@
} */
input[type="checkbox"]:checked + label {
background: @color-categories-item-selected;
color: @color-categories-item-selected-font;
border-bottom: 2px solid @color-categories-item-border-selected;
background: var(--color-categories-item-selected);
color: var(--color-categories-item-selected-font);
border-bottom: 2px solid var(--color-categories-item-border-selected);
}
}

60
searx/static/themes/simple/src/less/style.less
Unescape Escape View File

@ -41,7 +41,7 @@ html {
font-size: 0.9em;
.text-size-adjust;
color: @color-font;
color: var(--color-font);
padding: 0;
margin: 0;
}
@ -78,8 +78,8 @@ footer {
padding: 1rem 0;
width: 100%;
text-align: center;
background-color: @color-footer-background;
border-top: 1px solid @color-footer-border;
background-color: var(--color-footer-background);
border-top: 1px solid var(--color-footer-border);
overflow: hidden;
p {
@ -103,8 +103,8 @@ input[type="submit"],
#results button[type="submit"] {
padding: 0.5rem;
display: inline-block;
background: @color-download-button-background;
color: @color-download-button-font;
background: var(--color-download-button-background);
color: var(--color-download-button-font);
.rounded-corners;
border: 0;
@ -113,13 +113,13 @@ input[type="submit"],
a {
text-decoration: none;
color: @color-url-font;
color: var(--color-url-font);
&:visited {
color: @color-url-visited-font;
color: var(--color-url-visited-font);
.highlight {
color: @color-url-visited-font;
color: var(--color-url-visited-font);
}
}
}
@ -134,11 +134,11 @@ article[data-vim-selected]::before {
padding: 2px;
content: ">";
font-weight: bold;
color: @color-base;
color: var(--color-base);
}
article.result-images[data-vim-selected] {
background: @color-base;
background: var(--color-base);
}
article.result-images[data-vim-selected]::before {
@ -158,12 +158,12 @@ article.result-images[data-vim-selected]::before {
margin-bottom: 0;
a {
color: @color-result-link-font;
color: var(--color-result-link-font);
font-weight: normal;
font-size: 1.1em;
&:visited {
color: @color-result-link-visited-font;
color: var(--color-result-link-visited-font);
}
&:focus,
@ -193,7 +193,7 @@ article.result-images[data-vim-selected]::before {
line-height: 1.24;
.highlight {
color: @color-black;
color: var(--color-black);
background: inherit;
font-weight: bold;
}
@ -213,12 +213,12 @@ article.result-images[data-vim-selected]::before {
padding: 0;
max-width: 54em;
word-wrap: break-word;
color: @color-result-url-font;
color: var(--color-result-url-font);
}
.published_date {
font-size: 0.8em;
color: @color-result-publishdate-font;
color: var(--color-result-publishdate-font);
}
img {
@ -228,7 +228,7 @@ article.result-images[data-vim-selected]::before {
width: 20em;
min-width: 20em;
min-height: 8em;
// background: @color-base-light;
// background: var(--color-base-light);
}
&.image {
@ -259,7 +259,7 @@ article.result-images[data-vim-selected]::before {
.engines {
float: right;
color: @color-engines-font;
color: var(--color-engines-font);
span {
font-size: smaller;
@ -272,7 +272,7 @@ article.result-images[data-vim-selected]::before {
}
.highlight {
color: @color-highlight;
color: var(--color-highlight);
background: inherit;
font-weight: bold;
}
@ -290,12 +290,12 @@ article.result-images[data-vim-selected]::before {
padding: 0;
border: none;
max-height: 200px;
background: @color-base-dark;
background: var(--color-base-dark);
}
span a {
display: none;
color: @color-result-image-span-font;
color: var(--color-result-image-span-font);
}
&:hover span a {
@ -305,7 +305,7 @@ article.result-images[data-vim-selected]::before {
right: 0;
padding: 4px;
margin: 0 0 4px 4px;
background-color: @color-result-image-span-background-hover;
background-color: var(--color-result-image-span-background-hover);
font-size: 0.7em;
}
}
@ -342,7 +342,7 @@ article.result-images[data-vim-selected]::before {
}
.torrent_result {
border-left: 10px solid @color-result-torrent-border;
border-left: 10px solid var(--color-result-torrent-border);
padding-left: 3px;
p {
@ -351,14 +351,14 @@ article.result-images[data-vim-selected]::before {
}
a {
color: @color-result-link-font;
color: var(--color-result-link-font);
&:hover {
text-decoration: underline;
}
&:visited {
color: @color-result-link-visited-font;
color: var(--color-result-link-visited-font);
}
}
}
@ -410,13 +410,13 @@ article.result-images[data-vim-selected]::before {
font-size: 0.9em;
display: inline-block;
background: transparent;
color: @color-result-search-url-font;
color: var(--color-result-search-url-font);
cursor: pointer;
}
input[type="submit"],
.infobox .url a {
color: @color-result-link-font;
color: var(--color-result-link-font);
text-decoration: none;
font-size: 0.9rem;
@ -447,7 +447,7 @@ article.result-images[data-vim-selected]::before {
#search_url .title,
#apis .title {
margin: 2em 0 0.5em 0;
color: @color-font;
color: var(--color-font);
}
#answers {
@ -547,13 +547,13 @@ article.result-images[data-vim-selected]::before {
border: 0;
display: block;
font-size: 1.2em;
color: @color-search-font;
color: var(--color-search-font);
a:link *,
a:hover *,
a:visited *,
a:active * {
color: @color-search-font;
color: var(--color-search-font);
}
}
@ -633,7 +633,7 @@ article.result-images[data-vim-selected]::before {
}
.result {
border-bottom: 1px solid @color-result-top-border;
border-bottom: 1px solid var(--color-result-top-border);
margin: 0;
padding-top: 8px;
padding-bottom: 6px;

46
searx/static/themes/simple/src/less/toolkit.less
Unescape Escape View File

@ -36,15 +36,15 @@ html.js .show_if_nojs {
}
.danger {
background-color: @color-error-background;
background-color: var(--color-error-background);
}
.warning {
background: @color-warning-background;
background: var(--color-warning-background);
}
.success {
background: @color-success-background;
background: var(--color-success-background);
}
.badge {
@ -74,7 +74,7 @@ table {
&.striped {
tr {
border-bottom: 1px solid @color-settings-tr-hover;
border-bottom: 1px solid var(--color-settings-tr-hover);
}
}
}
@ -89,7 +89,7 @@ td {
tr {
&:hover {
background: @color-settings-tr-hover;
background: var(--color-settings-tr-hover);
}
}
@ -104,9 +104,9 @@ tr {
div.selectable_url {
display: block;
border: 1px solid @color-result-search-url-border;
border: 1px solid var(--color-result-search-url-border);
padding: 4px;
color: @color-result-search-url-font;
color: var(--color-result-search-url-font);
margin: 0.1em;
overflow: hidden;
height: 1.2em;
@ -173,18 +173,18 @@ div.selectable_url {
.dialog-error {
.dialog();
color: @color-error;
background: @color-error-background;
border-color: @color-error;
color: var(--color-error);
background: var(--color-error-background);
border-color: var(--color-error);
.ion-error();
}
.dialog-warning {
.dialog();
color: @color-warning;
background: @color-warning-background;
border-color: @color-warning;
color: var(--color-warning);
background: var(--color-warning-background);
border-color: var(--color-warning);
.ion-warning();
}
@ -253,7 +253,7 @@ div.selectable_url {
}
& > label:hover {
border-bottom: 2px solid @color-categories-item-border-selected;
border-bottom: 2px solid var(--color-categories-item-border-selected);
}
& > section {
@ -266,9 +266,9 @@ div.selectable_url {
// default selection
& > label:last-of-type {
border-bottom: 2px solid @color-categories-item-border-selected;
background: @color-categories-item-selected;
color: @color-categories-item-selected-font;
border-bottom: 2px solid var(--color-categories-item-border-selected);
background: var(--color-categories-item-selected);
color: var(--color-categories-item-selected-font);
font-weight: bold;
letter-spacing: -0.1px;
}
@ -291,14 +291,14 @@ html body .tabs > input:checked {
color: inherit;
&:hover {
border-bottom: 2px solid @color-categories-item-border-selected;
border-bottom: 2px solid var(--color-categories-item-border-selected);
}
}
+ label {
border-bottom: 2px solid @color-categories-item-border-selected;
background: @color-categories-item-selected;
color: @color-categories-item-selected-font;
border-bottom: 2px solid var(--color-categories-item-border-selected);
background: var(--color-categories-item-selected);
color: var(--color-categories-item-selected-font);
}
+ label + section {
@ -311,7 +311,7 @@ select {
height: 28px;
margin: 0 1em 0 0;
padding: 2px 8px 2px 0 !important;
color: @color-search-font;
color: var(--color-search-font);
font-size: 12px;
z-index: 2;
@ -336,7 +336,7 @@ select {
&:hover,
&:focus {
border-bottom: 1px solid @color-search-border;
border-bottom: 1px solid var(--color-search-border);
}
}
}

Write Preview
Loading…
Cancel
Save