mirror of https://gitlab.com/SIGBUS/nyaa.git
Merge pull request #123 from UnKnoWn-Consortium/patch-3
Issue #116: Reordering of the search bar
This commit is contained in:
Johnny Ding
GitHub
commit
90e2aa75f5
|
|
@ -51,9 +51,11 @@ table.torrent-list thead th.sorting:after {
|
|||
color: #808080;
|
||||
font-size: 0.85em;
|
||||
}
|
||||
|
||||
table.torrent-list thead th.sorting_asc:after {
|
||||
content: "\f0de";
|
||||
}
|
||||
|
||||
table.torrent-list thead th.sorting_desc:after {
|
||||
content: "\f0dd";
|
||||
}
|
||||
|
|
@ -97,21 +99,26 @@ table.torrent-list tbody .comments i {
|
|||
.table-hover > tbody > tr.deleted:hover > td, .table-hover > tbody > tr.deleted:hover > th, .table-hover > tbody > tr:hover > .deleted, .table-hover > tbody > tr > td.deleted:hover, .table-hover > tbody > tr > th.deleted:hover {
|
||||
background-color:#bdbdbd;
|
||||
}
|
||||
|
||||
.panel-deleted {
|
||||
border-color:#757575;
|
||||
}
|
||||
|
||||
.panel-deleted > .panel-heading {
|
||||
color:#212121;
|
||||
background-color:#9e9e9e;
|
||||
border-color:#757575;
|
||||
}
|
||||
|
||||
.panel-deleted > .panel-heading + .panel-collapse > .panel-body {
|
||||
border-top-color:#757575;
|
||||
}
|
||||
|
||||
.panel-deleted > .panel-heading .badge {
|
||||
color:#9e9e9e;
|
||||
background-color:#212121;
|
||||
}
|
||||
|
||||
.panel-deleted > .panel-footer + .panel-collapse > .panel-body {
|
||||
border-bottom-color:#757575;
|
||||
}
|
||||
|
|
@ -124,19 +131,6 @@ table.torrent-list tbody .comments i {
|
|||
min-height: 360px;
|
||||
}
|
||||
|
||||
@media (max-width: 991px){
|
||||
.panel-body .col-md-5 {
|
||||
margin-left: 20px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 992px){
|
||||
.panel-body .col-md-5 {
|
||||
word-wrap: break-word;
|
||||
}
|
||||
}
|
||||
|
||||
.search-container {
|
||||
display: -webkit-box;
|
||||
display: -ms-flexbox;
|
||||
|
|
@ -147,18 +141,33 @@ table.torrent-list tbody .comments i {
|
|||
flex-direction: column;
|
||||
}
|
||||
|
||||
.search-container > .search-bar {
|
||||
border-left: 0;
|
||||
}
|
||||
|
||||
#navFilter-criteria > .bootstrap-select:first-child {
|
||||
border-right: solid 1px;
|
||||
}
|
||||
|
||||
#navFilter-criteria > .bootstrap-select:first-child > button {
|
||||
/* !important is used here to override the programmatically added style on element */
|
||||
border-top-left-radius: 4px !important;
|
||||
border-bottom-left-radius: 4px !important;
|
||||
}
|
||||
|
||||
.form-control.search-bar {
|
||||
-webkit-box-ordinal-group: 2;
|
||||
-ms-flex-order: 1;
|
||||
order: 1;
|
||||
-webkit-box-ordinal-group: 4;
|
||||
-ms-flex-order: 3;
|
||||
order: 3;
|
||||
width: 99%;
|
||||
padding-right: 4em;
|
||||
border-left: 0;
|
||||
}
|
||||
|
||||
.search-btn {
|
||||
-webkit-box-ordinal-group: 3;
|
||||
-ms-flex-order: 2;
|
||||
order: 2;
|
||||
-webkit-box-ordinal-group: 5;
|
||||
-ms-flex-order: 4;
|
||||
order: 4;
|
||||
-ms-flex-item-align: end;
|
||||
align-self: flex-end;
|
||||
top: -34px;
|
||||
|
|
@ -168,15 +177,15 @@ table.torrent-list tbody .comments i {
|
|||
}
|
||||
|
||||
#navFilter-criteria {
|
||||
-webkit-box-ordinal-group: 4;
|
||||
-ms-flex-order: 3;
|
||||
order: 3;
|
||||
-webkit-box-ordinal-group: 2;
|
||||
-ms-flex-order: 1;
|
||||
order: 1;
|
||||
}
|
||||
|
||||
#navFilter-category {
|
||||
-webkit-box-ordinal-group: 5;
|
||||
-ms-flex-order: 4;
|
||||
order: 4;
|
||||
-webkit-box-ordinal-group: 3;
|
||||
-ms-flex-order: 2;
|
||||
order: 2;
|
||||
}
|
||||
|
||||
.nav-filter {
|
||||
|
|
@ -194,17 +203,6 @@ table.torrent-list tbody .comments i {
|
|||
overflow-y: visible;
|
||||
}
|
||||
|
||||
@media (min-width: 991px) {
|
||||
.search-btn {
|
||||
top: 0;
|
||||
width: auto;
|
||||
}
|
||||
|
||||
.bootstrap-select > button {
|
||||
margin-top: auto;
|
||||
}
|
||||
}
|
||||
|
||||
/* Upload page drop zone */
|
||||
#upload-drop-zone
|
||||
{
|
||||
|
|
@ -253,13 +251,19 @@ ul.nav-tabs#profileTabs {
|
|||
margin-top: 10px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.comment-panel:target {
|
||||
border-color: black;
|
||||
border-width: 2px;
|
||||
}
|
||||
|
||||
.text-purple, a.text-purple:visited { color: #a760bc; }
|
||||
a.text-purple:hover, a.text-purple:active, a.text-purple:focus { color: #a760e0; }
|
||||
.text-purple, a.text-purple:visited {
|
||||
color: #a760bc;
|
||||
}
|
||||
|
||||
a.text-purple:hover, a.text-purple:active, a.text-purple:focus {
|
||||
color: #a760e0;
|
||||
}
|
||||
|
||||
.comment-content {
|
||||
word-break: break-all;
|
||||
|
|
@ -290,21 +294,27 @@ a.text-purple:hover, a.text-purple:active, a.text-purple:focus { color: #a760e0;
|
|||
background-color: #cccfd2;
|
||||
border-color: #ccc;
|
||||
}
|
||||
|
||||
.btn-grey:hover, .btn-grey:focus, .btn-grey:active, .btn-grey.active, .open > .dropdown-toggle.btn-grey {
|
||||
background-color: #aaaaaa;
|
||||
}
|
||||
|
||||
.btn span.glyphicon-check {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.btn.active span.glyphicon-check {
|
||||
display: inline;
|
||||
}
|
||||
|
||||
.btn span.glyphicon-unchecked {
|
||||
display: inline;
|
||||
}
|
||||
|
||||
.btn.active span.glyphicon-unchecked {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.center {
|
||||
float: none;
|
||||
margin: 0 auto;
|
||||
|
|
@ -365,3 +375,35 @@ h6:hover .header-anchor {
|
|||
visibility: visible;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
@media (max-width: 991px){
|
||||
.panel-body .col-md-5 {
|
||||
margin-left: 20px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
#navFilter-criteria > .bootstrap-select:first-child > button {
|
||||
/* !important is used here to override the programmatically added style on element */
|
||||
border-top-left-radius: 0 !important;
|
||||
border-bottom-left-radius: 0 !important;
|
||||
}
|
||||
|
||||
.search-container > .search-bar {
|
||||
margin-top: 15px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 992px){
|
||||
.panel-body .col-md-5 {
|
||||
word-wrap: break-word;
|
||||
}
|
||||
|
||||
.search-btn {
|
||||
top: 0;
|
||||
width: auto;
|
||||
}
|
||||
|
||||
.bootstrap-select > button {
|
||||
margin-top: auto;
|
||||
}
|
||||
}
|
||||
|
|
@ -246,8 +246,6 @@
|
|||
<form class="navbar-form navbar-right form" action="{{ url_for('home') }}" method="get">
|
||||
{% endif %}
|
||||
<div class="input-group search-container hidden-xs hidden-sm">
|
||||
<input type="text" class="form-control search-bar" name="q" placeholder="{{ search_placeholder }}" value="{{ search['term'] if search is defined else '' }}" />
|
||||
|
||||
<div class="input-group-btn nav-filter" id="navFilter-criteria">
|
||||
<select class="selectpicker show-tick" title="Filter" data-width="120px" name="f">
|
||||
<option value="0" title="No filter" {% if search is defined and search["quality_filter"] == "0" %}selected{% else %}selected{% endif %}>No filter</option>
|
||||
|
|
@ -261,7 +259,8 @@
|
|||
On narrow viewports, there isn't enough room to fit the full stuff in the selectpicker, so we show a full-width one on wide viewports, but squish it on narrow ones.
|
||||
-->
|
||||
{# XXX Search breaks with multiple fields with the same name: default to the shorter one so we don't break visuals. This is a hack! #}
|
||||
{# <select class="selectpicker show-tick visible-lg" title="Category" data-width="200px" name="c">
|
||||
{#
|
||||
<select class="selectpicker show-tick visible-lg" title="Category" data-width="200px" name="c">
|
||||
<option value="0_0" title="All categories" {% if search is defined and search["category"] == "0_0" %}selected{% else %}selected{% endif %}>
|
||||
All categories
|
||||
</option>
|
||||
|
|
@ -270,7 +269,8 @@
|
|||
{{ cat_name }}
|
||||
</option>
|
||||
{% endfor %}
|
||||
</select> #}
|
||||
</select>
|
||||
#}
|
||||
<select class="selectpicker show-tick" title="Category" data-width="130px" name="c">
|
||||
<option value="0_0" title="All categories" {% if search is defined and search["category"] == "0_0" %}selected{% else %}selected{% endif %}>
|
||||
All categories
|
||||
|
|
@ -282,6 +282,7 @@
|
|||
{% endfor %}
|
||||
</select>
|
||||
</div>
|
||||
<input type="text" class="form-control search-bar" name="q" placeholder="{{ search_placeholder }}" value="{{ search['term'] if search is defined else '' }}" />
|
||||
<div class="input-group-btn search-btn">
|
||||
<button class="btn btn-primary" type="submit">
|
||||
<i class="fa fa-search fa-fw"></i>
|
||||
|
|
|
|||
Loading…
Reference in New Issue