(css) Fix advanced mailbox search

We must rely on the pseudo-input-container to properly wrap the
md-select inside a md-toolbar.
pull/239/head
Francis Lachapelle 2017-12-12 12:54:56 -05:00
parent d526efa501
commit b3f2fba4da
3 changed files with 13 additions and 24 deletions

1
NEWS
View File

@ -40,6 +40,7 @@ Bug fixes
- [web] fixed path of destination mailbox in Sieve filter editor - [web] fixed path of destination mailbox in Sieve filter editor
- [web] force copy of dragged contacts from global address books - [web] force copy of dragged contacts from global address books
- [web] removed null characters from JSON responses - [web] removed null characters from JSON responses
- [web] fixed advanced mailbox search when mailbox name is very long
- [eas] hebrew folders encoding problem using EAS (#4240) - [eas] hebrew folders encoding problem using EAS (#4240)
- [eas] avoid sync requests for shared folders every second (#4275) - [eas] avoid sync requests for shared folders every second (#4275)

View File

@ -8,10 +8,13 @@
<!-- in virtual mailbox mode --> <!-- in virtual mailbox mode -->
<md-toolbar class="md-whiteframe-z1 md-hue-3" <md-toolbar class="md-whiteframe-z1 md-hue-3"
ng-hide="!mailbox.service.$virtualPath || mailbox.mode.multiple"> ng-hide="!mailbox.service.$virtualPath || mailbox.mode.multiple">
<div class="md-toolbar-tools"> <div class="md-toolbar-tools"
<md-input-container class="md-flex"> layout="row" layout-align="start start">
<label><var:string label:value="Search messages in"/></label> <div class="pseudo-input-container pseudo-input-container--compact md-flex sg-no-wrap">
<md-select ng-model="mailbox.service.$virtualPath"> <label class="pseudo-input-label pseudo-input-label">
<var:string label:value="Search messages in"/>
</label>
<md-select class="pseudo-input-field" ng-model="mailbox.service.$virtualPath">
<md-option ng-value=""> <md-option ng-value="">
<span ng-bind="app.accounts[0].name"><!-- main account name --></span> <span ng-bind="app.accounts[0].name"><!-- main account name --></span>
</md-option> </md-option>
@ -23,7 +26,7 @@
ng-bind="folder.$displayName"><!-- mailbox name --></span> ng-bind="folder.$displayName"><!-- mailbox name --></span>
</md-option> </md-option>
</md-select> </md-select>
</md-input-container> </div>
<md-menu> <md-menu>
<md-button class="sg-icon-button" label:aria-label="More search options" ng-click="$mdMenu.open()"> <md-button class="sg-icon-button" label:aria-label="More search options" ng-click="$mdMenu.open()">
<md-icon>settings</md-icon> <md-icon>settings</md-icon>

View File

@ -54,13 +54,9 @@
@include rtl(transform-origin, right center, left center); @include rtl(transform-origin, right center, left center);
} }
.pseudo-input-label--no-margin,
.button-label {
margin-top: 0;
}
.pseudo-input-field { .pseudo-input-field {
display: block; display: block;
margin: 0;
padding-top: $input-padding-top + 2; padding-top: $input-padding-top + 2;
padding-bottom: $input-border-width-focused - $input-border-width-default; padding-bottom: $input-border-width-focused - $input-border-width-default;
padding-left: 2px; padding-left: 2px;
@ -68,15 +64,9 @@
border-width: 0; border-width: 0;
} }
.pseudo-input-field--underline { md-select.pseudo-input-field {
@extend .pseudo-input-field; margin-bottom: $mg;
border-bottom: 1px solid $colorGrayLighter; padding: 0;
&:focus,
&:active,
&:hover {
margin-bottom: ($line - 1);
border-bottom: 2px solid sg-color($sogoBlue, 500);
}
} }
// The specs dimensions are too large to fit with angular-material // The specs dimensions are too large to fit with angular-material
@ -86,8 +76,3 @@
margin-top: 0; margin-top: 0;
} }
} }
input #inner-editor {
color: $colorGrayLight;
line-height: inherit;
}