mirrors/searxng
1
0
Fork 0
mirror of https://github.com/searxng/searxng.git synced 2025-03-12 23:42:40 +00:00
Code Issues Projects Releases Wiki Activity

[web-client] simple theme: stylelint-prettier LESS source files

Browse source 
Signed-off-by: Markus Heiser <markus.heiser@darmarit.de>
This commit is contained in:
Markus Heiser 2025-02-05 13:17:04 +01:00 committed by Markus Heiser
parent a8ed79b730
commit d29ca7d593
10 changed files with 79 additions and 40 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

14
client/simple/src/less/definitions.less
View file

@ -55,7 +55,7 @@
--color-autocomplete-background: #fff;
--color-autocomplete-background-hover: #e3e3e3;
/// Answer Colors
--color-answer-font: #444; // same as --color-base-font
--color-answer-font: #444; // same as --color-base-font
--color-answer-background: #fff;
/// Results Colors
--color-result-background: #fff;
@ -284,7 +284,7 @@
/// Device Size
/// @desktop > @tablet
@tablet: 79.75em; // see https://github.com/searxng/searxng/issues/874
@tablet: 79.75em; // see https://github.com/searxng/searxng/issues/874
@phone: 50em;
@small-phone: 35em;
@ultra-small-phone: 20rem;
@ -293,12 +293,12 @@
@stacked-bar-chart: rgb(0, 0, 0);
/// Load fonts from this directory.
@icon-font-path: "../../../fonts/";
@icon-font-path: "../../../fonts/";
//** File name for all font files.
@icon-font-name: "glyphicons-halflings-regular";
@icon-font-name: "glyphicons-halflings-regular";
//** Element ID within SVG icon file.
@icon-font-svg-id: "glyphicons_halflingsregular";
@icon-font-svg-id: "glyphicons_halflingsregular";
// decoration of the select HTML elements
@select-light-svg-path: "../svg/select-light.svg";
@select-dark-svg-path: "../svg/select-dark.svg";
@select-light-svg-path: "../svg/select-light.svg";
@select-dark-svg-path: "../svg/select-dark.svg";

4
client/simple/src/less/detail.less
View file

@ -203,7 +203,9 @@ article.result-images .detail {
}
}
#results.image-detail-open.scrolling article.result-images[data-vim-selected] .detail {
#results.image-detail-open.scrolling
article.result-images[data-vim-selected]
.detail {
top: 0;
a.result-images-source img {

18
client/simple/src/less/embedded.less
View file

@ -1,14 +1,17 @@
iframe[src^="https://w.soundcloud.com"] {
iframe[src^="https://w.soundcloud.com"]
{
height: 120px;
}
iframe[src^="https://www.deezer.com"] {
iframe[src^="https://www.deezer.com"]
{
// The real size is 92px, but 94px are needed to avoid an inner scrollbar of
// the embedded HTML.
height: 94px;
}
iframe[src^="https://www.mixcloud.com"] {
iframe[src^="https://www.mixcloud.com"]
{
// the embedded player from mixcloud has some quirks: initial there is an
// issue with an image URL that is blocked since it is an a Cross-Origin
// request. The alternative text (<img alt='Mixcloud Logo'> then cause an
@ -18,16 +21,19 @@ iframe[src^="https://www.mixcloud.com"] {
height: 250px;
}
iframe[src^="https://bandcamp.com/EmbeddedPlayer"] {
iframe[src^="https://bandcamp.com/EmbeddedPlayer"]
{
// show playlist
height: 350px;
}
iframe[src^="https://bandcamp.com/EmbeddedPlayer/track"] {
iframe[src^="https://bandcamp.com/EmbeddedPlayer/track"]
{
// hide playlist
height: 120px;
}
iframe[src^="https://genius.com/songs"] {
iframe[src^="https://genius.com/songs"]
{
height: 65px;
}

2
client/simple/src/less/index.less
View file

@ -6,7 +6,7 @@
text-align: center;
.title {
background: url('../img/searxng.png') no-repeat;
background: url("../img/searxng.png") no-repeat;
min-height: 4rem;
margin: 4rem auto;
background-position: center;

2
client/simple/src/less/new_issue.less
View file

@ -9,7 +9,7 @@
display: none;
}
input[type=checked] {
input[type="checked"] {
position: absolute;
}

4
client/simple/src/less/search.less
View file

@ -83,7 +83,9 @@ button.category_button {
}
// only used when JavaScript is disabled
.no-js #categories_container:has(button.category_button:focus-within) button.category_button {
.no-js
#categories_container:has(button.category_button:focus-within)
button.category_button {
&.selected {
color: var(--color-base-font);
border-bottom: none;

10
client/simple/src/less/style-center.less
View file

@ -63,9 +63,11 @@ on the /search URL and when the "center alignment" preference is enabled.
}
#search_header {
grid-template-columns: calc(50% - 4.5rem - var(--center-page-width) / 2) 3rem var(--center-page-width);
grid-template-columns:
calc(50% - 4.5rem - var(--center-page-width) / 2)
3rem var(--center-page-width);
grid-template-areas: "na logo search" "na spacer categories";
column-gap: 1.2rem; // from search.less
column-gap: 1.2rem; // from search.less
width: 100%;
padding-left: 0;
padding-right: 0;
@ -94,7 +96,9 @@ on the /search URL and when the "center alignment" preference is enabled.
&:not(.only_template_images, .image-detail-open) {
// the gap is set in style.less
.ltr-margin-left(1.5rem);
grid-template-columns: calc(var(--center-page-width) - @results-gap - @results-sidebar-width) @results-sidebar-width;
grid-template-columns:
calc(var(--center-page-width) - @results-gap - @results-sidebar-width)
@results-sidebar-width;
#backToTop {
.ltr-left(calc(50% - @results-sidebar-width - @results-gap + 1rem + var(--center-page-width) / 2));

14
client/simple/src/less/style-rtl.less
View file

@ -109,7 +109,11 @@
}
// Image detail
#results.image-detail-open article.result-images[data-vim-selected] .detail .result-images-labels p {
#results.image-detail-open
article.result-images[data-vim-selected]
.detail
.result-images-labels
p {
direction: rtl;
&.result-url {
@ -125,7 +129,13 @@
}
// select HTML element
@supports ((background-position-x: 100%) and ((appearance: none) or (-webkit-appearance: none) or (-moz-appearance: none))) {
@supports (
(background-position-x: 100%) and
(
(appearance: none) or (-webkit-appearance: none) or
(-moz-appearance: none)
)
) {
select {
border-width: 0 0 0 2rem;
background-position-x: -2rem;

16
client/simple/src/less/style.less
View file

@ -544,12 +544,11 @@ article[data-vim-selected].category-social {
.ltr-margin-left(@results-offset);
display: grid;
grid-template:
"corrections sidebar" min-content
"answers sidebar" min-content
"urls sidebar" 1fr
"pagination sidebar" min-content
/ @results-width @results-sidebar-width
;
"corrections sidebar" min-content
"answers sidebar" min-content
"urls sidebar" 1fr
"pagination sidebar" min-content
/ @results-width @results-sidebar-width;
gap: 0 @results-gap;
}
@ -782,7 +781,7 @@ summary.title {
padding: 0.4rem;
margin-left: 0.5rem;
border-radius: 0.3rem;
display: none; // will be shown by JS.
display: none; // will be shown by JS.
}
}
@ -979,8 +978,7 @@ summary.title {
"sidebar" min-content
"urls" 1fr
"pagination" min-content
/ @results-width
;
/ @results-width;
gap: 0;
}
}

35
client/simple/src/less/toolkit.less
View file

@ -249,7 +249,7 @@ ul.tabs {
order: 2;
}
& > input[type=radio] {
& > input[type="radio"] {
display: none;
}
@ -347,14 +347,21 @@ select {
}
}
@supports ((background-position-x: 100%) and ((appearance: none) or (-webkit-appearance: none) or (-moz-appearance: none))) {
@supports (
(background-position-x: 100%) and
(
(appearance: none) or (-webkit-appearance: none) or
(-moz-appearance: none)
)
) {
select {
appearance: none;
-webkit-appearance: none;
-moz-appearance: none;
border-width: 0 2rem 0 0;
border-color: transparent;
background: data-uri('image/svg+xml;charset=UTF-8', @select-light-svg-path) no-repeat;
background: data-uri("image/svg+xml;charset=UTF-8", @select-light-svg-path)
no-repeat;
background-position-x: calc(100% + 2rem);
background-size: 2rem;
background-origin: content-box;
@ -376,12 +383,18 @@ select {
@media (prefers-color-scheme: dark) {
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);
background-image: data-uri(
"image/svg+xml;charset=UTF-8",
@select-dark-svg-path
);
}
}
@ -461,7 +474,7 @@ input.checkbox-onoff.reversed-checkbox[type="checkbox"] {
/* -- checkbox -- */
@supports (transform: rotate(-45deg)) {
input[type=checkbox]:not(.checkbox-onoff) {
input[type="checkbox"]:not(.checkbox-onoff) {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
@ -476,7 +489,7 @@ input.checkbox-onoff.reversed-checkbox[type="checkbox"] {
.rounded-corners(0.3em);
&::after {
content: '';
content: "";
width: 9px;
height: 5px;
position: absolute;
@ -497,14 +510,18 @@ input.checkbox-onoff.reversed-checkbox[type="checkbox"] {
}
// disabled : can't be focused, show only the check mark
input[type=checkbox][disabled]:not(.checkbox-onoff) {
input[type="checkbox"][disabled]:not(.checkbox-onoff) {
border: inherit;
background-color: transparent !important;
cursor: inherit;
}
// if not checked and possible to checked then display a "light" check mark on hover
input.checkbox[type=checkbox]:not(:checked, [disabled], .checkbox-onoff):hover::after {
input.checkbox[type="checkbox"]:not(
:checked,
[disabled],
.checkbox-onoff
):hover::after {
opacity: 0.5;
}
}