Improved sieve filter editor with less pull-right

This commit is contained in:
djmaze 2021-11-15 16:52:18 +01:00
parent 54c2ba7b6e
commit ac7370103e
8 changed files with 44 additions and 55 deletions

View file

@ -13,9 +13,9 @@
@import "../../vendors/bootstrap/less/button-groups.less"; @import "../../vendors/bootstrap/less/button-groups.less";
@import "../../vendors/bootstrap/less/alerts.less"; @import "../../vendors/bootstrap/less/alerts.less";
@import "../../vendors/bootstrap/less/code.less"; @import "../../vendors/bootstrap/less/code.less";
@import "../../vendors/bootstrap/less/utilities.less";
@import "../../vendors/bootstrap/less/dropdowns.less"; @import "../../vendors/bootstrap/less/dropdowns.less";
@import "../../vendors/bootstrap/less/navs.less"; @import "../../vendors/bootstrap/less/navs.less";
@import "../../vendors/bootstrap/less/utilities.less";
@import "_FontasticToBoot.less"; @import "_FontasticToBoot.less";
@import "_BootstrapFix.less"; @import "_BootstrapFix.less";

View file

@ -79,7 +79,7 @@ html.rl-no-preview-pane {
.checkboxCheckAll { .checkboxCheckAll {
cursor: pointer; cursor: pointer;
margin: 0.5em 0.5em 0 0; margin: 0.45em 0.5em 0 0;
} }
.search-input-wrp { .search-input-wrp {

View file

@ -20,7 +20,7 @@
</div> </div>
<div class="legend" data-i18n="POPUPS_FILTER/LEGEND_CONDITIONS"></div> <div class="legend" data-i18n="POPUPS_FILTER/LEGEND_CONDITIONS"></div>
<div data-bind="visible: 1 < conditions().length"> <div class="control-group" data-bind="visible: 1 < conditions().length">
<select class="span4" data-bind="value: conditionsType"> <select class="span4" data-bind="value: conditionsType">
<option value="Any" <option value="Any"
data-i18n="POPUPS_FILTER/SELECT_MATCH_ANY"></option> data-i18n="POPUPS_FILTER/SELECT_MATCH_ANY"></option>
@ -29,16 +29,21 @@
</select> </select>
</div> </div>
<div data-bind="visible: 0 < conditions().length, foreach: conditions"> <div data-bind="visible: 0 < conditions().length, foreach: conditions">
<div data-bind="template: {'name': template(), 'data': $data}"></div> <div class="control-group" data-bind="css: {'error': valueError}" style="display:flex">
<div style="flex-grow:1" data-bind="css: {'error': valueError}, template: {'name': template(), 'data': $data}"></div>
<span class="delete-action button-delete fontastic" style="margin-top: 5px;"
data-bind="click: function (oCondition) { $root.removeCondition(oCondition); }">🗑</span>
</div> </div>
<div data-bind="visible: 0 === conditions().length" </div>
<div class="control-group" data-bind="visible: 0 === conditions().length"
data-i18n="POPUPS_FILTER/ALL_INCOMING_MESSAGES_DESC"></div> data-i18n="POPUPS_FILTER/ALL_INCOMING_MESSAGES_DESC"></div>
<br /> <div class="control-group">
<a class="btn" data-bind="click: addCondition, i18nInit: true"> <a class="btn" data-bind="click: addCondition, i18nInit: true">
<i class="fontastic"></i> <i class="fontastic"></i>
<span data-i18n="POPUPS_FILTER/BUTTON_ADD_CONDITION"></span> <span data-i18n="POPUPS_FILTER/BUTTON_ADD_CONDITION"></span>
</a> </a>
<br /> </div>
<div class="legend" data-i18n="POPUPS_FILTER/LEGEND_ACTIONS"></div> <div class="legend" data-i18n="POPUPS_FILTER/LEGEND_ACTIONS"></div>
<select class="span3" data-bind="options: $root.actionTypeOptions, value: actionType, optionsText: 'name', optionsValue: 'id'"></select> <select class="span3" data-bind="options: $root.actionTypeOptions, value: actionType, optionsText: 'name', optionsValue: 'id'"></select>
<div data-bind="template: {'name': actionTemplate()}, i18nUpdate: actionTemplate"></div> <div data-bind="template: {'name': actionTemplate()}, i18nUpdate: actionTemplate"></div>

View file

@ -1,10 +1,5 @@
<div class="control-group" data-bind="css: {'error': valueError}" style="margin-bottom: 0"> <select class="span3" data-bind="options: $root.fieldOptions, value: field, optionsText: 'name', optionsValue: 'id'"></select>
<select class="span3" data-bind="options: $root.fieldOptions, value: field, optionsText: 'name', optionsValue: 'id'"></select> &nbsp;
&nbsp; <select class="span2" data-bind="options: $root.typeOptionsBody, value: type, optionsText: 'name', optionsValue: 'id'"></select>
<select class="span2" data-bind="options: $root.typeOptionsBody, value: type, optionsText: 'name', optionsValue: 'id'"></select> &nbsp;
&nbsp; <input class="span3" type="text" data-bind="value: value" />
<input class="span3" type="text" data-bind="value: value" />
&nbsp;
<span class="delete-action button-delete pull-right fontastic" style="margin-top: 5px;"
data-bind="click: function (oCondition) { $root.removeCondition(oCondition); }">🗑</span>
</div>

View file

@ -1,10 +1,5 @@
<div class="control-group" data-bind="css: {'error': valueError}" style="margin-bottom: 0"> <select class="span3" data-bind="options: $root.fieldOptions, value: field, optionsText: 'name', optionsValue: 'id'"></select>
<select class="span3" data-bind="options: $root.fieldOptions, value: field, optionsText: 'name', optionsValue: 'id'"></select> &nbsp;
&nbsp; <select class="span2" data-bind="options: $root.typeOptions, value: type, optionsText: 'name', optionsValue: 'id'"></select>
<select class="span2" data-bind="options: $root.typeOptions, value: type, optionsText: 'name', optionsValue: 'id'"></select> &nbsp;
&nbsp; <input class="span3" type="text" data-bind="value: value" />
<input class="span3" type="text" data-bind="value: value" />
&nbsp;
<span class="delete-action button-delete pull-right fontastic" style="margin-top: 5px;"
data-bind="click: function (oCondition) { $root.removeCondition(oCondition); }">🗑</span>
</div>

View file

@ -1,12 +1,7 @@
<div class="control-group" data-bind="css: {'error': valueError}" style="margin-bottom: 0"> <select class="span2" data-bind="options: $root.fieldOptions, value: field, optionsText: 'name', optionsValue: 'id'"></select>
<select class="span2" data-bind="options: $root.fieldOptions, value: field, optionsText: 'name', optionsValue: 'id'"></select> &nbsp;
&nbsp; <input class="span2" type="text" data-bind="value: valueSecond" />
<input class="span2" type="text" data-bind="value: valueSecond" /> &nbsp;
&nbsp; <select class="span2" data-bind="options: $root.typeOptions, value: type, optionsText: 'name', optionsValue: 'id'"></select>
<select class="span2" data-bind="options: $root.typeOptions, value: type, optionsText: 'name', optionsValue: 'id'"></select> &nbsp;
&nbsp; <input class="span3" type="text" data-bind="value: value" />
<input class="span3" type="text" data-bind="value: value" />
&nbsp;
<span class="delete-action button-delete pull-right fontastic" style="margin-top: 5px;"
data-bind="click: function (oCondition) { $root.removeCondition(oCondition); }">🗑</span>
</div>

View file

@ -1,10 +1,5 @@
<div class="control-group" data-bind="css: {'error': valueError}" style="margin-bottom: 0"> <select class="span3" data-bind="options: $root.fieldOptions, value: field, optionsText: 'name', optionsValue: 'id'"></select>
<select class="span3" data-bind="options: $root.fieldOptions, value: field, optionsText: 'name', optionsValue: 'id'"></select> &nbsp;
&nbsp; <select class="span2" data-bind="options: $root.typeOptionsSize, value: type, optionsText: 'name', optionsValue: 'id'"></select>
<select class="span2" data-bind="options: $root.typeOptionsSize, value: type, optionsText: 'name', optionsValue: 'id'"></select> &nbsp;
&nbsp; <input class="span3" type="text" data-bind="value: value" />
<input class="span3" type="text" data-bind="value: value" />
&nbsp;
<span class="delete-action button-delete pull-right fontastic" style="margin-top: 5px;"
data-bind="click: function (oCondition) { $root.removeCondition(oCondition); }">🗑</span>
</div>

View file

@ -30,7 +30,9 @@
<span class="open-pgp-key-user" data-bind="foreach: users"> <span class="open-pgp-key-user" data-bind="foreach: users">
<div class="open-pgp-key-user-address" data-bind="text: $data"></div> <div class="open-pgp-key-user-address" data-bind="text: $data"></div>
</span> </span>
<a class="btn btn-small btn-small-small btn-danger pull-right button-confirm-delete" data-bind="css: {'delete-access': deleteAccess()}, click: function(openPgpKey) { $root.deleteOpenPgpKey(openPgpKey); }" </td>
<td>
<a class="btn btn-small btn-small-small btn-danger button-confirm-delete" data-bind="css: {'delete-access': deleteAccess()}, click: function(openPgpKey) { $root.deleteOpenPgpKey(openPgpKey); }"
data-i18n="GLOBAL/ARE_YOU_SURE"></a> data-i18n="GLOBAL/ARE_YOU_SURE"></a>
</td> </td>
<td> <td>
@ -47,7 +49,9 @@
<span data-bind="text: $data"></span> (<span class="open-pgp-key-id" data-bind="text: $parent.id"></span>) <span data-bind="text: $data"></span> (<span class="open-pgp-key-id" data-bind="text: $parent.id"></span>)
</div> </div>
</span> </span>
<a class="btn btn-small btn-small-small btn-danger pull-right button-confirm-delete" data-bind="css: {'delete-access': deleteAccess()}, click: function(oOpenPGP) { $root.deleteOpenPgpKey(oOpenPGP); }" </td>
<td>
<a class="btn btn-small btn-small-small btn-danger button-confirm-delete" data-bind="css: {'delete-access': deleteAccess()}, click: function(oOpenPGP) { $root.deleteOpenPgpKey(oOpenPGP); }"
data-i18n="GLOBAL/ARE_YOU_SURE"></a> data-i18n="GLOBAL/ARE_YOU_SURE"></a>
</td> </td>
<td> <td>