jandieman
/
searxng
mirror of https://github.com/searxng/searxng.git
2
0
Fork 0
Code Issues Projects Releases Wiki Activity

redesign toggle button of engines && plugins

This commit is contained in:
Noemi Vanyi 2016-08-07 23:25:27 +02:00
parent c553523f5b
commit c59ef83353
8 changed files with 134 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
searx/static/themes/oscar/css/logicodev.min.css vendored
View File

File diff suppressed because one or more lines are too long

2
searx/static/themes/oscar/css/pointhi.min.css vendored
View File

File diff suppressed because one or more lines are too long

57
searx/static/themes/oscar/less/logicodev/onoff.less Normal file
View File

@ -0,0 +1,57 @@
.onoff-checkbox {
width:15%;
}
.onoffswitch {
position: relative;
width: 110px;
-webkit-user-select:none;
-moz-user-select:none;
-ms-user-select: none;
}
.onoffswitch-checkbox {
display: none;
}
.onoffswitch-label {
display: block;
overflow: hidden;
cursor: pointer;
border: 2px solid #FFFFFF !important;
border-radius: 50px !important;
}
.onoffswitch-inner {
display: block;
transition: margin 0.3s ease-in 0s;
}
.onoffswitch-inner:before, .onoffswitch-inner:after {
display: block;
float: left;
width: 50%;
height: 30px;
padding: 0;
line-height: 40px;
font-size: 20px;
box-sizing: border-box;
content: "";
background-color: #EEEEEE;
}
.onoffswitch-switch {
display: block;
width: 37px;
background-color: @light-green;
position: absolute;
top: 0;
bottom: 0;
right: 0px;
border: 2px solid #FFFFFF !important;
border-radius: 50px !important;
transition: all 0.3s ease-in 0s;
}
.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-inner {
margin-right: 0;
}
.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-switch {
right: 71px;
background-color: #A1A1A1;
}

2
searx/static/themes/oscar/less/logicodev/oscar.less
View File

@ -6,6 +6,8 @@
@import "checkbox.less";
@import "onoff.less";
@import "results.less";
@import "infobox.less";

57
searx/static/themes/oscar/less/pointhi/onoff.less Normal file
View File

@ -0,0 +1,57 @@
.onoff-checkbox {
width:15%;
}
.onoffswitch {
position: relative;
width: 110px;
-webkit-user-select:none;
-moz-user-select:none;
-ms-user-select: none;
}
.onoffswitch-checkbox {
display: none;
}
.onoffswitch-label {
display: block;
overflow: hidden;
cursor: pointer;
border: 2px solid #FFFFFF !important;
border-radius: 50px !important;
}
.onoffswitch-inner {
display: block;
transition: margin 0.3s ease-in 0s;
}
.onoffswitch-inner:before, .onoffswitch-inner:after {
display: block;
float: left;
width: 50%;
height: 30px;
padding: 0;
line-height: 40px;
font-size: 20px;
box-sizing: border-box;
content: "";
background-color: #EEEEEE;
}
.onoffswitch-switch {
display: block;
width: 37px;
background-color: #00CC00;
position: absolute;
top: 0;
bottom: 0;
right: 0px;
border: 2px solid #FFFFFF !important;
border-radius: 50px !important;
transition: all 0.3s ease-in 0s;
}
.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-inner {
margin-right: 0;
}
.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-switch {
right: 71px;
background-color: #A1A1A1;
}

2
searx/static/themes/oscar/less/pointhi/oscar.less
View File

@ -2,6 +2,8 @@
@import "checkbox.less";
@import "onoff.less";
@import "results.less";
@import "infobox.less";

10
searx/templates/oscar/macros.html
View File

@ -68,9 +68,11 @@
{%- endmacro %}
{% macro checkbox_toggle(id, blocked) -%}
<div class="checkbox">
<input class="hidden" type="checkbox" id="{{ id }}" name="{{ id }}"{% if blocked %} checked="checked"{% endif %} />
<label class="btn btn-success label_hide_if_checked" for="{{ id }}">{{ _('Block') }}</label>
<label class="btn btn-danger label_hide_if_not_checked" for="{{ id }}">{{ _('Allow') }}</label>
<div class="onoffswitch">
<input type="checkbox" id="{{ id }}" name="{{ id }}"{% if blocked %} checked="checked"{% endif %} class="onoffswitch-checkbox">
<label class="onoffswitch-label" for="{{ id }}">
<span class="onoffswitch-inner"></span>
<span class="onoffswitch-switch"></span>
</label>
</div>
{%- endmacro %}

10
searx/templates/oscar/preferences.html
View File

@ -164,7 +164,9 @@
{% if not search_engine.private %}
<tr>
{% if not rtl %}
<td>{{ checkbox_toggle('engine_' + search_engine.name|replace(' ', '_') + '__' + categ|replace(' ', '_'), (search_engine.name, categ) in disabled_engines) }}</td>
<td class="onoff-checkbox">
{{ checkbox_toggle('engine_' + search_engine.name|replace(' ', '_') + '__' + categ|replace(' ', '_'), (search_engine.name, categ) in disabled_engines) }}
</td>
<th>{{ search_engine.name }}</th>
<td>{{ shortcuts[search_engine.name] }}</td>
<td><input type="checkbox" {{ "checked" if search_engine.safesearch==True else ""}} readonly="readonly" disabled="disabled"></td>
@ -176,7 +178,9 @@
<td><input type="checkbox" {{ "checked" if search_engine.safesearch==True else ""}} readonly="readonly" disabled="disabled"></td>
<td>{{ shortcuts[search_engine.name] }}</td>
<th>{{ search_engine.name }}</th>
<td>{{ checkbox_toggle('engine_' + search_engine.name|replace(' ', '_') + '__' + categ|replace(' ', '_'), (search_engine.name, categ) in disabled_engines) }}</td>
<td class="onoff-checkbox">
{{ checkbox_toggle('engine_' + search_engine.name|replace(' ', '_') + '__' + categ|replace(' ', '_'), (search_engine.name, categ) in disabled_engines) }}
</td>
{% endif %}
</tr>
{% endif %}
@ -203,10 +207,12 @@
<div class="panel-body">
<div class="col-xs-6 col-sm-4 col-md-6">{{ _(plugin.description) }}</div>
<div class="col-xs-6 col-sm-4 col-md-6">
<div class="onoff-checkbox">
{{ checkbox_toggle('plugin_' + plugin.id, plugin.id not in allowed_plugins) }}
</div>
</div>
</div>
</div>
{% endfor %}
</div>
</fieldset>