diff --git a/skins/elastic/styles/colors.less b/skins/elastic/styles/colors.less
index 7400f693c..d42060492 100644
--- a/skins/elastic/styles/colors.less
+++ b/skins/elastic/styles/colors.less
@@ -142,6 +142,7 @@
@color-input-addon-background: @color-black-shade-bg;
@color-recipient-input-border: @color-input-border;
@color-recipient-input-background: @color-black-shade-bg;
+@color-input-placeholder: #bbb;
@color-checkbox: @color-main;
@color-checkbox-checked: @color-main;
diff --git a/skins/elastic/styles/widgets/dialogs.less b/skins/elastic/styles/widgets/dialogs.less
index 2ce83ed91..fbb95ad31 100644
--- a/skins/elastic/styles/widgets/dialogs.less
+++ b/skins/elastic/styles/widgets/dialogs.less
@@ -119,6 +119,10 @@ html.layout-phone {
color: @color-popover-mobile-header;
background-color: @color-popover-mobile-header-background;
+ &:before {
+ display: none; // hide the Bootstrap's popover arrow element
+ }
+
a {
display: inline-block;
width: 100%;
diff --git a/skins/elastic/styles/widgets/forms.less b/skins/elastic/styles/widgets/forms.less
index 3d1b89eac..874385b8b 100644
--- a/skins/elastic/styles/widgets/forms.less
+++ b/skins/elastic/styles/widgets/forms.less
@@ -1344,6 +1344,10 @@ td.input-group input {
box-shadow: 0 0 0 .2rem @color-input-border-invalid-shadow;
}
}
+
+ &::placeholder {
+ color: @color-input-placeholder;
+ }
}
.invalid-feedback {
diff --git a/skins/elastic/styles/widgets/jqueryui.less b/skins/elastic/styles/widgets/jqueryui.less
index 1887be23b..35ed0b75f 100644
--- a/skins/elastic/styles/widgets/jqueryui.less
+++ b/skins/elastic/styles/widgets/jqueryui.less
@@ -167,6 +167,7 @@
height: 100% !important;
display: flex;
flex-direction: column;
+ border: 0;
.ui-resizable-handle,
.ui-dialog-titlebar-close {
@@ -202,14 +203,17 @@
button {
margin: 0 !important;
+ padding: .45rem;
border: 0 !important;
height: @layout-header-height;
box-shadow: none;
+ font-size: 90%;
&:before {
display: block !important;
width: auto;
- height: 1.25em;
+ height: 1.75rem;
+ line-height: 1.75;
margin: 0;
}
@@ -237,9 +241,13 @@
a.btn-link {
color: @color-toolbar-button;
margin: 0;
+ padding: .45rem;
+ font-size: 90%;
&.options:before {
display: block !important;
+ height: 1.75rem;
+ line-height: 1.75;
}
&.options:after {
diff --git a/skins/elastic/ui.js b/skins/elastic/ui.js
index 022265c07..c3b1b78fa 100644
--- a/skins/elastic/ui.js
+++ b/skins/elastic/ui.js
@@ -1888,13 +1888,18 @@ function rcube_elastic_ui()
class_name = 'button icon ' + (label == 'back' ? 'back' : 'cancel');
$('.popover-header', popover).empty()
- .append($('').attr('class', class_name).text(title))
- .off('click').on('click', function(e) {
- $(item).popover('hide');
- if (level > 1) {
+ .append($('').attr('class', class_name).text(title)
+ .on('click', function(e) {
+ $(item).popover('hide');
+ if (level > 1) {
+ e.stopPropagation();
+ }
+ })
+ .on('mousedown', function(e) {
+ // stop propagation to i.e. do not close jQuery-UI dialogs below
e.stopPropagation();
- }
- });
+ })
+ );
}
// Hide other menus on the same level