This commit is contained in:
the-djmaze 2022-12-06 11:41:02 +01:00
parent c7f554d22b
commit 08217d4e99
3 changed files with 100 additions and 94 deletions

View file

@ -1,11 +1,20 @@
#V-PopupsAdvancedSearch { #V-PopupsAdvancedSearch {
max-width: 780px; max-width: 780px;
label { label {
width: 110px; width: 110px;
} }
.span4 { }
width: 360px; #advancedsearchform > div {
display: inline-block;
vertical-align: top;
margin-right:1em;
}
@media screen and (max-width: 410px) {
#advancedsearchform label {
width: 100%;
}
#advancedsearchform label + * {
margin-left: 0;
} }
} }

View file

@ -3,8 +3,7 @@
<h3 data-i18n="SEARCH/TITLE_ADV"></h3> <h3 data-i18n="SEARCH/TITLE_ADV"></h3>
</header> </header>
<form id="advancedsearchform" class="modal-body form-horizontal" action="#/" autocomplete="off" spellcheck="false" data-bind="submit: submitForm"> <form id="advancedsearchform" class="modal-body form-horizontal" action="#/" autocomplete="off" spellcheck="false" data-bind="submit: submitForm">
<div class="row"> <div>
<div class="span4">
<div class="control-group"> <div class="control-group">
<label data-i18n="GLOBAL/FROM"></label> <label data-i18n="GLOBAL/FROM"></label>
<input type="text" autofocus="" autocomplete="off" autocorrect="off" autocapitalize="off" <input type="text" autofocus="" autocomplete="off" autocorrect="off" autocapitalize="off"
@ -40,7 +39,7 @@
</div> </div>
<!-- /ko --> <!-- /ko -->
</div> </div>
<div class="span4"> <div>
<div class="control-group"> <div class="control-group">
<label data-i18n="SEARCH/DATE"></label> <label data-i18n="SEARCH/DATE"></label>
<div data-bind="component: { <div data-bind="component: {
@ -106,7 +105,6 @@
</div> </div>
</div> </div>
</div> </div>
</div>
</form> </form>
<footer> <footer>
<button form="advancedsearchform" class="btn buttonAdvSearch" data-icon="🔎" data-i18n="GLOBAL/SEARCH"></button> <button form="advancedsearchform" class="btn buttonAdvSearch" data-icon="🔎" data-i18n="GLOBAL/SEARCH"></button>

View file

@ -45,6 +45,7 @@ input {
padding: 4px 6px; padding: 4px 6px;
color: var(--input-clr, #555); color: var(--input-clr, #555);
border-radius: var(--input-border-radius, 3px); border-radius: var(--input-border-radius, 3px);
width: 210px;
} }
textarea, textarea,
@ -53,7 +54,6 @@ input {
border: 1px solid var(--input-border-clr, #ccc); border: 1px solid var(--input-border-clr, #ccc);
box-shadow: inset 0 1px 1px rgba(0,0,0,.075); box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
transition: border linear .2s, box-shadow linear .2s; transition: border linear .2s, box-shadow linear .2s;
width: 210px;
// Focus state // Focus state
&:focus { &:focus {
@ -87,7 +87,6 @@ select, .select {
border: 1px solid var(--input-border-clr, #ccc); border: 1px solid var(--input-border-clr, #ccc);
cursor: pointer; cursor: pointer;
padding-right: 1.5em; padding-right: 1.5em;
width: 223px; // default input width + 10px of padding that doesn't get applied
} }
// Focus for select, file, radio, and checkbox // Focus for select, file, radio, and checkbox