@@ -90,7 +90,7 @@ div.ui-btn-text { width: auto; }

.ui-field-contain .ui-btn.ui-submit { margin: 0; }
label.ui-submit { font-size: 16px; line-height: 1.4; font-weight: normal; margin: 0 0 .3em; display: block; }
@media all and (min-width: 28em){
@media (min-width: 28em) {
.ui-field-contain label.ui-submit { vertical-align: top; display: inline-block; width: 20%; margin: 0 2% 0 0; }
.ui-field-contain .ui-btn.ui-submit { width: 78%; display: inline-block; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; }
.ui-hide-label .ui-btn.ui-submit { width: auto; display: block; }
@@ -82,7 +82,7 @@
box-shadow: none;
}

@media all and (min-width: 28em){
@media (min-width: 28em) {
.ui-field-contain .ui-controlgroup-label { vertical-align: top; display: inline-block; width: 20%; margin: 0 2% 0 0; }
.ui-field-contain .ui-controlgroup-controls { width: 78%; display: inline-block; }
.ui-field-contain .ui-controlgroup .ui-select { width: 100%; display: block; }
@@ -1,12 +1,24 @@
.ui-field-contain, fieldset.ui-field-contain { padding: .8em 0; margin: 0; overflow: visible; }
.ui-field-contain,
fieldset.ui-field-contain {
padding: .8em 0;
margin: 0;
overflow: visible;
}
.ui-field-contain:after {
content: "";
display: block;
margin-top: 1em;
border-bottom: 1px solid;
}
.ui-field-contain:last-child { border-bottom-width: 0; }
.ui-field-contain { max-width: 100%; } /* This prevents horizontal scrollbar in IE7 */
@media all and (min-width: 28em){
.ui-field-contain, .ui-mobile fieldset.ui-field-contain { border-width: 0; padding: 0; margin: 1em 0; }
.ui-field-contain:last-child:after,
.ui-li.ui-field-contain:after {
content: none;
}
@media (min-width: 28em) {
.ui-field-contain,
.ui-mobile fieldset.ui-field-contain {
border-width: 0;
padding: 0;
margin: 1em 0;
}
}
@@ -65,7 +65,7 @@ html >/**/body .ui-rangeslider.ui-mini .ui-rangeslider-sliders .ui-slider-track:
height: 12px;
}

@media all and (min-width: 28em){
@media (min-width: 28em) {
.ui-field-contain .ui-rangeslider label.ui-slider {
float: left;
}
@@ -41,7 +41,7 @@ label.ui-select { font-size: 16px; line-height: 1.4; font-weight: normal; margin
.ui-selectmenu.ui-popup .ui-header { -webkit-border-top-left-radius: 0; border-top-left-radius: 0; -webkit-border-top-right-radius: 0; border-top-right-radius: 0; }
.ui-selectmenu .ui-header .ui-title { margin: 0.6em 46px 0.8em; }

@media all and (min-width: 28em){
@media (min-width: 28em) {
.ui-field-contain label.ui-select { vertical-align: top; display: inline-block; width: 20%; margin: 0 2% 0 0; }
.ui-field-contain .ui-select { width: 78%; display: inline-block; }
.ui-hide-label .ui-select { width: 100%; }
@@ -176,7 +176,7 @@ div.ui-slider-switch.ui-mini {
text-indent: 1.5em;
}

@media all and (min-width: 28em){
@media (min-width: 28em) {
.ui-field-contain label.ui-slider {
vertical-align: top;
display: inline-block;
@@ -29,7 +29,7 @@ input[type=number]::-webkit-outer-spin-button { margin: 0; }
/* Resolves issue #5756: Textinput in IE10 has a default clear icon */
input[data-clear-btn=true]::-ms-clear { display: none; }

@media all and (min-width: 28em){
@media (min-width: 28em) {
.ui-field-contain label.ui-input-text { vertical-align: top; display: inline-block; width: 20%; margin: 0 2% 0 0 }
.ui-field-contain input.ui-input-text,
.ui-field-contain textarea.ui-input-text,
@@ -23,7 +23,7 @@
.ui-grid-d .ui-block-a { clear: left; }

/* preset breakpoint to switch to stacked grid styles below 35em (560px) */
@media all and (max-width: 35em) {
@media (max-width: 35em) {
.ui-responsive .ui-block-a,
.ui-responsive .ui-block-b,
.ui-responsive .ui-block-c,
@@ -192,26 +192,22 @@
text-align: right;
margin: .3em 0;
}
@media all and (min-width: 480px){
@media (min-width: 28em) {
.ui-li-aside { width: 45%; }
}
ol.ui-listview,
ol.ui-listview .ui-li-divider {
counter-reset: listnumbering;
}
ol.ui-listview .ui-li > .ui-btn:before,
ol.ui-listview .ui-li-static:before,
.ui-li-dec {
ol.ui-listview .ui-li-static:before {
font-size: .8em;
display: inline-block;
padding-right: .3em;
font-weight: normal;
counter-increment: listnumbering;
content: counter(listnumbering) ". ";
}
ol.ui-listview .ui-li-jsnumbering:before {
content: "" !important;
}
ol.ui-listview .ui-li-heading {
display: inline-block;
width: 100%;
@@ -101,7 +101,7 @@
vertical-align: middle;
}

@media all and (min-width: 28em){
@media (min-width: 28em) {
.ui-popup .ui-field-contain label.ui-submit,
.ui-popup .ui-field-contain .ui-controlgroup-label,
.ui-popup .ui-field-contain label.ui-select,
@@ -19,38 +19,38 @@
<div data-role="content">
<div class="container">
<a href="#" data-role="button">Anchor</a>
<form>
<button>Button</button>
<input type="button" value="Input">
<input type="submit" value="Submit">
<input type="reset" value="Reset">
</form>
</div><!--/container -->
<div class="container">
<p>
<a href="#" data-role="button" data-inline="true">True</a>
<a href="#" data-role="button" data-inline="true">False</a>
</p>
</div><!--/container -->
<div class="container">
<p>
<a href="#" data-role="button" data-theme="a" data-inline="true">A</a>
<a href="#" data-role="button" data-theme="b" data-inline="true">B</a>
</p>
</div><!--/container -->
<div class="container">
<p>
<a href="#" data-role="button" data-mini="true" data-inline="true">Cancel</a>
<a href="#" data-role="button" data-mini="true" data-inline="true" data-icon="check" data-theme="b">Place order</a>
</p>
</div><!--/container -->
<div class="container">
<a href="#" data-role="button" data-icon="plus" data-iconpos="notext" data-inline="true">Plus</a>
<a href="#" data-role="button" data-icon="minus" data-iconpos="notext" data-inline="true">Minus</a>
<a href="#" data-role="button" data-icon="delete" data-iconpos="notext" data-inline="true">Delete</a>
@@ -71,55 +71,55 @@
<a href="#" data-role="button" data-icon="search" data-iconpos="notext" data-inline="true">Search</a>
<a href="#" data-role="button" data-icon="bars" data-iconpos="notext" data-inline="true">Bars</a>
<a href="#" data-role="button" data-icon="edit" data-iconpos="notext" data-inline="true">Edit</a>
</div><!--/container -->
<div class="container">
<a href="#" data-role="button" data-inline="true">Text only</a>
<a href="#" data-role="button" data-icon="arrow-l" data-iconpos="left" data-inline="true">Left</a>
<a href="#" data-role="button" data-icon="arrow-r" data-iconpos="right" data-inline="true">Right</a>
<a href="#" data-role="button" data-icon="arrow-u" data-iconpos="top" data-inline="true">Top</a>
<a href="#" data-role="button" data-icon="arrow-d" data-iconpos="bottom" data-inline="true">Bottom</a>
<a href="#" data-role="button" data-icon="delete" data-iconpos="notext" data-inline="true">Icon only</a>
</div><!--/container -->
<div class="container">
<div data-role="controlgroup">
<a href="#" data-role="button">Timeline</a>
<a href="#" data-role="button">Mentions</a>
<a href="#" data-role="button">Retweets</a>
</div>
</div><!--/container -->
<div class="container">
<div data-role="controlgroup" data-type="horizontal">
<a href="#" data-role="button">Yes</a>
<a href="#" data-role="button">No</a>
<a href="#" data-role="button">Maybe</a>
</div>
</div><!--/container -->
<div class="container">
<div data-role="controlgroup" data-type="horizontal" data-mini="true">
<a href="#" data-role="button" data-iconpos="notext" data-icon="plus" data-theme="b">Add</a>
<a href="#" data-role="button" data-iconpos="notext" data-icon="delete" data-theme="b">Delete</a>
<a href="#" data-role="button" data-iconpos="notext" data-icon="grid" data-theme="b">More</a>
</div>
</div><!--/container -->
<div class="container">
<a href="#" data-role="button" data-icon="gear" data-theme="b">Default</a>
<a href="#" data-role="button" data-icon="gear" data-corners="false" data-theme="b">No rounded corners</a>
<a href="#" data-role="button" data-icon="gear" data-shadow="false" data-theme="b">No button shadow</a>
<a href="#" data-role="button" data-icon="gear" data-iconshadow="false" data-theme="b">No icon disc shadow</a>
</div><!--/container -->
<div class="container">
<a href="#" data-role="button" class="ui-disabled">Disabled anchor via class</a>
<form>
<button disabled>Button with disabled attribute</button>
<input type="button" value="Input with disabled attribute" disabled>
</form>
</div><!--/container -->
</div><!-- /content -->
@@ -19,38 +19,38 @@
<div data-role="content">
<div class="container">
<a href="#" data-role="button">Anchor</a>
<form>
<button>Button</button>
<input type="button" value="Input">
<input type="submit" value="Submit">
<input type="reset" value="Reset">
</form>
</div><!--/container -->
<div class="container">
<p>
<a href="#" data-role="button" data-inline="true">True</a>
<a href="#" data-role="button" data-inline="true">False</a>
</p>
</div><!--/container -->
<div class="container">
<p>
<a href="#" data-role="button" data-theme="a" data-inline="true">A</a>
<a href="#" data-role="button" data-theme="b" data-inline="true">B</a>
</p>
</div><!--/container -->
<div class="container">
<p>
<a href="#" data-role="button" data-mini="true" data-inline="true">Cancel</a>
<a href="#" data-role="button" data-mini="true" data-inline="true" data-icon="check" data-theme="b">Place order</a>
</p>
</div><!--/container -->
<div class="container">
<a href="#" data-role="button" data-icon="plus" data-iconpos="notext" data-inline="true">Plus</a>
<a href="#" data-role="button" data-icon="minus" data-iconpos="notext" data-inline="true">Minus</a>
<a href="#" data-role="button" data-icon="delete" data-iconpos="notext" data-inline="true">Delete</a>
@@ -71,55 +71,55 @@
<a href="#" data-role="button" data-icon="search" data-iconpos="notext" data-inline="true">Search</a>
<a href="#" data-role="button" data-icon="bars" data-iconpos="notext" data-inline="true">Bars</a>
<a href="#" data-role="button" data-icon="edit" data-iconpos="notext" data-inline="true">Edit</a>
</div><!--/container -->
<div class="container">
<a href="#" data-role="button" data-inline="true">Text only</a>
<a href="#" data-role="button" data-icon="arrow-l" data-iconpos="left" data-inline="true">Left</a>
<a href="#" data-role="button" data-icon="arrow-r" data-iconpos="right" data-inline="true">Right</a>
<a href="#" data-role="button" data-icon="arrow-u" data-iconpos="top" data-inline="true">Top</a>
<a href="#" data-role="button" data-icon="arrow-d" data-iconpos="bottom" data-inline="true">Bottom</a>
<a href="#" data-role="button" data-icon="delete" data-iconpos="notext" data-inline="true">Icon only</a>
</div><!--/container -->
<div class="container">
<div data-role="controlgroup">
<a href="#" data-role="button">Timeline</a>
<a href="#" data-role="button">Mentions</a>
<a href="#" data-role="button">Retweets</a>
</div>
</div><!--/container -->
<div class="container">
<div data-role="controlgroup" data-type="horizontal">
<a href="#" data-role="button">Yes</a>
<a href="#" data-role="button">No</a>
<a href="#" data-role="button">Maybe</a>
</div>
</div><!--/container -->
<div class="container">
<div data-role="controlgroup" data-type="horizontal" data-mini="true">
<a href="#" data-role="button" data-iconpos="notext" data-icon="plus" data-theme="b">Add</a>
<a href="#" data-role="button" data-iconpos="notext" data-icon="delete" data-theme="b">Delete</a>
<a href="#" data-role="button" data-iconpos="notext" data-icon="grid" data-theme="b">More</a>
</div>
</div><!--/container -->
<div class="container">
<a href="#" data-role="button" data-icon="gear" data-theme="b">Default</a>
<a href="#" data-role="button" data-icon="gear" data-corners="false" data-theme="b">No rounded corners</a>
<a href="#" data-role="button" data-icon="gear" data-shadow="false" data-theme="b">No button shadow</a>
<a href="#" data-role="button" data-icon="gear" data-iconshadow="false" data-theme="b">No icon disc shadow</a>
</div><!--/container -->
<div class="container">
<a href="#" data-role="button" class="ui-disabled">Disabled anchor via class</a>
<form>
<button disabled>Button with disabled attribute</button>
<input type="button" value="Input with disabled attribute" disabled>
</form>
</div><!--/container -->
</div><!-- /content -->