Selectmenu: Prepend icon and move overflow to text span

Fixes #14938
Closes gh-1685
This commit is contained in:
Alexander Schmitz 2016-03-30 11:38:34 -04:00 committed by Scott González
parent bf5d6f314b
commit bff8277fbc
3 changed files with 9 additions and 6 deletions

View File

@ -21,7 +21,7 @@ test( "markup structure", function( assert ) {
assert.lacksClasses( button, "ui-selectmenu-button-open ui-selectmenu-open" );
assert.hasClasses( menuWrap, "ui-selectmenu-menu" );
assert.lacksClasses( menuWrap, "ui-selectmenu-menu-open" );
assert.strictEqual( icon[ 0 ], button.children().last()[ 0 ], "Icon is last child of button" );
assert.strictEqual( icon[ 0 ], button.children()[ 0 ], "Icon is first child of button" );
} );
asyncTest( "accessibility", function() {

View File

@ -33,10 +33,14 @@
.ui-selectmenu-open {
display: block;
}
.ui-selectmenu-button.ui-button {
text-align: left;
.ui-selectmenu-text {
display: block;
margin-right: 20px;
overflow: hidden;
text-overflow: ellipsis;
}
.ui-selectmenu-button.ui-button {
text-align: left;
white-space: nowrap;
width: 14em;
}

View File

@ -119,11 +119,10 @@ return $.widget( "ui.selectmenu", [ $.ui.formResetMixin, {
this._addClass( this.button, "ui-selectmenu-button ui-selectmenu-button-closed",
"ui-button ui-widget" );
this.buttonItem = this._renderButtonItem( item )
.appendTo( this.button );
icon = $( "<span>" ).appendTo( this.button );
this._addClass( icon, "ui-selectmenu-icon", "ui-icon " + this.options.icons.button );
this.buttonItem = this._renderButtonItem( item )
.appendTo( this.button );
if ( this.options.width !== false ) {
this._resizeButton();