diff --git a/browserslist b/browserslist new file mode 100644 index 00000000000..873385252cf --- /dev/null +++ b/browserslist @@ -0,0 +1,16 @@ +last 2 Chrome versions +last 2 Firefox versions +ie >= 9 +last 2 Edge versions +Safari >= 6 +Opera >= 12 +Android >= 4 +last 2 ChromeAndroid versions +last 2 FirefoxAndroid versions +last 2 Samsung versions +iOS >= 7 +last 2 OperaMobile versions +last 2 OperaMini versions +last 2 Samsung versions +last 2 UCAndroid versions +BlackBerry 7-10 diff --git a/build/tasks/alias.js b/build/tasks/alias.js index 8e703dcafc8..9df92db66b7 100644 --- a/build/tasks/alias.js +++ b/build/tasks/alias.js @@ -32,6 +32,7 @@ grunt.registerTask( "build:js", [ ] ); grunt.registerTask( "build:css", [ "cssbuild", + "postcss", "csslint", "cssmin" ] ); diff --git a/build/tasks/options/postcss.js b/build/tasks/options/postcss.js new file mode 100644 index 00000000000..0f7ae0a83b0 --- /dev/null +++ b/build/tasks/options/postcss.js @@ -0,0 +1,15 @@ +module.exports = function( grunt ) { + var files = require( "../../files.js" )( grunt ); + + return { + options: { + map: false, + processors: [ + require( "autoprefixer" ) + ] + }, + all: { + src: "<%= dist %>" + files.css.structure.unminified + } + }; +}; diff --git a/css/structure/jquery.mobile.collapsible.css b/css/structure/jquery.mobile.collapsible.css index b6aa8a597cb..bd9ebf4a3c8 100644 --- a/css/structure/jquery.mobile.collapsible.css +++ b/css/structure/jquery.mobile.collapsible.css @@ -61,31 +61,23 @@ display: none; } .ui-collapsible-set > .ui-collapsible.ui-corner-all { - -webkit-border-radius: 0; border-radius: 0; } .ui-collapsible-heading, .ui-collapsible-heading > .ui-button { - -webkit-border-radius: inherit; border-radius: inherit; } .ui-collapsible-set .ui-collapsible.ui-first-child { - -webkit-border-top-right-radius: inherit; border-top-right-radius: inherit; - -webkit-border-top-left-radius: inherit; border-top-left-radius: inherit; } .ui-collapsible-content, .ui-collapsible-set .ui-collapsible.ui-last-child { - -webkit-border-bottom-right-radius: inherit; border-bottom-right-radius: inherit; - -webkit-border-bottom-left-radius: inherit; border-bottom-left-radius: inherit; } .ui-collapsible-themed-content:not(.ui-collapsible-collapsed) > .ui-collapsible-heading { - -webkit-border-bottom-right-radius: 0; border-bottom-right-radius: 0; - -webkit-border-bottom-left-radius: 0; border-bottom-left-radius: 0; } .ui-collapsible-set .ui-collapsible { diff --git a/css/structure/jquery.mobile.controlgroup.css b/css/structure/jquery.mobile.controlgroup.css index f7697664689..8deeefe2eb4 100644 --- a/css/structure/jquery.mobile.controlgroup.css +++ b/css/structure/jquery.mobile.controlgroup.css @@ -30,8 +30,6 @@ .ui-controlgroup-vertical > .ui-button, .ui-controlgroup-vertical > li > .ui-button { display: block; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; box-sizing: border-box; } @@ -94,7 +92,5 @@ .ui-controlgroup > .ui-shadow:not(:focus), .ui-controlgroup > .ui-shadow:not(.ui-focus) { - -moz-box-shadow: none; - -webkit-box-shadow: none; box-shadow: none; } diff --git a/css/structure/jquery.mobile.core.css b/css/structure/jquery.mobile.core.css index 9862fe79063..0c3947aa7cc 100644 --- a/css/structure/jquery.mobile.core.css +++ b/css/structure/jquery.mobile.core.css @@ -27,7 +27,7 @@ margin: 0; overflow-x: visible; -webkit-text-size-adjust: 100%; - -ms-text-size-adjust:none; + -ms-text-size-adjust: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } /* Issue #2066 */ @@ -141,7 +141,6 @@ div.ui-mobile-viewport { width: 2.75em; height: 2.75em; padding: .0625em; - -webkit-border-radius: 2.25em; border-radius: 2.25em; } .ui-loader-verbose .ui-icon-loading { @@ -186,17 +185,13 @@ div.ui-mobile-viewport { .ui-corner-all > .ui-toolbar-header:first-child, .ui-corner-all > .ui-content:first-child, .ui-corner-all > .ui-toolbar-footer:first-child { - -webkit-border-top-left-radius: inherit; border-top-left-radius: inherit; - -webkit-border-top-right-radius: inherit; border-top-right-radius: inherit; } .ui-corner-all > .ui-toolbar-header:last-child, .ui-corner-all > .ui-content:last-child, .ui-corner-all > .ui-toolbar-footer:last-child { - -webkit-border-bottom-left-radius: inherit; border-bottom-left-radius: inherit; - -webkit-border-bottom-right-radius: inherit; border-bottom-right-radius: inherit; } @@ -213,9 +208,6 @@ div.ui-mobile-viewport { overflow: hidden; white-space: nowrap; cursor: pointer; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; user-select: none; } .ui-button-icon-only, @@ -316,8 +308,6 @@ div.ui-mobile-viewport { /* Button elements and input buttons */ button.ui-button, input.ui-button { - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; box-sizing: border-box; -webkit-appearance: none; -moz-appearance: none; @@ -336,8 +326,6 @@ button.ui-button::-moz-focus-inner { } button.ui-button-icon-only, input.ui-button-icon-only { - -webkit-box-sizing: content-box; - -moz-box-sizing: content-box; box-sizing: content-box; width: 1.75em; } diff --git a/css/structure/jquery.mobile.forms.fieldcontain.css b/css/structure/jquery.mobile.forms.fieldcontain.css index 176910d2a1c..cc5745f5ba4 100644 --- a/css/structure/jquery.mobile.forms.fieldcontain.css +++ b/css/structure/jquery.mobile.forms.fieldcontain.css @@ -61,8 +61,6 @@ .ui-field-contain .ui-controlgroup { float: left; width: 78%; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; box-sizing: border-box; } diff --git a/css/structure/jquery.mobile.forms.flipswitch.css b/css/structure/jquery.mobile.forms.flipswitch.css index 13d21232f83..f89678f917f 100644 --- a/css/structure/jquery.mobile.forms.flipswitch.css +++ b/css/structure/jquery.mobile.forms.flipswitch.css @@ -7,18 +7,9 @@ border-style: solid; margin: .5em 0; overflow: hidden; - -webkit-transition-property: padding, width, background-color, color, border-color; - -moz-transition-property: padding, width, background-color, color, border-color; - -o-transition-property: padding, width, background-color, color, border-color; transition-property: padding, width, background-color, color, border-color; - -webkit-transition-duration: 100ms; - -moz-transition-duration: 100ms; - -o-transition-duration: 100ms; transition-duration: 100ms; -webkit-touch-callout: none; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; user-select: none; cursor: pointer; } @@ -52,8 +43,6 @@ text-align: left; border-width: 1px; border-style: solid; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; box-sizing: border-box; border-radius: inherit; overflow: visible; @@ -69,8 +58,6 @@ html .ui-field-contain > label + .ui-flipswitch, html .ui-popup .ui-field-contain > label + .ui-flipswitch { display: inline-block; width: 5.875em; /* If you override the width for .ui-flipswitch you should repeat the same value here */ - -webkit-box-sizing: content-box; - -moz-box-sizing: content-box; box-sizing: content-box; } .ui-field-contain .ui-flipswitch.ui-flipswitch-active, diff --git a/css/structure/jquery.mobile.forms.select.css b/css/structure/jquery.mobile.forms.select.css index 144c36d5edf..1bd4c8fd34b 100644 --- a/css/structure/jquery.mobile.forms.select.css +++ b/css/structure/jquery.mobile.forms.select.css @@ -23,7 +23,6 @@ height: 3em; max-height: 100%; outline: 0; - -webkit-border-radius: inherit; border-radius: inherit; -webkit-appearance: none; -moz-appearance: none; @@ -95,9 +94,7 @@ position: relative; } .ui-selectmenu-custom.ui-popup .ui-toolbar-header { - -webkit-border-bottom-right-radius: 0; border-bottom-right-radius: 0; - -webkit-border-bottom-left-radius: 0; border-bottom-left-radius: 0; } @@ -116,13 +113,10 @@ .ui-selectmenu-custom .ui-selectmenu-custom-list { margin: 0; - -webkit-border-radius: inherit; border-radius: inherit; } .ui-toolbar-header:not(.ui-screen-hidden) + .ui-selectmenu-custom-list { - -webkit-border-top-right-radius: 0; border-top-right-radius: 0; - -webkit-border-top-left-radius: 0; border-top-left-radius: 0; } .ui-toolbar-header.ui-screen-hidden + .ui-selectmenu-custom-list li.ui-first-child .ui-button { diff --git a/css/structure/jquery.mobile.forms.slider.css b/css/structure/jquery.mobile.forms.slider.css index 00ab53fca26..6df34bccf7b 100644 --- a/css/structure/jquery.mobile.forms.slider.css +++ b/css/structure/jquery.mobile.forms.slider.css @@ -28,9 +28,6 @@ input.ui-slider-input { text-align: center; -webkit-appearance: none; -moz-appearance: none; - appearance: none; - -webkit-box-sizing: content-box; - -moz-box-sizing: content-box; box-sizing: content-box; } .ui-slider-input::-webkit-outer-spin-button, @@ -111,8 +108,6 @@ div.ui-slider-switch.ui-mini { padding: 0; } .ui-slider-handle-snapping { - -webkit-transition: left 70ms linear; - -moz-transition: left 70ms linear; transition: left 70ms linear; } .ui-slider-switch .ui-slider-label { @@ -145,7 +140,6 @@ div.ui-slider-switch.ui-mini { .ui-slider-switch .ui-slider-label, .ui-slider-switch .ui-slider-inneroffset, .ui-slider-handle { - -webkit-border-radius: inherit; border-radius: inherit; } .ui-field-contain div.ui-slider-switch { diff --git a/css/structure/jquery.mobile.forms.textinput.autogrow.css b/css/structure/jquery.mobile.forms.textinput.autogrow.css index e3240164655..b05ee29196a 100644 --- a/css/structure/jquery.mobile.forms.textinput.autogrow.css +++ b/css/structure/jquery.mobile.forms.textinput.autogrow.css @@ -3,8 +3,5 @@ textarea.ui-textinput-text.ui-textinput-autogrow { } .ui-textinput-autogrow-resize { - -webkit-transition: height .25s; - -o-transition: height .25s; - -moz-transition: height .25s; transition: height .25s; } diff --git a/css/structure/jquery.mobile.forms.textinput.css b/css/structure/jquery.mobile.forms.textinput.css index d5e5690993c..cc154660d32 100644 --- a/css/structure/jquery.mobile.forms.textinput.css +++ b/css/structure/jquery.mobile.forms.textinput.css @@ -11,8 +11,6 @@ textarea.ui-textinput-text { line-height: 1.4em; display: block; width: 100%; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; box-sizing: border-box; outline: 0; } @@ -24,7 +22,7 @@ textarea.ui-textinput-text { border: 0; background: transparent none; -webkit-appearance: none; - -webkit-border-radius: inherit; + -moz-appearance: none; border-radius: inherit; } textarea.ui-textinput-text { @@ -58,9 +56,7 @@ textarea.ui-mini { .ui-textinput-has-clear-button input { padding-right: 0; /* Autofill on Chrome has bg color so we unset corners right as well. */ - -webkit-border-top-right-radius: 0; border-top-right-radius: 0; - -webkit-border-bottom-right-radius: 0; border-bottom-right-radius: 0; } /* Search icon */ @@ -120,7 +116,5 @@ for Android 4.1 */ } .ui-textinput-text input:focus, .ui-textinput-search input:focus { - -webkit-box-shadow: none; - -moz-box-shadow: none; box-shadow: none; } diff --git a/css/structure/jquery.mobile.grid.css b/css/structure/jquery.mobile.grid.css index 408537043f0..c5d4ace4ac1 100644 --- a/css/structure/jquery.mobile.grid.css +++ b/css/structure/jquery.mobile.grid.css @@ -29,8 +29,6 @@ border: 0; float: left; min-height: 1px; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; box-sizing: border-box; } /* force new row */ diff --git a/css/structure/jquery.mobile.listview.css b/css/structure/jquery.mobile.listview.css index 4b96dd91d07..83ed8a1286f 100644 --- a/css/structure/jquery.mobile.listview.css +++ b/css/structure/jquery.mobile.listview.css @@ -64,46 +64,33 @@ } .ui-listview > li.ui-first-child, .ui-listview > li.ui-first-child > a.ui-button { - -webkit-border-top-right-radius: inherit; border-top-right-radius: inherit; - -webkit-border-top-left-radius: inherit; border-top-left-radius: inherit; } .ui-listview > li.ui-last-child, .ui-listview > li.ui-last-child > a.ui-button { - -webkit-border-bottom-right-radius: inherit; border-bottom-right-radius: inherit; - -webkit-border-bottom-left-radius: inherit; border-bottom-left-radius: inherit; } .ui-listview > li.ui-listview-item-has-alternate > a.ui-button { - -webkit-border-top-right-radius: 0; border-top-right-radius: 0; - -webkit-border-bottom-right-radius: 0; border-bottom-right-radius: 0; } .ui-listview > li.ui-first-child > a.ui-button + a.ui-button { - -webkit-border-top-left-radius: 0; border-top-left-radius: 0; - -webkit-border-top-right-radius: inherit; border-top-right-radius: inherit; } .ui-listview > li.ui-last-child > a.ui-button + a.ui-button { - -webkit-border-bottom-left-radius: 0; border-bottom-left-radius: 0; - -webkit-border-bottom-right-radius: inherit; border-bottom-right-radius: inherit; } .ui-listview > li.ui-first-child img:first-child:not(.ui-listview-item-icon) { - -webkit-border-top-left-radius: inherit; border-top-left-radius: inherit; } .ui-listview > li.ui-last-child img:first-child:not(.ui-listview-item-icon) { - -webkit-border-bottom-left-radius: inherit; border-bottom-left-radius: inherit; } .ui-collapsible-content > .ui-listview:not(.ui-listview-inset) { - -webkit-border-radius: inherit; border-radius: inherit; } .ui-listview > .ui-listview-item-static { @@ -199,8 +186,6 @@ position: absolute; width: 2.5em; height: 100%; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; box-sizing: border-box; border-left-width: 1px; top: 0; diff --git a/css/structure/jquery.mobile.panel.css b/css/structure/jquery.mobile.panel.css index 4e400195cb0..3038055d9e0 100644 --- a/css/structure/jquery.mobile.panel.css +++ b/css/structure/jquery.mobile.panel.css @@ -70,9 +70,6 @@ /* Animate class is added to panel, wrapper and fixed toolbars */ .ui-panel-animate { - -webkit-transition: -webkit-transform 300ms ease; - -webkit-transition-duration: 300ms; - -moz-transition: -moz-transform 300ms ease; transition: transform 300ms ease; } @@ -105,8 +102,6 @@ .ui-panel-animate.ui-panel-position-left.ui-panel-display-overlay, .ui-panel-animate.ui-panel-position-left.ui-panel-display-push { left: 0; - -webkit-transform: translate3d(-17em,0,0); - -moz-transform: translate3d(-17em,0,0); transform: translate3d(-17em,0,0); } /* Panel left open */ @@ -117,7 +112,6 @@ /* Panel left open animated */ .ui-panel-animate.ui-panel-open.ui-panel-position-left.ui-panel-display-overlay, .ui-panel-animate.ui-panel-open.ui-panel-position-left.ui-panel-display-push { - -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0); -moz-transform: none; } @@ -129,8 +123,6 @@ .ui-panel-animate.ui-panel-position-right.ui-panel-display-overlay, .ui-panel-animate.ui-panel-position-right.ui-panel-display-push { right: 0; - -webkit-transform: translate3d(17em,0,0); - -moz-transform: translate3d(17em,0,0); transform: translate3d(17em,0,0); } /* Panel right open */ @@ -141,7 +133,6 @@ /* Panel right open animated */ .ui-panel-animate.ui-panel-open.ui-panel-position-right.ui-panel-display-overlay, .ui-panel-animate.ui-panel-open.ui-panel-position-right.ui-panel-display-push { - -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0); -moz-transform: none; } @@ -156,8 +147,6 @@ .ui-panel-animate.ui-panel-page-content-position-left { left: 0; right: 0; - -webkit-transform: translate3d(17em,0,0); - -moz-transform: translate3d(17em,0,0); transform: translate3d(17em,0,0); } /* Panel right open */ @@ -169,8 +158,6 @@ .ui-panel-animate.ui-panel-page-content-position-right { left: 0; right: 0; - -webkit-transform: translate3d(-17em,0,0); - -moz-transform: translate3d(-17em,0,0); transform: translate3d(-17em,0,0); } @@ -184,23 +171,15 @@ /* Shadows and borders */ .ui-panel-display-reveal { - -webkit-box-shadow: inset -5px 0 5px rgba(0,0,0,.15); - -moz-box-shadow: inset -5px 0 5px rgba(0,0,0,.15); box-shadow: inset -5px 0 5px rgba(0,0,0,.15); } .ui-panel-position-right.ui-panel-display-reveal { - -webkit-box-shadow: inset 5px 0 5px rgba(0,0,0,.15); - -moz-box-shadow: inset 5px 0 5px rgba(0,0,0,.15); box-shadow: inset 5px 0 5px rgba(0,0,0,.15); } .ui-panel-display-overlay { - -webkit-box-shadow: 5px 0 5px rgba(0,0,0,.15); - -moz-box-shadow: 5px 0 5px rgba(0,0,0,.15); box-shadow: 5px 0 5px rgba(0,0,0,.15); } .ui-panel-position-right.ui-panel-display-overlay { - -webkit-box-shadow: -5px 0 5px rgba(0,0,0,.15); - -moz-box-shadow: -5px 0 5px rgba(0,0,0,.15); box-shadow: -5px 0 5px rgba(0,0,0,.15); } .ui-panel-open.ui-panel-position-left.ui-panel-display-push { diff --git a/css/structure/jquery.mobile.popup.arrow.css b/css/structure/jquery.mobile.popup.arrow.css index d9fbb5e7cad..25a5da22e09 100644 --- a/css/structure/jquery.mobile.popup.arrow.css +++ b/css/structure/jquery.mobile.popup.arrow.css @@ -151,9 +151,6 @@ } .ui-popup-arrow { - -webkit-transform: rotate(45deg); - -moz-transform: rotate(45deg); - -ms-transform: rotate(45deg); transform: rotate(45deg); position: absolute; overflow: hidden; diff --git a/css/structure/jquery.mobile.popup.css b/css/structure/jquery.mobile.popup.css index a705dc12ec0..895fd01c353 100644 --- a/css/structure/jquery.mobile.popup.css +++ b/css/structure/jquery.mobile.popup.css @@ -109,7 +109,6 @@ .ui-popup:not(.ui-content) > img:only-child, .ui-popup:not(.ui-content) > .ui-button-left:first-child + img:last-child, .ui-popup:not(.ui-content) > .ui-button-right:first-child + img:last-child { - -webkit-border-radius: inherit; border-radius: inherit; } .ui-popup iframe { diff --git a/css/structure/jquery.mobile.table.reflow.css b/css/structure/jquery.mobile.table.reflow.css index 2eb4081f25d..49977805c8e 100644 --- a/css/structure/jquery.mobile.table.reflow.css +++ b/css/structure/jquery.mobile.table.reflow.css @@ -71,8 +71,6 @@ .ui-table-reflow.ui-responsive td, .ui-table-reflow.ui-responsive th { width: 100%; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; box-sizing: border-box; float: left; clear: left; diff --git a/css/structure/jquery.mobile.transition.css b/css/structure/jquery.mobile.transition.css index 9d350f9a6e5..f83c805fe73 100644 --- a/css/structure/jquery.mobile.transition.css +++ b/css/structure/jquery.mobile.transition.css @@ -4,8 +4,6 @@ width: 100%; height: 100%; overflow: hidden; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; box-sizing: border-box; } @@ -13,18 +11,10 @@ opacity: 0; } .in { - -webkit-animation-timing-function: ease-out; - -webkit-animation-duration: 350ms; - -moz-animation-timing-function: ease-out; - -moz-animation-duration: 350ms; animation-timing-function: ease-out; animation-duration: 350ms; } .out { - -webkit-animation-timing-function: ease-in; - -webkit-animation-duration: 225ms; - -moz-animation-timing-function: ease-in; - -moz-animation-duration: 225ms; animation-timing-function: ease-in; animation-duration: 225ms; } diff --git a/css/structure/jquery.mobile.transition.fade.css b/css/structure/jquery.mobile.transition.fade.css index 2f91a3245ea..04ba15fde5f 100644 --- a/css/structure/jquery.mobile.transition.fade.css +++ b/css/structure/jquery.mobile.transition.fade.css @@ -38,20 +38,12 @@ .fade.out { opacity: 0; - -webkit-animation-duration: 125ms; - -webkit-animation-name: fadeout; - -moz-animation-duration: 125ms; - -moz-animation-name: fadeout; animation-duration: 125ms; animation-name: fadeout; } .fade.in { opacity: 1; - -webkit-animation-duration: 225ms; - -webkit-animation-name: fadein; - -moz-animation-duration: 225ms; - -moz-animation-name: fadein; animation-duration: 225ms; animation-name: fadein; } diff --git a/css/structure/jquery.mobile.transition.flip.css b/css/structure/jquery.mobile.transition.flip.css index 48028d780a3..353182c7248 100644 --- a/css/structure/jquery.mobile.transition.flip.css +++ b/css/structure/jquery.mobile.transition.flip.css @@ -6,53 +6,31 @@ */ .viewport-flip { - -webkit-perspective: 1000; - -moz-perspective: 1000; perspective: 1000; position: absolute; } .flip { - -webkit-backface-visibility: hidden; - -webkit-transform: translateX(0); /* Needed to work around an iOS 3.1 bug that causes listview thumbs to disappear when -webkit-visibility:hidden is used. */ - -moz-backface-visibility: hidden; - -moz-transform: translateX(0); backface-visibility: hidden; transform: translateX(0); } .flip.out { - -webkit-transform: rotateY(-90deg) scale(.9); - -webkit-animation-name: flipouttoleft; - -webkit-animation-duration: 175ms; - -moz-transform: rotateY(-90deg) scale(.9); - -moz-animation-name: flipouttoleft; - -moz-animation-duration: 175ms; transform: rotateY(-90deg) scale(.9); animation-name: flipouttoleft; animation-duration: 175ms; } .flip.in { - -webkit-animation-name: flipintoright; - -webkit-animation-duration: 225ms; - -moz-animation-name: flipintoright; - -moz-animation-duration: 225ms; animation-name: flipintoright; animation-duration: 225ms; } .flip.out.reverse { - -webkit-transform: rotateY(90deg) scale(.9); - -webkit-animation-name: flipouttoright; - -moz-transform: rotateY(90deg) scale(.9); - -moz-animation-name: flipouttoright; transform: rotateY(90deg) scale(.9); animation-name: flipouttoright; } .flip.in.reverse { - -webkit-animation-name: flipintoleft; - -moz-animation-name: flipintoleft; animation-name: flipintoleft; } diff --git a/css/structure/jquery.mobile.transition.flow.css b/css/structure/jquery.mobile.transition.flow.css index 553ad5b66f2..130f0146fe3 100644 --- a/css/structure/jquery.mobile.transition.flow.css +++ b/css/structure/jquery.mobile.transition.flow.css @@ -1,29 +1,13 @@ /* flow transition */ .flow { - -webkit-transform-origin: 50% 30%; - -webkit-box-shadow: 0 0 20px rgba(0,0,0,.4); - -moz-transform-origin: 50% 30%; - -moz-box-shadow: 0 0 20px rgba(0,0,0,.4); transform-origin: 50% 30%; box-shadow: 0 0 20px rgba(0,0,0,.4); } .ui-page-dialog.flow { - -webkit-transform-origin: none; - -webkit-box-shadow: none; - -moz-transform-origin: none; - -moz-box-shadow: none; transform-origin: none; box-shadow: none; } .flow.out { - -webkit-transform: translateX(-100%) scale(.7); - -webkit-animation-name: flowouttoleft; - -webkit-animation-timing-function: ease; - -webkit-animation-duration: 350ms; - -moz-transform: translateX(-100%) scale(.7); - -moz-animation-name: flowouttoleft; - -moz-animation-timing-function: ease; - -moz-animation-duration: 350ms; transform: translateX(-100%) scale(.7); animation-name: flowouttoleft; animation-timing-function: ease; @@ -31,14 +15,6 @@ } .flow.in { - -webkit-transform: translateX(0) scale(1); - -webkit-animation-name: flowinfromright; - -webkit-animation-timing-function: ease; - -webkit-animation-duration: 350ms; - -moz-transform: translateX(0) scale(1); - -moz-animation-name: flowinfromright; - -moz-animation-timing-function: ease; - -moz-animation-duration: 350ms; transform: translateX(0) scale(1); animation-name: flowinfromright; animation-timing-function: ease; @@ -46,17 +22,11 @@ } .flow.out.reverse { - -webkit-transform: translateX(100%); - -webkit-animation-name: flowouttoright; - -moz-transform: translateX(100%); - -moz-animation-name: flowouttoright; transform: translateX(100%); animation-name: flowouttoright; } .flow.in.reverse { - -webkit-animation-name: flowinfromleft; - -moz-animation-name: flowinfromleft; animation-name: flowinfromleft; } diff --git a/css/structure/jquery.mobile.transition.pop.css b/css/structure/jquery.mobile.transition.pop.css index 58ea36cb31f..3eb4e324253 100644 --- a/css/structure/jquery.mobile.transition.pop.css +++ b/css/structure/jquery.mobile.transition.pop.css @@ -1,16 +1,8 @@ .pop { - -webkit-transform-origin: 50% 50%; - -moz-transform-origin: 50% 50%; transform-origin: 50% 50%; } .pop.in { - -webkit-transform: scale(1); - -webkit-animation-name: popin; - -webkit-animation-duration: 350ms; - -moz-transform: scale(1); - -moz-animation-name: popin; - -moz-animation-duration: 350ms; transform: scale(1); animation-name: popin; animation-duration: 350ms; @@ -18,26 +10,16 @@ } .pop.out { - -webkit-animation-name: fadeout; - -webkit-animation-duration: 100ms; - -moz-animation-name: fadeout; - -moz-animation-duration: 100ms; animation-name: fadeout; animation-duration: 100ms; opacity: 0; } .pop.in.reverse { - -webkit-animation-name: fadein; - -moz-animation-name: fadein; animation-name: fadein; } .pop.out.reverse { - -webkit-transform: scale(.8); - -webkit-animation-name: popout; - -moz-transform: scale(.8); - -moz-animation-name: popout; transform: scale(.8); animation-name: popout; } diff --git a/css/structure/jquery.mobile.transition.slide.css b/css/structure/jquery.mobile.transition.slide.css index 2576e625084..e850ca5c9e7 100644 --- a/css/structure/jquery.mobile.transition.slide.css +++ b/css/structure/jquery.mobile.transition.slide.css @@ -2,45 +2,25 @@ @import url("jquery.mobile.transition.slideout.keyframes.css"); .slide.out, .slide.in { - -webkit-animation-timing-function: ease-out; - -webkit-animation-duration: 350ms; - -moz-animation-timing-function: ease-out; - -moz-animation-duration: 350ms; animation-timing-function: ease-out; animation-duration: 350ms; } .slide.out { - -webkit-transform: translate3d(-100%,0,0); - -webkit-animation-name: slideouttoleft; - -moz-transform: translateX(-100%); - -moz-animation-name: slideouttoleft; transform: translateX(-100%); animation-name: slideouttoleft; } .slide.in { - -webkit-transform: translate3d(0,0,0); - -webkit-animation-name: slideinfromright; - -moz-transform: translateX(0); - -moz-animation-name: slideinfromright; transform: translateX(0); animation-name: slideinfromright; } .slide.out.reverse { - -webkit-transform: translate3d(100%,0,0); - -webkit-animation-name: slideouttoright; - -moz-transform: translateX(100%); - -moz-animation-name: slideouttoright; transform: translateX(100%); animation-name: slideouttoright; } .slide.in.reverse { - -webkit-transform: translate3d(0,0,0); - -webkit-animation-name: slideinfromleft; - -moz-transform: translateX(0); - -moz-animation-name: slideinfromleft; transform: translateX(0); animation-name: slideinfromleft; } diff --git a/css/structure/jquery.mobile.transition.slidedown.css b/css/structure/jquery.mobile.transition.slidedown.css index 241adc88fa2..098852aaf2c 100644 --- a/css/structure/jquery.mobile.transition.slidedown.css +++ b/css/structure/jquery.mobile.transition.slidedown.css @@ -1,41 +1,21 @@ /* slide down */ .slidedown.out { - -webkit-animation-name: fadeout; - -webkit-animation-duration: 100ms; - -moz-animation-name: fadeout; - -moz-animation-duration: 100ms; animation-name: fadeout; animation-duration: 100ms; } .slidedown.in { - -webkit-transform: translateY(0); - -webkit-animation-name: slideinfromtop; - -webkit-animation-duration: 250ms; - -moz-transform: translateY(0); - -moz-animation-name: slideinfromtop; - -moz-animation-duration: 250ms; transform: translateY(0); animation-name: slideinfromtop; animation-duration: 250ms; } .slidedown.in.reverse { - -webkit-animation-name: fadein; - -webkit-animation-duration: 150ms; - -moz-animation-name: fadein; - -moz-animation-duration: 150ms; animation-name: fadein; animation-duration: 150ms; } .slidedown.out.reverse { - -webkit-transform: translateY(-100%); - -webkit-animation-name: slideouttotop; - -webkit-animation-duration: 200ms; - -moz-transform: translateY(-100%); - -moz-animation-name: slideouttotop; - -moz-animation-duration: 200ms; transform: translateY(-100%); animation-name: slideouttotop; animation-duration: 200ms; diff --git a/css/structure/jquery.mobile.transition.slidefade.css b/css/structure/jquery.mobile.transition.slidefade.css index 94bb660ce1a..79cdc26b2a3 100644 --- a/css/structure/jquery.mobile.transition.slidefade.css +++ b/css/structure/jquery.mobile.transition.slidefade.css @@ -2,48 +2,24 @@ @import url("jquery.mobile.transition.slideout.keyframes.css"); .slidefade.out { - -webkit-transform: translateX(-100%); - -webkit-animation-name: slideouttoleft; - -webkit-animation-duration: 225ms; - -moz-transform: translateX(-100%); - -moz-animation-name: slideouttoleft; - -moz-animation-duration: 225ms; transform: translateX(-100%); animation-name: slideouttoleft; animation-duration: 225ms; } .slidefade.in { - -webkit-transform: translateX(0); - -webkit-animation-name: fadein; - -webkit-animation-duration: 200ms; - -moz-transform: translateX(0); - -moz-animation-name: fadein; - -moz-animation-duration: 200ms; transform: translateX(0); animation-name: fadein; animation-duration: 200ms; } .slidefade.out.reverse { - -webkit-transform: translateX(100%); - -webkit-animation-name: slideouttoright; - -webkit-animation-duration: 200ms; - -moz-transform: translateX(100%); - -moz-animation-name: slideouttoright; - -moz-animation-duration: 200ms; transform: translateX(100%); animation-name: slideouttoright; animation-duration: 200ms; } .slidefade.in.reverse { - -webkit-transform: translateX(0); - -webkit-animation-name: fadein; - -webkit-animation-duration: 200ms; - -moz-transform: translateX(0); - -moz-animation-name: fadein; - -moz-animation-duration: 200ms; transform: translateX(0); animation-name: fadein; animation-duration: 200ms; diff --git a/css/structure/jquery.mobile.transition.slideup.css b/css/structure/jquery.mobile.transition.slideup.css index 587cf06a89d..831532099d8 100644 --- a/css/structure/jquery.mobile.transition.slideup.css +++ b/css/structure/jquery.mobile.transition.slideup.css @@ -1,41 +1,21 @@ /* slide up */ .slideup.out { - -webkit-animation-name: fadeout; - -webkit-animation-duration: 100ms; - -moz-animation-name: fadeout; - -moz-animation-duration: 100ms; animation-name: fadeout; animation-duration: 100ms; } .slideup.in { - -webkit-transform: translateY(0); - -webkit-animation-name: slideinfrombottom; - -webkit-animation-duration: 250ms; - -moz-transform: translateY(0); - -moz-animation-name: slideinfrombottom; - -moz-animation-duration: 250ms; transform: translateY(0); animation-name: slideinfrombottom; animation-duration: 250ms; } .slideup.in.reverse { - -webkit-animation-name: fadein; - -webkit-animation-duration: 150ms; - -moz-animation-name: fadein; - -moz-animation-duration: 150ms; animation-name: fadein; animation-duration: 150ms; } .slideup.out.reverse { - -webkit-transform: translateY(100%); - -webkit-animation-name: slideouttobottom; - -webkit-animation-duration: 200ms; - -moz-transform: translateY(100%); - -moz-animation-name: slideouttobottom; - -moz-animation-duration: 200ms; transform: translateY(100%); animation-name: slideouttobottom; animation-duration: 200ms; diff --git a/css/structure/jquery.mobile.transition.turn.css b/css/structure/jquery.mobile.transition.turn.css index f3d65f7e2c6..94541cc8a71 100644 --- a/css/structure/jquery.mobile.transition.turn.css +++ b/css/structure/jquery.mobile.transition.turn.css @@ -6,59 +6,32 @@ */ .viewport-turn { - -webkit-perspective: 200px; - -moz-perspective: 200px; - -ms-perspective: 200px; perspective: 200px; position: absolute; } .turn { - -webkit-backface-visibility: hidden; - -webkit-transform: translateX(0); /* Needed to work around an iOS 3.1 bug that causes listview thumbs to disappear when -webkit-visibility:hidden is used. */ - -webkit-transform-origin: 0; - - -moz-backface-visibility: hidden; - -moz-transform: translateX(0); - -moz-transform-origin: 0; - backface-visibility :hidden; transform: translateX(0); transform-origin: 0; } .turn.out { - -webkit-transform: rotateY(-90deg) scale(.9); - -webkit-animation-name: flipouttoleft; - -webkit-animation-duration: 125ms; - -moz-transform: rotateY(-90deg) scale(.9); - -moz-animation-name: flipouttoleft; - -moz-animation-duration: 125ms; transform: rotateY(-90deg) scale(.9); animation-name: flipouttoleft; animation-duration: 125ms; } .turn.in { - -webkit-animation-name: flipintoright; - -webkit-animation-duration: 250ms; - -moz-animation-name: flipintoright; - -moz-animation-duration: 250ms; animation-name: flipintoright; animation-duration: 250ms; } .turn.out.reverse { - -webkit-transform: rotateY(90deg) scale(.9); - -webkit-animation-name: flipouttoright; - -moz-transform: rotateY(90deg) scale(.9); - -moz-animation-name: flipouttoright; transform: rotateY(90deg) scale(.9); animation-name: flipouttoright; } .turn.in.reverse { - -webkit-animation-name: flipintoleft; - -moz-animation-name: flipintoleft; animation-name: flipintoleft; } diff --git a/package.json b/package.json index b84de04b3f0..f8bdcb99b75 100644 --- a/package.json +++ b/package.json @@ -50,6 +50,8 @@ "grunt-html": "7.0.0", "grunt-jscs": "2.8.0", "grunt-php": "1.4.0", + "grunt-postcss": "0.8.0", + "autoprefixer": "6.4.0", "grunt-qunit-junit": "0.1.0-alpha2", "grunt-spider": "0.2.2", "load-grunt-config": "0.16.0",