Dereku/snappymail
1
0
Fork 0
mirror of https://github.com/the-djmaze/snappymail.git synced 2026-07-13 03:27:39 +03:00
Code Issues Projects Releases Packages Wiki Activity Actions

Resolve #712

Browse source
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
Download patch file Download diff file Expand all files Collapse all files

17
dev/Styles/User/AdvancedSearch.less
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;
} }
} }

174
snappymail/v/0.0.0/app/templates/Views/User/PopupsAdvancedSearch.html
View file

@ -3,108 +3,106 @@
<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" data-bind="value: from">
data-bind="value: from">
</div>
<div class="control-group">
<label data-i18n="GLOBAL/TO"></label>
<input type="text" autocomplete="off" autocorrect="off" autocapitalize="off"
data-bind="value: to">
</div>
<div class="control-group">
<label data-i18n="GLOBAL/SUBJECT"></label>
<input type="text" autocomplete="off" autocorrect="off" autocapitalize="off"
data-bind="value: subject">
</div>
<div class="control-group">
<label data-i18n="SEARCH/TEXT"></label>
<input type="text" autocomplete="off" autocorrect="off" autocapitalize="off"
data-bind="value: text">
</div>
<!-- ko if: showKeywords -->
<div class="control-group">
<label data-i18n="SEARCH/KEYWORD"></label>
<div data-bind="component: {
name: 'Select',
params: {
options: keywords,
value: keyword,
optionsText: 'label',
optionsValue: 'value'
}
}"></div>
</div>
<!-- /ko -->
</div> </div>
<div class="span4"> <div class="control-group">
<div class="control-group"> <label data-i18n="GLOBAL/TO"></label>
<label data-i18n="SEARCH/DATE"></label> <input type="text" autocomplete="off" autocorrect="off" autocapitalize="off"
data-bind="value: to">
</div>
<div class="control-group">
<label data-i18n="GLOBAL/SUBJECT"></label>
<input type="text" autocomplete="off" autocorrect="off" autocapitalize="off"
data-bind="value: subject">
</div>
<div class="control-group">
<label data-i18n="SEARCH/TEXT"></label>
<input type="text" autocomplete="off" autocorrect="off" autocapitalize="off"
data-bind="value: text">
</div>
<!-- ko if: showKeywords -->
<div class="control-group">
<label data-i18n="SEARCH/KEYWORD"></label>
<div data-bind="component: {
name: 'Select',
params: {
options: keywords,
value: keyword,
optionsText: 'label',
optionsValue: 'value'
}
}"></div>
</div>
<!-- /ko -->
</div>
<div>
<div class="control-group">
<label data-i18n="SEARCH/DATE"></label>
<div data-bind="component: {
name: 'Select',
params: {
options: selectedDates,
value: selectedDateValue,
optionsText: 'name',
optionsValue: 'id'
}
}"></div>
</div>
<div class="control-group">
<label data-i18n="SEARCH/REPLIED"></label>
<div data-bind="component: {
name: 'Select',
params: {
options: repliedOptions,
value: repliedValue,
optionsText: 'name',
optionsValue: 'id'
}
}"></div>
</div>
<!-- ko if: showMultisearch -->
<div class="control-group">
<label data-i18n="SEARCH/SUBFOLDERS"></label>
<div data-bind="component: {
name: 'Select',
params: {
options: selectedTree,
value: selectedTreeValue,
optionsText: 'name',
optionsValue: 'id'
}
}"></div>
</div>
<!-- /ko -->
<div class="control-group">
<label></label>
<div>
<div data-bind="component: { <div data-bind="component: {
name: 'Select', name: 'Checkbox',
params: { params: {
options: selectedDates, label: 'SEARCH/UNSEEN',
value: selectedDateValue, value: unseen
optionsText: 'name',
optionsValue: 'id'
} }
}"></div> }"></div>
</div>
<div class="control-group">
<label data-i18n="SEARCH/REPLIED"></label>
<div data-bind="component: { <div data-bind="component: {
name: 'Select', name: 'Checkbox',
params: { params: {
options: repliedOptions, label: 'SEARCH/FLAGGED',
value: repliedValue, value: starred
optionsText: 'name',
optionsValue: 'id'
} }
}"></div> }"></div>
</div>
<!-- ko if: showMultisearch -->
<div class="control-group">
<label data-i18n="SEARCH/SUBFOLDERS"></label>
<div data-bind="component: { <div data-bind="component: {
name: 'Select', name: 'Checkbox',
params: { params: {
options: selectedTree, label: 'SEARCH/HAS_ATTACHMENT',
value: selectedTreeValue, value: hasAttachment
optionsText: 'name',
optionsValue: 'id'
} }
}"></div> }"></div>
</div> </div>
<!-- /ko -->
<div class="control-group">
<label></label>
<div>
<div data-bind="component: {
name: 'Checkbox',
params: {
label: 'SEARCH/UNSEEN',
value: unseen
}
}"></div>
<div data-bind="component: {
name: 'Checkbox',
params: {
label: 'SEARCH/FLAGGED',
value: starred
}
}"></div>
<div data-bind="component: {
name: 'Checkbox',
params: {
label: 'SEARCH/HAS_ATTACHMENT',
value: hasAttachment
}
}"></div>
</div>
</div>
</div> </div>
</div> </div>
</form> </form>

3
vendors/bootstrap/less/forms.less vendored
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