zaclys/searxng
1
0
Fork 1
mirror of https://github.com/searxng/searxng synced 2024-01-01 19:24:07 +01:00
Code Issues Projects Releases Packages Wiki Activity

[fix 1/3] display checkboxes by default

Browse source 
The search tabs are actually labels for checkboxes because multiple can
be selected.  To still make them work like tabs the plugin
search_on_category_select adds a JavaScript that submits the form on
label click.

The problem with this is that when the plugin is disabled (e.g. because
JavaScript is disabled or a user chose to disable it in the settings),
then the tabs still look like tabs but act as checkboxes
(which is very confusing).

This commit changes fixes this so that the checkboxes are visible by
default.  The next commit makes the plugin hide them again. This way
they are visible when the plugin is disabled ... as they should be.
This commit is contained in:
Martin Fischer 2022-01-06 23:34:58 +01:00 • committed by Markus Heiser
parent 2c7dc9d358
commit bfc9207171
6 changed files with 34 additions and 25 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

7
searx/static/themes/oscar/src/less/logicodev/advanced.less
View file

@ -4,19 +4,16 @@
margin-bottom: 1rem;
clear: both;
label, .input-group-addon {
.category, .input-group-addon {
font-size: 1.2rem;
font-weight:normal;
background-color: white;
border: @mild-gray 1px solid;
border-right: none;
color: @dark-gray;
padding-bottom: 0.4rem;
padding-right: 0.7rem;
padding-left: 0.7rem;
}
label:last-child, .input-group-addon:last-child {
.category:last-child, .input-group-addon:last-child {
border-right: @mild-gray 1px solid;
}

18
searx/static/themes/oscar/src/less/logicodev/search.less
View file

@ -6,7 +6,7 @@
flex-flow: row wrap;
align-content: stretch;
label, .input-group-addon {
.category, .input-group-addon {
flex-grow: 1;
flex-basis: auto;
font-size: 1.2rem;
@ -15,13 +15,21 @@
border: @mild-gray 1px solid;
border-right: none;
color: @dark-gray;
padding-bottom: 0.4rem;
padding-top: 0.4rem;
text-align: center;
min-width: 50px;
display: flex;
flex-direction: column;
}
label:last-child, .input-group-addon:last-child {
border-right: @mild-gray 1px solid;
label {
flex-grow: 1;
margin-bottom: 0;
padding-bottom: 0.4rem;
padding-top: 0.4rem;
}
.category:last-child, .input-group-addon:last-child {
border-right: @mild-gray 1px solid;
}
input[type="checkbox"]:checked + label {

7
searx/static/themes/oscar/src/less/pointhi/advanced.less
View file

@ -4,19 +4,16 @@
margin-bottom: 1rem;
clear: both;
label, .input-group-addon {
.category, .input-group-addon {
font-size: 1.3rem;
font-weight:normal;
background-color: white;
border: #DDD 1px solid;
border-right: none;
color: #333;
padding-bottom: 0.8rem;
padding-left: 1.2rem;
padding-right: 1.2rem;
}
label:last-child, .input-group-addon:last-child {
.category:last-child, .input-group-addon:last-child {
border-right: #DDD 1px solid;
}

15
searx/static/themes/oscar/src/less/pointhi/search.less
View file

@ -6,7 +6,7 @@
flex-wrap: wrap;
align-content: stretch;
label, .input-group-addon {
.category, .input-group-addon {
flex-grow: 1;
flex-basis: auto;
font-size: 1.3rem;
@ -15,13 +15,20 @@
border: #DDD 1px solid;
border-right: none;
color: #333;
padding-bottom: 0.8rem;
padding-top: 0.8rem;
text-align: center;
min-width: 50px;
display: flex;
flex-direction: column;
}
label:last-child, .input-group-addon:last-child {
label {
flex-grow: 1;
margin-bottom: 0;
padding-bottom: 0.8rem;
padding-top: 0.8rem;
}
.category:last-child, .input-group-addon:last-child {
border-right: #DDD 1px solid;
}

8
searx/static/themes/simple/src/less/search.less
View file

@ -22,15 +22,13 @@
}
.category {
display: inline-block;
display: inline-flex;
flex-direction: column;
gap: 5px;
position: relative;
margin-right: 1rem;
padding: 0;
input {
display: none;
}
label {
svg {
padding-right: 0.2rem;

4
searx/templates/oscar/categories.html
View file

@ -1,6 +1,8 @@
<div id="categories">
{% for category in ((categories_as_tabs | reverse) if rtl else categories_as_tabs) -%}
<input class="hidden" type="checkbox" id="checkbox_{{ category|replace(' ', '_') }}" name="category_{{ category }}" {% if category in selected_categories %}checked="checked"{% endif %} />{{- '' -}}
<div class="category">
<input type="checkbox" id="checkbox_{{ category|replace(' ', '_') }}" name="category_{{ category }}" {% if category in selected_categories %}checked="checked"{% endif %} />{{- '' -}}
<label for="checkbox_{{ category|replace(' ', '_') }}">{{ _(category) }}</label>
</div>
{%- endfor %}
</div>