Skip to content
GitLab
Menu
Projects
Groups
Snippets
/
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Sign in / Register
Toggle navigation
Menu
Open sidebar
e
infra
spot
Commits
f103ddca
Commit
f103ddca
authored
Oct 08, 2021
by
Israel Yago Pereira
Committed by
Arnau Vàzquez
Oct 08, 2021
Browse files
Light and dark styles. Disable non-e searx themes.
parent
ede69396
Changes
48
Expand all
Hide whitespace changes
Inline
Side-by-side
.gitattributes
View file @
f103ddca
searx/static/css/bootstrap.min.css -diff
searx/static/js/bootstrap.min.js -diff
searx/static/themes/oscar/css/logicodev.min.css -diff
searx/static/themes/oscar/css/leaflet.min.css -diff
searx/static/themes/oscar/css/pointhi.min.css -diff
searx/static/themes/oscar/js/searx.min.js -diff
searx/static/themes/simple/css/searx.min.css -diff
searx/static/themes/simple/css/searx-rtl.min.css -diff
searx/static/themes/simple/js/searx.min.js -diff
searx/static/themes/simple/js/searx.min.js.map -diff
Makefile
View file @
f103ddca
...
...
@@ -117,18 +117,14 @@ node.clean:
$(Q)
rm
-rf
\
./node_modules
\
./package-lock.json
\
./searx/static/themes/oscar/package-lock.json
\
./searx/static/themes/oscar/node_modules
\
./searx/static/themes/simple/package-lock.json
\
./searx/static/themes/simple/node_modules
\
./searx/static/themes/etheme/package-lock.json
\
./searx/static/themes/etheme/node_modules
# build themes
# ------------
PHONY
+=
themes
themes.oscar themes.simple
themes.etheme
themes
:
buildenv
themes.oscar themes.simple
themes.etheme
PHONY
+=
themes themes.etheme
themes
:
buildenv themes.etheme
quiet_cmd_lessc
=
LESSC
$3
cmd_lessc
=
PATH
=
"
$$
(npm bin):
$$
PATH"
\
...
...
@@ -138,14 +134,6 @@ quiet_cmd_grunt = GRUNT $2
cmd_grunt
=
PATH
=
"
$$
(npm bin):
$$
PATH"
\
grunt
--gruntfile
"
$2
"
themes.oscar
:
node.env
$(Q)
echo
'[!] build oscar theme'
$(
call
cmd,grunt,searx/static/themes/oscar/gruntfile.js
)
themes.simple
:
node.env
$(Q)
echo
'[!] build simple theme'
$(
call
cmd,grunt,searx/static/themes/simple/gruntfile.js
)
themes.etheme
:
node.env
$(Q)
echo
'[!] build etheme theme'
$(
call
cmd,grunt,searx/static/themes/etheme/gruntfile.js
)
...
...
manage.sh
View file @
f103ddca
...
...
@@ -90,14 +90,6 @@ npm_packages() {
cd
--
"
$BASE_DIR
"
npm
install
less@2.7 less-plugin-clean-css grunt-cli
echo
'[!] install NPM packages for oscar theme'
cd
--
"
$BASE_DIR
/searx/static/themes/oscar"
npm
install
echo
'[!] install NPM packages for simple theme'
cd
--
"
$BASE_DIR
/searx/static/themes/simple"
npm
install
echo
'[!] install NPM packages for etheme theme'
cd
--
"
$BASE_DIR
/searx/static/themes/etheme"
npm
install
...
...
package-lock.json
0 → 100644
View file @
f103ddca
This diff is collapsed.
Click to expand it.
searx/preferences.py
View file @
f103ddca
...
...
@@ -377,6 +377,10 @@ class Preferences:
is_locked
(
'theme'
),
choices
=
themes
),
'etheme-style'
:
EnumStringSetting
(
settings
[
'ui'
].
get
(
'theme_args'
,
{}).
get
(
'ethemestyle'
,
'light'
),
is_locked
(
'etheme-style'
),
choices
=
[
''
,
'light'
,
'dark'
]),
'results_on_new_tab'
:
MapSetting
(
settings
[
'ui'
].
get
(
'results_on_new_tab'
,
False
),
is_locked
(
'results_on_new_tab'
),
...
...
searx/static/themes/etheme/.gitignore
0 → 100644
View file @
f103ddca
/node_modules
searx/static/themes/etheme/css/etheme-dark.css
0 → 100644
View file @
f103ddca
:root
.dark-mode
{
--color-main-text
:
#d8d8d8
;
--color-main-background
:
#1c1c1c
;
--color-main-background-translucent
:
#181818
;
--color-background-hover
:
#0e0e0e
;
--color-background-dark
:
#222
;
--color-background-darker
:
#2c2c2c
;
--color-placeholder-light
:
#323232
;
--color-placeholder-dark
:
#4b4b4b
;
--color-primary
:
#007fff
;
--color-primary-light
:
#16222f
;
--color-primary-text
:
#fff
;
--color-primary-text-dark
:
#ededed
;
--color-primary-element
:
#007fff
;
--color-primary-element-light
:
#4da5ff
;
--color-error
:
#fb3846
;
--color-delete
:
#fb3846
;
--color-warning
:
#eca700
;
--color-success
:
#38d874
;
--color-text-maxcontrast
:
#fff
;
--color-text-light
:
#d8d8d8
;
--color-text-lighter
:
#8c8c8c
;
--color-loading-light
:
#777
;
--color-loading-dark
:
#ccc
;
--color-box-shadow
:
rgba
(
0
,
0
,
0
,
0.5
);
--color-border
:
#2a2a2a
;
--color-border-dark
:
#3c3c3c
;
--border-radius
:
3px
;
--border-radius-large
:
10px
;
--border-radius-pill
:
100px
;
--font-face
:
-apple-system
,
BlinkMacSystemFont
,
'Segoe UI'
,
Roboto
,
Oxygen-Sans
,
Cantarell
,
Ubuntu
,
'Helvetica Neue'
,
Arial
,
'Noto Color Emoji'
,
sans-serif
,
'Apple Color Emoji'
,
'Segoe UI Emoji'
,
'Segoe UI Symbol'
;
--default-font-size
:
14px
;
--default-line-height
:
24px
;
--animation-quick
:
100ms
;
--animation-slow
:
300ms
;
--header-height
:
50px
;
--text-muted-normal-alpha
:
rgba
(
216
,
216
,
216
,
0.8
);
--input-border-color
:
rgba
(
255
,
255
,
255
,
0.24
);
--input-text-color
:
var
(
--color-main-text
);
--select-border-color
:
var
(
--input-border-color
);
--text-color-hl
:
#c2d2dc
;
--dropdown-bg-color
:
#333333
;
--link-color
:
var
(
--color-primary
);
--color-accent--dark
:
#24527e
;
--nav-text-color
:
var
(
--color-main-text
);
--nav-background-color
:
#363636
;
}
:root
.dark-mode
.select2-selection__arrow
{
background
:
url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA8AAAAPCAYAAAA71pVKAAAAAXNSR0IArs4c6QAAAIhJREFUOE/FUkEOwCAIo/z/zbCAQjCyzMTDPBmlLS2ALg4usHQHFlE1dWYcE4mqQokQ4FOCWr+AvwjUJK0IRK5sd2OzS3wwdgvRqnoV3Gb6HKzjwx5RMhCR0HEJZnbcEpL7yRZGUXqc7zXYLeFsYC5AcjUTacdTE40l6kb5OtuTER4vRrfG/4Eft2BLALbkjNwAAAAASUVORK5CYII=")
96%
no-repeat
;
}
:root
.dark-mode
.result_header
a
{
color
:
var
(
--color-main-text
);
}
:root
.dark-mode
#nav_toggle_btn
{
fill
:
var
(
--color-main-text
);
}
searx/static/themes/etheme/css/etheme-dark.min.css
0 → 100644
View file @
f103ddca
:root
.dark-mode
{
--color-main-text
:
#d8d8d8
;
--color-main-background
:
#1c1c1c
;
--color-main-background-translucent
:
#181818
;
--color-background-hover
:
#0e0e0e
;
--color-background-dark
:
#222
;
--color-background-darker
:
#2c2c2c
;
--color-placeholder-light
:
#323232
;
--color-placeholder-dark
:
#4b4b4b
;
--color-primary
:
#007fff
;
--color-primary-light
:
#16222f
;
--color-primary-text
:
#fff
;
--color-primary-text-dark
:
#ededed
;
--color-primary-element
:
#007fff
;
--color-primary-element-light
:
#4da5ff
;
--color-error
:
#fb3846
;
--color-delete
:
#fb3846
;
--color-warning
:
#eca700
;
--color-success
:
#38d874
;
--color-text-maxcontrast
:
#fff
;
--color-text-light
:
#d8d8d8
;
--color-text-lighter
:
#8c8c8c
;
--color-loading-light
:
#777
;
--color-loading-dark
:
#ccc
;
--color-box-shadow
:
rgba
(
0
,
0
,
0
,
.5
);
--color-border
:
#2a2a2a
;
--color-border-dark
:
#3c3c3c
;
--border-radius
:
3px
;
--border-radius-large
:
10px
;
--border-radius-pill
:
100px
;
--font-face
:
-apple-system
,
BlinkMacSystemFont
,
'Segoe UI'
,
Roboto
,
Oxygen-Sans
,
Cantarell
,
Ubuntu
,
'Helvetica Neue'
,
Arial
,
'Noto Color Emoji'
,
sans-serif
,
'Apple Color Emoji'
,
'Segoe UI Emoji'
,
'Segoe UI Symbol'
;
--default-font-size
:
14px
;
--default-line-height
:
24px
;
--animation-quick
:
100ms
;
--animation-slow
:
300ms
;
--header-height
:
50px
;
--text-muted-normal-alpha
:
rgba
(
216
,
216
,
216
,
.8
);
--input-border-color
:
rgba
(
255
,
255
,
255
,
.24
);
--input-text-color
:
var
(
--color-main-text
);
--select-border-color
:
var
(
--input-border-color
);
--text-color-hl
:
#c2d2dc
;
--dropdown-bg-color
:
#333
;
--link-color
:
var
(
--color-primary
);
--color-accent--dark
:
#24527e
;
--nav-text-color
:
var
(
--color-main-text
);
--nav-background-color
:
#363636
}
:root
.dark-mode
.select2-selection__arrow
{
background
:
url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA8AAAAPCAYAAAA71pVKAAAAAXNSR0IArs4c6QAAAIhJREFUOE/FUkEOwCAIo/z/zbCAQjCyzMTDPBmlLS2ALg4usHQHFlE1dWYcE4mqQokQ4FOCWr+AvwjUJK0IRK5sd2OzS3wwdgvRqnoV3Gb6HKzjwx5RMhCR0HEJZnbcEpL7yRZGUXqc7zXYLeFsYC5AcjUTacdTE40l6kb5OtuTER4vRrfG/4Eft2BLALbkjNwAAAAASUVORK5CYII=)
96%
no-repeat
}
:root
.dark-mode
.result_header
a
{
color
:
var
(
--color-main-text
)}
:root
.dark-mode
#nav_toggle_btn
{
fill
:
var
(
--color-main-text
)}
\ No newline at end of file
searx/static/themes/etheme/css/etheme.css
View file @
f103ddca
:root
{
--color-primary
:
#007fff
;
--color-primary-element
:
#007fff
;
--color-secondary-element
:
white
;
--border-color-secondary-element
:
#007fff
;
--color-primary-element-light
:
#007fff
;
--color-error
:
#fb3845
;
--color-delete
:
#e9322d
;
--color-success
:
#3ad975
;
--color-main-background
:
#ffffff
;
--color-main-background-translucent
:
#f2f2f2
;
--color-main-text
:
#000000
;
--color-background-hover
:
white
;
--color-text-maxcontrast
:
black
;
--color-border-dark
:
#e6e6e6
;
--color-border
:
#e6e6e6
;
--icon-settings-dark-000
:
#000000
;
--icon-inactive-color
:
#808080
;
--icon-active-color
:
#007fff
;
--input-background-color
:
white
;
--menu-icon-color
:
#222
;
--color-dashboard-panels
:
#f2f2f2
;
--color-dashboard-background-plain
:
#d2d2d2
;
--text-muted-normal-alpha
:
rgba
(
0
,
0
,
0
,
0.4
);
--input-border-color
:
rgba
(
0
,
0
,
0
,
0.24
);
--input-text-color
:
black
;
--select-border-color
:
rgba
(
0
,
0
,
0
,
0.2
);
--select-selected-text-color
:
white
;
--text-color-hl
:
#5c6469
;
--dropdown-bg-color
:
#eeeeee
;
--link-color
:
#007fff
;
--color-accent--dark
:
#2344a2
;
--nav-text-color
:
#868686
;
--nav-background-color
:
white
;
--color-main-text
:
#60686f
;
--color-primary
:
#1f6ed7
;
--color-delete
:
#e06572
;
}
.container-padding
,
nav
{
padding-left
:
16px
;
...
...
@@ -80,7 +118,7 @@ a {
max-width
:
70%
;
}
#errors
{
border
:
2px
solid
#e06572
;
border
:
2px
solid
var
(
--color-delete
)
;
border-radius
:
8px
;
padding
:
8px
;
}
...
...
@@ -89,7 +127,7 @@ a {
margin-bottom
:
8px
;
}
#errors
pre
{
background-color
:
rgba
(
224
,
101
,
114
,
0.1
);
background-color
:
var
(
--color-error
);
}
.inline
{
display
:
flex
;
...
...
@@ -167,16 +205,16 @@ a {
box-sizing
:
border-box
;
}
.text-muted
{
color
:
rgba
(
0
,
0
,
0
,
0.4
);
color
:
var
(
--text-muted-normal-alpha
);
}
.danger
,
.btn.danger
{
color
:
#e06572
;
color
:
var
(
--color-delete
)
;
}
.widget
,
.btn
,
.custom-select
:not
(
.flat
)
{
border
:
2px
solid
rgba
(
0
,
0
,
0
,
0.2
);
border
:
2px
solid
var
(
--select-border-color
);
padding
:
4px
12px
;
background-color
:
transparent
;
transition
:
border-color
0.2s
ease-in-out
,
color
0.2s
ease-in-out
,
background-color
0.2s
ease-in-out
;
...
...
@@ -190,33 +228,34 @@ a {
font-size
:
16px
;
font-weight
:
bold
;
cursor
:
pointer
;
color
:
var
(
--color-main-text
);
}
.btn
:not
(
:disabled
)
{
color
:
#5068dd
;
border-color
:
#5068dd
;
color
:
var
(
--color-primary
)
;
border-color
:
var
(
--color-primary
)
;
}
.btn
:hover:not
(
:disabled
)
{
border-color
:
#2344a2
;
color
:
#2344a2
;
border-color
:
var
(
--color-accent--dark
)
;
color
:
var
(
--color-accent--dark
)
;
}
.btn.primary
,
input
.btn
[
type
=
"submit"
]
{
background-color
:
#5068dd
;
background-color
:
var
(
--color-primary
)
;
color
:
#ffffff
;
border-color
:
rgba
(
0
,
0
,
0
,
0.2
);
}
.btn.primary
:hover
,
input
.btn
[
type
=
"submit"
]
:hover
{
color
:
#ffffff
;
background-color
:
#2344a2
;
background-color
:
var
(
--color-accent--dark
)
;
}
.btn.danger
{
color
:
#e06572
;
border-color
:
#e06572
;
color
:
var
(
--color-delete
)
;
border-color
:
var
(
--color-delete
)
;
}
.btn.danger
:hover
{
border-color
:
rgba
(
0
,
0
,
0
,
0.2
);
background-color
:
#e06572
;
background-color
:
var
(
--color-delete
)
;
color
:
#ffffff
;
}
.btn.btn-flat
{
...
...
@@ -225,7 +264,7 @@ input.btn[type="submit"]:hover {
background-color
:
transparent
;
}
.btn.btn-flat
:hover
{
color
:
#2344a2
;
color
:
var
(
--color-accent--dark
)
;
}
.btn.plain-white
{
border-color
:
rgba
(
255
,
255
,
255
,
0.4
);
...
...
@@ -233,10 +272,10 @@ input.btn[type="submit"]:hover {
background-color
:
rgba
(
0
,
0
,
0
,
0.5
);
}
.checkmark
.icon
{
fill
:
#60686f
;
fill
:
var
(
--color-main-text
)
;
}
.checkmark
.icon.checked
{
fill
:
#5068dd
;
fill
:
var
(
--color-primary
)
;
}
.checkmark_input
{
display
:
none
;
...
...
@@ -264,14 +303,7 @@ input.btn[type="submit"]:hover {
-webkit-appearance
:
none
;
-moz-appearance
:
none
;
font-weight
:
normal
;
background
:
url
(
data
:
image
/
png
;
base64,iVBORw0KGgoAAAANSUhEUgAAAA8AAAAPCAQAAACR313BAAAABGdBTUEAALGPC/xhBQAAACBjSFJN
AAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAAAmJLR0QA/4ePzL8AAAAJcEhZ
cwAABFkAAARZAVnbJUkAAAAHdElNRQfgBxgLDwB20OFsAAAAbElEQVQY073OsQ3CMAAEwJMYwJGn
sAehpoXJItltBkmcdZBYgIIiQoLglnz3ui+eP+bk5uneteTMZJa6OJuIqvYzSJoqwqBq8gdmTTW8
6/dghxAUq4xsVYT9laBYXCw93Aajh7GPEF23t4fkBYevGFTANkPRAAAAJXRFWHRkYXRlOmNyZWF0
ZQAyMDE2LTA3LTI0VDExOjU1OjU4KzAyOjAwRFqFOQAAACV0RVh0ZGF0ZTptb2RpZnkAMjAxNi0w
Ny0yNFQxMToxNTowMCswMjowMP7RDgQAAAAZdEVYdFNvZnR3YXJlAHd3dy5pbmtzY2FwZS5vcmeb
7jwaAAAAAElFTkSuQmCC)
96%
no-repeat;
background
:
url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA8AAAAPCAQAAACR313BAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAAAmJLR0QA/4ePzL8AAAAJcEhZcwAABFkAAARZAVnbJUkAAAAHdElNRQfgBxgLDwB20OFsAAAAbElEQVQY073OsQ3CMAAEwJMYwJGnsAehpoXJItltBkmcdZBYgIIiQoLglnz3ui+eP+bk5uneteTMZJa6OJuIqvYzSJoqwqBq8gdmTTW86/dghxAUq4xsVYT9laBYXCw93Aajh7GPEF23t4fkBYevGFTANkPRAAAAJXRFWHRkYXRlOmNyZWF0ZQAyMDE2LTA3LTI0VDExOjU1OjU4KzAyOjAwRFqFOQAAACV0RVh0ZGF0ZTptb2RpZnkAMjAxNi0wNy0yNFQxMToxNTowMCswMjowMP7RDgQAAAAZdEVYdFNvZnR3YXJlAHd3dy5pbmtzY2FwZS5vcmeb7jwaAAAAAElFTkSuQmCC")
96%
no-repeat
;
}
.custom-select.flat
{
border
:
none
;
...
...
@@ -280,17 +312,60 @@ Ny0yNFQxMToxNTowMCswMjowMP7RDgQAAAAZdEVYdFNvZnR3YXJlAHd3dy5pbmtzY2FwZS5vcmeb
width
:
100%
;
border-radius
:
50px
;
}
span
.select2-selection.select2-selection--single
{
background-color
:
var
(
--color-main-background
);
border
:
2px
solid
var
(
--select-border-color
);
border-radius
:
14px
;
}
.select2-container--open
.select2-dropdown--below
{
background-color
:
var
(
--color-main-background
);
border
:
2px
solid
var
(
--select-border-color
);
border-top
:
none
;
}
.select2-container--default
.select2-selection--single
.select2-selection__arrow
{
right
:
0.5rem
;
background
:
url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA8AAAAPCAQAAACR313BAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAAAmJLR0QA/4ePzL8AAAAJcEhZcwAABFkAAARZAVnbJUkAAAAHdElNRQfgBxgLDwB20OFsAAAAbElEQVQY073OsQ3CMAAEwJMYwJGnsAehpoXJItltBkmcdZBYgIIiQoLglnz3ui+eP+bk5uneteTMZJa6OJuIqvYzSJoqwqBq8gdmTTW86/dghxAUq4xsVYT9laBYXCw93Aajh7GPEF23t4fkBYevGFTANkPRAAAAJXRFWHRkYXRlOmNyZWF0ZQAyMDE2LTA3LTI0VDExOjU1OjU4KzAyOjAwRFqFOQAAACV0RVh0ZGF0ZTptb2RpZnkAMjAxNi0wNy0yNFQxMToxNTowMCswMjowMP7RDgQAAAAZdEVYdFNvZnR3YXJlAHd3dy5pbmtzY2FwZS5vcmeb7jwaAAAAAElFTkSuQmCC")
96%
no-repeat
;
}
.select2-container--default
.select2-selection--single
.select2-selection__arrow
b
{
display
:
none
;
}
.select2-container--default
.select2-selection--single
.select2-selection__rendered
{
color
:
var
(
--color-text-maxcontrast
);
padding
:
4px
12px
4px
12px
;
line-height
:
normal
;
font-size
:
13.3px
;
}
.select2-container--default
.select2-search--dropdown
.select2-search__field
{
background-color
:
var
(
--color-main-background
);
}
.select2-container--default
.select2-results__option--highlighted
[
aria-selected
]
{
background-color
:
var
(
--color-primary
);
color
:
var
(
--select-selected-text-color
);
}
.select2-container--default
.select2-results__option
[
aria-selected
=
true
]
{
background-color
:
var
(
--color-accent--dark
);
color
:
var
(
--select-selected-text-color
);
}
#time_and_lang
span
.select2-selection.select2-selection--single
{
border
:
none
;
}
#time_and_lang
.select2-container--default
.select2-selection--single
.select2-selection__rendered
{
margin-right
:
1rem
;
color
:
var
(
--nav-text-color
);
font-size
:
14px
;
}
html
{
position
:
relative
;
min-height
:
100%
;
color
:
#60686f
;
color
:
var
(
--color-main-text
)
;
}
body
{
margin
:
0px
;
padding
:
0px
;
font-size
:
16px
;
margin-bottom
:
120px
;
background-color
:
white
;
background-color
:
var
(
--color-main-background
);
transition
:
background-color
0.2s
ease-in-out
;
font-family
:
'Roboto'
,
"Cantarell"
,
Helvetica
,
Arial
,
sans-serif
;
}
body
.lock
{
...
...
@@ -302,9 +377,17 @@ body * {
input
,
select
{
box-shadow
:
none
!important
;
color
:
var
(
--input-text-color
);
}
option
{
background-color
:
var
(
--color-main-background
);
}
.input-current-preferences
{
background-color
:
var
(
--color-main-background
);
border
:
1px
inset
var
(
--color-main-text
);
}
a
{
color
:
#1f6ed7
;
color
:
var
(
--link-color
)
;
}
a
,
select
,
...
...
@@ -318,7 +401,7 @@ select:hover {
text-decoration
:
none
;
}
label
{
color
:
#5c6469
;
color
:
var
(
--text-color-hl
)
;
}
section
{
margin-bottom
:
32px
;
...
...
@@ -405,21 +488,37 @@ footer .links > :first-child {
display
:
inline-block
;
margin-right
:
8px
;
}
.separator
{
margin
:
0
0.75rem
;
border-bottom
:
none
;
}
.show-mobile-mq
{
display
:
none
;
}
@media
screen
and
(
max-width
:
600px
)
{
.hide-mobile-mq
{
display
:
none
;
}
.show-mobile-mq
{
display
:
block
;
}
}
nav
{
height
:
48px
;
display
:
flex
;
align-items
:
center
;
justify-content
:
space-between
;
text-transform
:
capitalize
;
line-height
:
20px
;
margin-bottom
:
24px
;
}
nav
a
{
color
:
#868686
;
color
:
var
(
--nav-text-color
)
;
}
nav
a
:hover
{
color
:
#5068dd
;
color
:
var
(
--color-primary
)
;
}
nav
#
etheme_links
>
*
{
nav
.
etheme_links
>
a
{
margin-right
:
32px
;
}
#nav_toggle_btn
{
...
...
@@ -432,7 +531,7 @@ nav #etheme_links > * {
top
:
0
;
flex-direction
:
column
;
height
:
100%
;
background-color
:
white
;
background-color
:
var
(
--nav-background-color
)
;
z-index
:
1000
;
width
:
280px
;
min-width
:
280px
;
...
...
@@ -446,11 +545,11 @@ nav #etheme_links > * {
margin-top
:
8px
;
}
nav
>
:last-child
{
margin-bottom
:
8
px
;
margin-bottom
:
16
px
;
}
nav
a
{
display
:
block
;
padding
:
8
px
16px
;
padding
:
16
px
16px
;
}
#nav_toggle_btn
{
display
:
block
;
...
...
@@ -482,11 +581,67 @@ nav #etheme_links > * {
transform
:
translateX
(
100%
);
}
}
.nav_dark-mode
{
padding
:
1rem
;
padding-right
:
3rem
;
color
:
var
(
--nav-text-color
);
}
.nav_dark-mode
.nav_dark-mode--label
{
margin-right
:
0.5rem
;
}
.nav_dark-mode
.nav_dark-mode--label
label
{
cursor
:
pointer
;
}
.switch
{
position
:
relative
;
display
:
inline-block
;
width
:
36px
;
height
:
20px
;
margin-right
:
0.75rem
;
}
.switch
input
{
opacity
:
0
;
width
:
0
;
height
:
0
;
}
.slider
{
position
:
absolute
;
cursor
:
pointer
;
top
:
0
;
left
:
0
;
right
:
0
;
bottom
:
0
;
background-color
:
#ccc
;
transition
:
.4s
;
border-radius
:
34px
;
}
.slider
:before
{
position
:
absolute
;
content
:
""
;
height
:
16px
;
width
:
16px
;
left
:
2px
;
bottom
:
2px
;
background-color
:
white
;
transition
:
.4s
;
border-radius
:
50%
;
}
input
:checked
+
.slider
{
background-color
:
var
(
--color-primary
);
}
input
:focus
+
.slider
{
box-shadow
:
0
0
1px
var
(
--color-primary
);
}
input
:checked
+
.slider
:before
{
-webkit-transform
:
translateX
(
16px
);
-ms-transform
:
translateX
(
16px
);
transform
:
translateX
(
16px
);
}
#search_form
#search_input_container
{
position
:
relative
;
display
:
flex
;
align-items
:
center
;
border
:
2px
solid
rgba
(
0
,
0
,
0
,
0.24
);
border
:
2px
solid
var
(
--input-border-color
);
border-radius
:
50px
;
height
:
38px
;
}
...
...
@@ -518,12 +673,13 @@ nav #etheme_links > * {
align-items
:
center
;
justify-content
:
center
;
cursor
:
pointer
;
fill
:
var
(
--color-main-text
);
}
#search_form
#search_input_container
button
[
type
=
"submit"
]
.icon
{
transition
:
fill
0.2s
ease-in-out
,
transform
0.1s
ease-in-out
;
}
#search_form
#search_input_container
button
[
type
=
"submit"
]
:hover
.icon
{
fill
:
#5068dd
;
fill
:
var
(
--color-primary
)
;
transform
:
scale
(
1.2
);
}
#search_form
#logo
,
...
...
@@ -556,10 +712,10 @@ nav #etheme_links > * {
right
:
0
!important
;
top
:
calc
(
116%
)
!important
;
border-radius
:
8px
;
border
:
2px
solid
rgba
(
0
,
0
,
0
,
0.2
);
border
:
2px
solid
var
(
--input-border-color
);
width
:
100%
!important
;
box-sizing
:
border-box
!important
;
background-color
:
#eeeeee
;
background-color
:
var
(
--dropdown-bg-color
)
;
padding-left
:
16px
;
padding-right
:
16px
;
}
...
...
@@ -584,7 +740,7 @@ nav #etheme_links > * {
font-size
:
14px
;
}
#search_form
#search_params
select
{
color
:
rgba
(
0
,
0
,
0
,
0.5
);
color
:
var
(
--text-muted-normal-alpha
);
text-align
:
right
;
padding-right
:
32px
;
}
...
...
@@ -613,7 +769,7 @@ nav #etheme_links > * {
}
#search_form
.search_categories
input
[
type
=
"checkbox"
]
:checked
+
label
,
#search_form
#categories
input
[
type
=
"checkbox"
]
:checked
+
label
{
color
:
#5068dd
;
color
:
var
(
--color-primary
)
;
font-weight
:
bold
;
}
#search_form
#more_categories
{
...
...
@@ -622,8 +778,8 @@ nav #etheme_links > * {
display
:
flex
;
flex-direction
:
column
;
border-radius
:
8px
;
border
:
2px
solid
rgba
(
0
,
0
,
0
,
0.2
);
background-color
:
#eeeeee
;
border
:
2px
solid
var
(
--input-border-color
);
background-color
:
var
(
--dropdown-bg-color
)
;
padding-bottom
:
8px
;
padding-top
:
8px
;
left
:
0
;
...
...
@@ -718,7 +874,7 @@ nav #etheme_links > * {
.result
.result-template
{
font-weight
:
bold
;
text-transform
:
uppercase
;
color
:
rgba
(
0
,
0
,
0
,
0.4
);
color
:
var
(
--text-muted-normal-alpha
);
}
.result
.result-template
+
.result_header
{
margin-top
:
0
;
...
...
@@ -751,7 +907,7 @@ nav #etheme_links > * {
bottom
:
0
;
left
:
0
;
right
:
0
;
color
:
rgba
(
0
,
0
,
0
,
0.4
);
color
:
var
(
--text-muted-normal-alpha
);
font-weight
:
bold
;
padding
:
6px
16px
;
text-transform
:
uppercase
;
...
...
@@ -821,10 +977,10 @@ nav #etheme_links > * {
}
.result
.external-link
{
font-size
:
14px
;
color
:
#39a441
;
color
:
var
(
--color-success
)
;
}
.result
.extra-info
{
color
:
rgba
(
0
,
0
,
0
,
0.4
);
color
:
var
(
--text-muted-normal-alpha
);
}
.result
.code-block
{
background-color
:
rgba
(
0
,
0
,
0
,
0.03
);
...
...
@@ -918,7 +1074,7 @@ nav #etheme_links > * {
margin-bottom
:
0
;