@ -128,6 +128,8 @@
@color-checkbox-focus: darken(@color-checkbox, 30%);
@color-checkbox-checked-focus: darken(@color-checkbox-checked, 30%);
@color-form-hint: #888;
@color-image-upload-background: #f6f6f6;
@color-blockquote-background: #f6f6f6;
@ -283,6 +283,24 @@ table.table {
}
.buttons-cell {
width: 1%;
white-space: nowrap;
text-align: center;
a.button:before {
line-height: 1;
float: none;
display: inline-block;
@media screen and (min-width: @screen-width-xs) {
a.button .inner {
display: inline;
label {
margin: 0;
@ -210,6 +210,22 @@ input.smart-upload {
margin-top: .5rem;
.form-text {
font-size: 90%;
color: @color-form-hint;
/* Some dialogs may use simple one-row forms like this */
&.row.form-group {
margin-left: 0;
margin-right: 0;
label, div {
padding-left: 0;
padding-right: 0;
@media screen and (max-width: 576px) {
@ -442,6 +458,9 @@ html.layout-phone {
&.filter:before {
content: @fa-var-filter;
&.key:before {
content: @fa-var-key;
.inner {
display: none;
@ -648,8 +648,13 @@ function rcube_elastic_ui()
$('#login-form table tr').each(function() {
var input = $('input,select', this),
label = $('label', this),
icon_name = input.data('icon'),
icon = $('<i>').attr('class', 'input-group-addon icon ' + input.attr('name').replace('_', ''));
if (icon_name) {
icon.addClass(icon_name);
$(this).addClass('form-group row');
label.parent().css('display', 'none');
input.addClass('form-control')