From 452b26638756e8412566bc320959402f6016565f Mon Sep 17 00:00:00 2001 From: MrPaulBlack Date: Tue, 28 Sep 2021 22:41:56 +0200 Subject: [theme] convert less vars to css vars in simple theme --- searx/static/themes/simple/src/less/autocomplete.less | 12 +++++------- 1 file changed, 5 insertions(+), 7 deletions(-) (limited to 'searx/static/themes/simple/src/less/autocomplete.less') diff --git a/searx/static/themes/simple/src/less/autocomplete.less b/searx/static/themes/simple/src/less/autocomplete.less index bfa8e2bc6..0df6fa550 100644 --- a/searx/static/themes/simple/src/less/autocomplete.less +++ b/searx/static/themes/simple/src/less/autocomplete.less @@ -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; } } -- cgit v1.2.3 From 7c2a518d120ec02c4cead76faa1ba5fcec205373 Mon Sep 17 00:00:00 2001 From: MrPaulBlack Date: Thu, 30 Sep 2021 18:12:42 +0200 Subject: [theme] replace all hardcoded colors by css vars and drop ununsed vars --- searx/static/themes/simple/src/less/autocomplete.less | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) (limited to 'searx/static/themes/simple/src/less/autocomplete.less') diff --git a/searx/static/themes/simple/src/less/autocomplete.less b/searx/static/themes/simple/src/less/autocomplete.less index 0df6fa550..588d67937 100644 --- a/searx/static/themes/simple/src/less/autocomplete.less +++ b/searx/static/themes/simple/src/less/autocomplete.less @@ -9,7 +9,7 @@ &:active, &:focus, &:hover { - background-color: var(--background_color); + background-color: var(--color-autocompoleter-background); } &:empty { @@ -45,7 +45,7 @@ &.open { display: block; - background-color: var(--background_color); + background-color: var(--color-autocompleter-background); border: 1px solid var(--color-base); max-height: 500px; overflow-y: auto; -- cgit v1.2.3 From 740fca00ccabbbccd24e9fd6b17f5a56394cfca1 Mon Sep 17 00:00:00 2001 From: MrPaulBlack Date: Wed, 6 Oct 2021 20:12:51 +0200 Subject: Redo Color Theme and css cleanup * remove vars and add elements to base and btn vars * change default border radius to 10px and padding to 0.7em * put border radius and padding on search input form, infoxbox and buttons * remove unused .help class in #categories_container * remove active background from tabs to straemline design * redo search form: 10px padding * 2rem margin on search results on desktop * fix modal pacement of engine reliability in prefs * use darker accent colors * streamline autocomplete with more padding and a hover effect --- searx/static/themes/simple/src/less/autocomplete.less | 15 ++++++++------- 1 file changed, 8 insertions(+), 7 deletions(-) (limited to 'searx/static/themes/simple/src/less/autocomplete.less') diff --git a/searx/static/themes/simple/src/less/autocomplete.less b/searx/static/themes/simple/src/less/autocomplete.less index 588d67937..4dbb68d46 100644 --- a/searx/static/themes/simple/src/less/autocomplete.less +++ b/searx/static/themes/simple/src/less/autocomplete.less @@ -5,11 +5,12 @@ max-height: 0; overflow-y: hidden; text-align: left; + .rounded-corners; &:active, &:focus, &:hover { - background-color: var(--color-autocompoleter-background); + background-color: var(--color-autocomplete-background); } &:empty { @@ -23,12 +24,13 @@ > li { cursor: pointer; - padding: 5px 0 5px 10px; + padding: 8px 0 8px 8px; &.active, &:active, - &:focus { - background-color: var(--color-base); + &:focus, + &:hover { + background-color: var(--color-autocomplete-background-hover); a:active, a:focus, @@ -45,8 +47,8 @@ &.open { display: block; - background-color: var(--color-autocompleter-background); - border: 1px solid var(--color-base); + background-color: var(--color-autocomplete-background); + border: 1px solid var(--color-base-border); max-height: 500px; overflow-y: auto; z-index: 100; @@ -63,7 +65,6 @@ } .autocomplete > ul > li { - padding: 7px 0 7px 10px; border-bottom: 1px solid var(--color-result-top-border); text-align: left; } -- cgit v1.2.3 From 3daa024c04d9e6133d456d9c103b5f67fa15f643 Mon Sep 17 00:00:00 2001 From: MrPaulBlack Date: Fri, 8 Oct 2021 16:06:48 +0200 Subject: [simple theme] new color theme and result on mobile and tablet * clean up vars in defenition * results look now the same on mobile and desktop * reworked results on mobile * new color theme with more vibrant colors --- searx/static/themes/simple/src/less/autocomplete.less | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) (limited to 'searx/static/themes/simple/src/less/autocomplete.less') diff --git a/searx/static/themes/simple/src/less/autocomplete.less b/searx/static/themes/simple/src/less/autocomplete.less index 4dbb68d46..0c0ae3f32 100644 --- a/searx/static/themes/simple/src/less/autocomplete.less +++ b/searx/static/themes/simple/src/less/autocomplete.less @@ -48,7 +48,8 @@ &.open { display: block; background-color: var(--color-autocomplete-background); - border: 1px solid var(--color-base-border); + color: var(--color-autocomplete-font); + border: 1px solid var(--color-autocomplete-border); max-height: 500px; overflow-y: auto; z-index: 100; -- cgit v1.2.3