mirror of
https://github.com/Hopiu/jquery-mobile.git
synced 2026-03-24 01:40:25 +00:00
updated css to use min-width classes in place of media queries
This commit is contained in:
parent
38eb8aecc7
commit
f806fc07d7
5 changed files with 11 additions and 19 deletions
|
|
@ -23,6 +23,6 @@ div.hasDatepicker{ display: block; padding: 0; overflow: visible; margin: 8px 0
|
|||
.ui-datepicker td { border-width: 1px; padding: 0; text-align: center; }
|
||||
.ui-datepicker td span, .ui-datepicker td a { display: block; padding: .2em 0; font-weight: bold; margin: 0; border-width: 0; text-align: center; text-decoration: none; }
|
||||
|
||||
@media screen and (min-width: 480px){
|
||||
.min-width-480 {
|
||||
div.hasDatepicker { width: 63%; display: inline-block; margin: 0; }
|
||||
}
|
||||
|
|
@ -23,7 +23,5 @@
|
|||
.ui-controlgroup .ui-btn-icon-notext .ui-btn-inner { padding: 5px 6px 5px 5px; }
|
||||
*/
|
||||
|
||||
@media screen and (min-width: 480px){
|
||||
.ui-controlgroup-label { vertical-align: top; display: inline-block; width: 20%; margin: 0 2% 0 0; }
|
||||
.ui-controlgroup-controls { width: 60%; display: inline-block; }
|
||||
}
|
||||
.min-width-480 .ui-controlgroup-label { vertical-align: top; display: inline-block; width: 20%; margin: 0 2% 0 0; }
|
||||
.min-width-480 .ui-controlgroup-controls { width: 60%; display: inline-block; }
|
||||
|
|
@ -23,7 +23,5 @@ label.ui-select { font-size: 16px; line-height: 1.4; font-weight: normal; margi
|
|||
/*used in listbox - to be removed/replaced with page-style hiding*/
|
||||
.ui-helper-hidden,.ui-mobile .ui-content-hidden { display: none; }
|
||||
|
||||
@media screen and (min-width: 480px){
|
||||
label.ui-select { display: inline-block; width: 20%; margin: 0 2% 0 0; }
|
||||
.ui-select { width: 60%; display: inline-block; }
|
||||
}
|
||||
.min-width-480 label.ui-select { display: inline-block; width: 20%; margin: 0 2% 0 0; }
|
||||
.min-width-480 .ui-select { width: 60%; display: inline-block; }
|
||||
|
|
@ -9,10 +9,8 @@ select.ui-slider-switch { display: none; }
|
|||
div.ui-slider { position: relative; display: inline-block; overflow: visible; height: 15px; padding: 0; margin: 0 2% 0 15px; top: 4px; width: 66%; }
|
||||
a.ui-slider-handle { position: absolute; z-index: 10; top: 50%; width: 28px; height: 28px; margin-top: -15px; margin-left: -15px; }
|
||||
a.ui-slider-handle .ui-btn-inner { padding-left: 0; padding-right: 0; }
|
||||
@media screen and (min-width: 480px){
|
||||
label.ui-slider { display: inline-block; width: 20%; margin: 0 2% 0 0; }
|
||||
div.ui-slider { width: 45%; }
|
||||
}
|
||||
.min-width-480 label.ui-slider { display: inline-block; width: 20%; margin: 0 2% 0 0; }
|
||||
.min-width-480 div.ui-slider { width: 45%; }
|
||||
|
||||
div.ui-slider-switch { height: 32px; overflow: hidden; margin-left: 0; }
|
||||
div.ui-slider-inneroffset { margin-left: 50%; position: absolute; top: 1px; height: 100%; width: 50%; }
|
||||
|
|
|
|||
|
|
@ -12,9 +12,7 @@ textarea.ui-input-text { height: 50px; -webkit-transition: height 200ms linear;
|
|||
.ui-input-search .ui-input-clear-hidden { display: none; }
|
||||
|
||||
/* orientation adjustments - incomplete!*/
|
||||
@media screen and (min-width: 480px){
|
||||
label.ui-input-text { vertical-align: top; }
|
||||
label.ui-input-text, label.ui-select { display: inline-block; width: 20%; margin: 0 2% 0 0; }
|
||||
input.ui-input-text, textarea.ui-input-text, .ui-input-search { width: 60%; display: inline-block; }
|
||||
.ui-input-search { width: 50%; }
|
||||
}
|
||||
.min-width-480 label.ui-input-text { vertical-align: top; }
|
||||
.min-width-480 label.ui-input-text, label.ui-select { display: inline-block; width: 20%; margin: 0 2% 0 0; }
|
||||
.min-width-480 input.ui-input-text, textarea.ui-input-text, .ui-input-search { width: 60%; display: inline-block; }
|
||||
.min-width-480 .ui-input-search { width: 50%; }
|
||||
Loading…
Reference in a new issue