Albirew/nyaa-pantsu
Albirew/nyaa-pantsu
Archivé
1
0
Bifurcation 0
Code Activité

Add tag inputs to refine search (#1394)

Parcourir la source 
* Avoid language list being higher than 59px in refine

Otherwise that would break the visual for the future anidb & tag inputs on some very specific res

* CSS to make the new input look pretty & responsive

* HTML of the new inputs

* -1px
Cette révision appartient à :
kilo 2017-08-27 03:21:00 +02:00 révisé par ewhal
Parent 73a5277b6f
révision de1ace1624
2 fichiers modifiés avec 42 ajouts et 4 suppressions
Voir les statistiques Télécharger le patch en tant que fichier Télécharger le fichier diff Développer tous les fichiers Réduire tous les fichiers

39
public/css/main.css
Voir le fichier

@ -210,7 +210,7 @@ select.form-input {
height: auto;
border-radius: 5px;
background-color: #F7F8F9;
padding: 10px 4px 9px 7px;
padding: 10px 4px 9px 6px;
}
.language span.input-group {
@ -380,6 +380,7 @@ select.form-input {
.box.refine .language {
position: absolute;
right: 0;
top: 0;
}
.form-refine {
@ -399,6 +400,7 @@ select.form-input {
overflow: hidden;
}
.form-refine .refine-searchbox::placeholder {
opacity: 0;
}
@ -411,7 +413,7 @@ select.form-input {
.form-refine .refine-category {
border-left: none;
border-radius: 0 3px 3px 0;
max-width: 41%;
max-width: 40%;
min-width: 162px;
}
@ -419,11 +421,25 @@ select.form-input {
display: flex;
}
.box.refine .refine-container-1 {
width: 53%;
width: 52%;
}
.box.refine .refine-container-2 {
width: 47%;
width: 48%;
position: relative;
padding-top: 71px;
}
.refine-container-2 input[type="number"],.refine-container-2 input[type="text"] {
float: right;
margin-left: 8px;
margin-bottom: 5px;
width: 100px!important;
}
.refine-container-2 input[type="text"] {
width: 70px;
}
.refine-container-2 .form-refine span.spacing {
display: none;
}
.refine-date {
width: 98px!important;
@ -772,6 +788,7 @@ html, body {
}
.refine-container-2 {
margin-top: 5px;
padding-top: 0!important;
}
.form-refine .refine-category {
max-width: 30%;
@ -779,6 +796,17 @@ html, body {
.form-refine .refine-searchbox {
min-width: 190px;
}
.refine-container-2 .refine-tag {
display:inline-block;
}
.refine-container-2 input[type="number"],.refine-container-2 input[type="text"] {
float: initial;
margin-left: auto;
margin-right: 0;
}
.refine-container-2 .form-refine span.spacing {
display:inline-block;
}
.hide-xs {
display: none !important;
}
@ -924,6 +952,9 @@ html, body {
#footer {
padding-bottom: 25px;
}
.refine-container-2 input[type="number"],.refine-container-2 input[type="text"] {
width: 87px!important;
}
}
@media (max-width: 440px) {

7
templates/layouts/partials/helpers/search.jet.html
Voir le fichier

@ -76,6 +76,13 @@
</span>
</div>
<div class="refine-container-2">
<span class="form-refine refine-tag">
<span class="spacing">Tags:</span>
<input type="text" name="vq" placeholder="Quality" value="" class="form-input"/>
<input type="number" name="vgmdb" placeholder="VGMdb" value="" class="form-input"/>
<input type="number" name="vndb" placeholder="VnDB" value="" class="form-input"/>
<input type="number" name="anidb" placeholder="AniDB" value="" class="form-input"/>
</span>
<div name="language" class="form-refine form-input language">
{{ yield flagList(languages=GetTorrentLanguages(), selected=Search.Languages, inputname="lang", id="refine-search")}}
</div>