diff options
| -rw-r--r-- | demos/controlgroup/default.html | 2 | ||||
| -rw-r--r-- | themes/base/controlgroup.css | 26 | ||||
| -rw-r--r-- | ui/widgets/controlgroup.js | 11 |
3 files changed, 31 insertions, 8 deletions
diff --git a/demos/controlgroup/default.html b/demos/controlgroup/default.html index ba7802cde..0c26bd6cd 100644 --- a/demos/controlgroup/default.html +++ b/demos/controlgroup/default.html @@ -26,7 +26,6 @@ $( ".controlgroup-vertical" ).controlgroup({ "direction": "vertical" }); - $( ".button" ).button(); </script> </head> <body> @@ -34,7 +33,6 @@ <h1>Controlgroup</h1> <fieldset> <legend>Rental Car</legend> - <button class="button">button</button> <div class="controlgroup"> <select id="car-type"> <option>Compact car</option> diff --git a/themes/base/controlgroup.css b/themes/base/controlgroup.css index 311b723cc..bda376deb 100644 --- a/themes/base/controlgroup.css +++ b/themes/base/controlgroup.css @@ -33,8 +33,10 @@ box-sizing: border-box; } .ui-controlgroup .ui-controlgroup-label { - font-size: .83em; - padding: .6em 1em; + padding: .4em 1em; +} +.ui-controlgroup .ui-controlgroup-label span { + font-size: 80%; } .ui-controlgroup-horizontal .ui-controlgroup-label + .ui-controlgroup-item { border-left: none; @@ -45,3 +47,23 @@ .ui-controlgroup-horizontal .ui-controlgroup-label.ui-widget-content { border-right: none; } +.ui-controlgroup-vertical .ui-controlgroup-label.ui-widget-content { + border-bottom: none; +} + +/* Spinner specific style fixes */ +.ui-controlgroup-vertical .ui-spinner { + padding-right: .4em; +} +.ui-controlgroup-vertical .ui-spinner-input { + margin: .4em; + padding: 0; + + /* Support IE8, Android < 4.4 */ + width: 85%; + width: calc( 100% - 22px ); +} +.ui-controlgroup-vertical .ui-spinner .ui-spinner-up { + border-top-style: solid; +} + diff --git a/ui/widgets/controlgroup.js b/ui/widgets/controlgroup.js index 4e68ad7a8..c895ab09e 100644 --- a/ui/widgets/controlgroup.js +++ b/ui/widgets/controlgroup.js @@ -97,6 +97,9 @@ return $.widget( "ui.controlgroup", { } ); } else if ( selector && widget === "controlgroupLabel" ) { labels = that.element.find( selector ); + labels.each( function() { + $( this ).contents().wrapAll( "<span class='ui-controlgroup-label-contents'></span>" ); + } ); that._addClass( labels, null, "ui-widget ui-widget-content ui-state-default" ); Array.prototype.push.apply( childWidgets, labels.get() ); } @@ -117,9 +120,9 @@ return $.widget( "ui.controlgroup", { }, _updateCornerClass: function( element, position ) { - var remove = "ui-corner-top ui-corner-bottom ui-corner-left ui-corner-right", - add = - this._buildSimpleOptions( position, this.options.direction, "label" ).classes.label; + var direction = this.options.direction === "vertical" + remove = "ui-corner-top ui-corner-bottom ui-corner-left ui-corner-right", + add = this._buildSimpleOptions( position, direction, "label" ).classes.label; this._removeClass( element, null, remove ); this._addClass( element, null, add ); @@ -219,7 +222,7 @@ return $.widget( "ui.controlgroup", { $.each( [ "first", "last" ], function( index, value ) { var instance = children[ value ]().data( "ui-controlgroup-data" ); - if ( that[ "_" + instance.widgetName + "_options" ] ) { + if ( instance && that[ "_" + instance.widgetName + "_options" ] ) { instance.element[ instance.widgetName ]( that[ "_" + instance.widgetName + "_options" ]( value, |