diff options
| author | Alexander Schmitz <arschmitz@gmail.com> | 2016-02-10 11:31:03 -0500 |
|---|---|---|
| committer | Alexander Schmitz <arschmitz@gmail.com> | 2016-02-24 11:29:44 -0500 |
| commit | 20466d50277712050b4e403686a9df16b5eca4e9 (patch) | |
| tree | a867e38c14ac2cc0a10e991e10c0da3969f39ef6 | |
| parent | 8564641fb8dcff3f072106b075a1bdb1f16ec63d (diff) | |
| download | jquery-ui-20466d50277712050b4e403686a9df16b5eca4e9.tar.gz jquery-ui-20466d50277712050b4e403686a9df16b5eca4e9.zip | |
Selectmenu: Fixed selectmenu icon float right
Also removes the icon space as its not needed with a floated icon
Fixes #14914
Closes gh-1671
| -rw-r--r-- | tests/unit/selectmenu/core.js | 6 | ||||
| -rw-r--r-- | themes/base/selectmenu.css | 4 | ||||
| -rw-r--r-- | ui/widgets/selectmenu.js | 11 |
3 files changed, 13 insertions, 8 deletions
diff --git a/tests/unit/selectmenu/core.js b/tests/unit/selectmenu/core.js index 1c1a6b622..3c2b4936d 100644 --- a/tests/unit/selectmenu/core.js +++ b/tests/unit/selectmenu/core.js @@ -6,18 +6,22 @@ define( [ module( "selectmenu: core" ); test( "markup structure", function( assert ) { - expect( 4 ); + expect( 7 ); var element = $( "#files" ).selectmenu(), button = element.selectmenu( "widget" ), + icon = button.find( ".ui-icon" ), menu = element.selectmenu( "menuWidget" ), menuWrap = menu.parent(); + assert.strictEqual( icon.length, 1, "Exactly one icon exists" ); + assert.hasClasses( icon, "ui-selectmenu-icon" ); assert.hasClasses( button, "ui-selectmenu-button ui-selectmenu-button-closed ui-widget" ); 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" ); } ); asyncTest( "accessibility", function() { diff --git a/themes/base/selectmenu.css b/themes/base/selectmenu.css index 3449c19b5..65a2adfbf 100644 --- a/themes/base/selectmenu.css +++ b/themes/base/selectmenu.css @@ -40,3 +40,7 @@ white-space: nowrap; width: 14em; } +.ui-selectmenu-icon.ui-icon { + float: right; + margin-top: 0; +} diff --git a/ui/widgets/selectmenu.js b/ui/widgets/selectmenu.js index b251f04f1..fa7f87e94 100644 --- a/ui/widgets/selectmenu.js +++ b/ui/widgets/selectmenu.js @@ -84,7 +84,7 @@ return $.widget( "ui.selectmenu", [ $.ui.formResetMixin, { }, _drawButton: function() { - var icon, space, + var icon, that = this, item = this._parseOption( this.element.find( "option:selected" ), @@ -119,15 +119,12 @@ return $.widget( "ui.selectmenu", [ $.ui.formResetMixin, { this._addClass( this.button, "ui-selectmenu-button ui-selectmenu-button-closed", "ui-button ui-widget" ); - icon = $( "<span>" ).prependTo( this.button ); - space = $( "<span> </span>" ); - this._addClass( space, "ui-selectmenu-icon-space" ); - this._addClass( icon, null, "ui-icon " + this.options.icons.button ); - icon.after( space ); - 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 ); + if ( this.options.width !== false ) { this._resizeButton(); } |