Skip to content

GitLab

Commit 54760155 authored by Daniel J. Ramirez's avatar Daniel J. Ramirez
Browse files

Several style improvements 

Improved visibility of buttons in general, including pagination buttons.
Reduced the amount of space used by infobox links.
Other minor changes
parent c2888ab0
Expand all Hide whitespace changes
Inline Side-by-side
searx/static/themes/eelo/css/eelo.css
View file @ 54760155
......@@ -24,6 +24,7 @@ a {
opacity: .4;
}
#pagination {
margin-top: 48px;
display: flex;
justify-content: space-between;
}
......@@ -154,35 +155,53 @@ a {
border: 2px solid rgba(0, 0, 0, 0.2);
padding: 4px 12px;
background-color: transparent;
transition: border-color 0.2s ease-in-out, color 0.2s ease-in-out;
transition: border-color 0.2s ease-in-out, color 0.2s ease-in-out, background-color 0.2s ease-in-out;
}
.btn {
padding: 8px 16px;
text-transform: uppercase;
text-transform: capitalize;
background-color: transparent;
border-radius: 8px;
text-align: center;
font-size: 16px;
font-weight: bold;
color: #5c6469;
cursor: pointer;
}
.btn:not(:disabled) {
color: #5068dd;
border-color: #5068dd;
}
.btn:hover:not(:disabled) {
border-color: #2344a2;
color: #2344a2;
}
.btn.primary,
input.btn[type="submit"] {
color: #5068dd;
background-color: #5068dd;
color: #ffffff;
border-color: rgba(0, 0, 0, 0.2);
}
.btn:hover {
border-color: #5068dd;
.btn.primary:hover,
input.btn[type="submit"]:hover {
color: #ffffff;
background-color: #2344a2;
}
.btn.danger:hover {
.btn.danger {
color: #e06572;
border-color: #e06572;
}
.btn.danger:hover {
border-color: rgba(0, 0, 0, 0.2);
background-color: #e06572;
color: #ffffff;
}
.btn.btn-flat {
border: none;
border-radius: 0;
background-color: transparent;
}
.btn.btn-flat:hover {
color: #5068dd;
color: #2344a2;
}
.btn.plain-white {
border-color: rgba(255, 255, 255, 0.4);
......@@ -513,6 +532,10 @@ nav #eelo_links > * {
padding-left: 16px;
padding-right: 16px;
}
#search_form .tt-dropdown-menu .tt-cursor,
#search_form .tt-dropdown-menu .tt-highlight {
font-weight: bold;
}
#search_form.inline-search .tt-dropdown-menu {
padding-left: 52px;
}
......@@ -570,14 +593,20 @@ nav #eelo_links > * {
border-radius: 8px;
border: 2px solid rgba(0, 0, 0, 0.2);
background-color: #eeeeee;
padding-bottom: 16px;
padding-bottom: 8px;
padding-top: 8px;
left: 0;
z-index: 998;
}
#search_form #more_categories > label {
padding: 16px;
padding-bottom: 0;
padding-bottom: 8px;
padding-top: 8px;
white-space: nowrap;
margin-right: 0;
}
#search_form #more_categories > label:hover {
background-color: rgba(0, 0, 0, 0.1);
}
#more_categories_container {
border-left: 1px solid rgba(0, 0, 0, 0.24);
......@@ -802,8 +831,17 @@ nav #eelo_links > * {
width: 100%;
margin-top: 16px;
}
.infobox .footer .links a {
padding-left: 0;
padding-top: 0;
padding-bottom: 16px;
padding-right: 32px;
display: inline-block;
font-size: 14px;
}
.infobox table {
margin-top: 16px;
width: 100%;
}
.infobox table tr {
vertical-align: top;
......
searx/static/themes/eelo/css/eelo.min.css
View file @ 54760155
This diff is collapsed.
searx/static/themes/eelo/less/eelo/defs.less
View file @ 54760155
......@@ -5,11 +5,14 @@
@link-color: #1f6ed7;
@color_accent: #5068dd;
@color_accent__op: white;
@color_accent__dark: #2344a2;
@color_primary: blue;
@color_base: blue;
@color_base-text-hl: #5c6469;
@color_danger: #e06572;
@color_danger__op: white;
@corner-radius: 8px;
......@@ -57,6 +60,7 @@
@color-transition: color .2s ease-in-out;
@border-color-transition: border-color .2s ease-in-out;
@background-color-transition: background-color .2s ease-in-out;
@fill-transition: fill .2s ease-in-out;
@box-shadow-transition: box-shadow .2s ease-in-out;
......
searx/static/themes/eelo/less/eelo/layout.less
View file @ 54760155
#pagination {
margin-top: @spacing_x-huge;
display: flex;
justify-content: space-between;
}
......
searx/static/themes/eelo/less/eelo/results.less
View file @ 54760155
......@@ -169,10 +169,20 @@
}
.footer {
.links a {
padding-left: 0;
padding-top: 0;
padding-bottom: @spacing_large;
padding-right: @spacing_xx-large;
display: inline-block;
font-size: @fontsize_small;
}
}
table { margin-top: @spacing_large; }
table {
margin-top: @spacing_large;
width: 100%;
}
table tr {
vertical-align: top;
......
searx/static/themes/eelo/less/eelo/search.less
View file @ 54760155
......@@ -94,6 +94,10 @@
background-color: @grey;
padding-left: @spacing_large;
padding-right: @spacing_large;
& .tt-cursor, & .tt-highlight {
font-weight: bold;
}
}
&.inline-search {
......@@ -159,14 +163,21 @@
border-radius: @corner-radius;
.widget-border();
background-color: @grey;
padding-bottom: @spacing_large;
padding-bottom: @spacing_large / 2;
padding-top: @spacing_large / 2;
left: 0;
z-index: 998;
}
#more_categories > label {
padding: @spacing_large;
padding-bottom: 0;
padding-bottom: @spacing_large / 2;
padding-top: @spacing_large / 2;
white-space: nowrap;
margin-right: 0;
&:hover {
background-color: @dim-color-lighter;
}
}
}
#more_categories_container {
......
searx/static/themes/eelo/less/eelo/widgets.less
View file @ 54760155
......@@ -13,7 +13,7 @@
padding: 4px 12px;
background-color: transparent;
transition: @border-color-transition, @color-transition;
transition: @border-color-transition, @color-transition, @background-color-transition;
}
.btn {
......@@ -21,20 +21,42 @@
padding: 8px 16px;
text-transform: uppercase;
text-transform: capitalize;
background-color: transparent;
border-radius: @corner-radius;
text-align: center;
font-size: @fontsize_medium;
font-weight: bold;
color: @color_base-text-hl;
cursor: pointer;
&.primary, input&[type="submit"] {
&:not(:disabled) {
color: @color_accent;
border-color: @color_accent;
}
&:hover:not(:disabled) {
border-color: @color_accent__dark;
color: @color_accent__dark;
}
&.primary, input&[type="submit"] {
background-color: @color_accent;
color: @color_accent__op;
border-color: @dim-color-light;
&:hover {
color: @color_accent__op;
background-color: @color_accent__dark;
}
}
&.danger {
&:extend(.danger);
color: @color_danger;
border-color: @color_danger;
}
&.danger:hover {
border-color: @dim-color-light;
background-color: @color_danger;
color: @color_danger__op;
}
&:hover { border-color: @color_accent; }
&.danger { &:extend(.danger); }
&.danger:hover { border-color: @color_danger; }
&.btn-flat {
border: none;
......@@ -43,7 +65,7 @@
}
&.btn-flat:hover {
color: @color_accent;
color: @color_accent__dark;
}
&.btn-block { &:extend(.block); }
......
searx/templates/eelo/infobox.html
View file @ 54760155
......@@ -39,9 +39,10 @@
<div class="footer">
{% if infobox.urls %}
<div class="links">
<p>{{_("More information:")}}</p>
<bdi>
{% for url in infobox.urls %}
<p>{{ result_link(url.url, url.title, 'btn btn-default btn-block') }}</p>
{{ result_link(url.url, url.title, 'btn btn-flat') }}
{% endfor %}
</bdi>
</div>
......
searx/templates/eelo/results.html
View file @ 54760155
......@@ -95,7 +95,7 @@
</form>
<form method="{{ method or 'POST' }}" action="{{ url_for('index') }}">
{{ search_form_attrs(pageno + 1) }}
<button type="submit" class="btn btn-default"><span class="glyphicon glyphicon-backward"></span> {{ _('next page') }}</button>
<button type="submit" class="btn primary"><span class="glyphicon glyphicon-backward"></span> {{ _('next page') }}</button>
</form>
</div><!-- /#pagination -->
{% endif %}
......
searx/webapp.py
View file @ 54760155
......@@ -481,7 +481,6 @@ def index():
request.form['categories'] = ['general', 'videos', 'images']
else:
request.form['categories'] = [selected_category]
search_data = search(request, settings['redis']['host'])
except Exception as e:
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment