Commit graph

407 commits

Author SHA1 Message Date
toddparker
7dcce519f7 First cut at making pop work for non-3D browsers. Still rough, but works.
I had to create a new set of basic keyframes for non-3D because we had
opacity baked into our keyframes. As an upside, I could tweak the scale
factor differently between Android (0 > 1) and 3D (0.8 > 1).
2012-01-13 17:27:52 +07:00
toddparker
33b8cb67e0 Slide transition improvements
- Switched from opacity to outline for nofade
- Re-vamped the non-3D slides to eliminate blinking
2012-01-13 17:27:52 +07:00
toddparker
c152cc16d9 A few more slide tweaks, still blinky or skips frames in unpredictable ways 2012-01-13 17:27:52 +07:00
toddparker
0675e15233 Added "nofade" transition, slide/up/down for non-3D devices
- Introduced a class (nofade) which is similar to dontmove for
overwriting the fade in/out classes. We're not scoping all classes to
with supported or not like in flip so we need to negate the fade rules
with a new animation
- Added a selector block at the top to lengthen all slide animations to
300ms to reduce blinkiness on Android. Shorter caused animations to
break out of sequence. Needs refinement on timing.
- Added rules to apply the "nofade" classes to the replace the fade
in/out animations for non-3D browsers. Had to set the duration equal to
the slide animations to keep it all in sync.
2012-01-13 17:27:52 +07:00
toddparker
7e9203bcfe Re-org file, scoped all flip rules to the 3d supported class to avoid android seeing these
Cleaned up unsupported rules, added to top of file - needed both fade
in and out rules
2012-01-13 17:27:52 +07:00
scottjehl
af7a8355dc added a rotate transition, just for fun. 2012-01-13 17:27:52 +07:00
scottjehl
d6a44fcce9 flipped the default timing for in and out - they were backwards 2012-01-13 17:27:52 +07:00
scottjehl
43f113dd78 removed old comment 2012-01-13 17:27:51 +07:00
scottjehl
73ea93df11 removed flip in rules, no longer in use 2012-01-13 17:27:51 +07:00
scottjehl
5d3468b5cd cleaned these up so only the right rules are in the right files 2012-01-13 17:27:51 +07:00
scottjehl
dcd1fef137 whitespace 2012-01-13 17:27:51 +07:00
scottjehl
5776196fea moved ui-viewport-transitioning rules into here 2012-01-13 17:27:51 +07:00
scottjehl
a1b2d9433e updated comment to credit jqTouch for original transitions ideas, though these are now quite different 2012-01-13 17:27:51 +07:00
scottjehl
bdcaa0ab23 missed slide in the new transitions file split out 2012-01-13 17:27:51 +07:00
scottjehl
5a4f16d08a split transition CSS into separate files. 2012-01-13 17:27:51 +07:00
scottjehl
296b739521 tweaked scale and duration of some flip and pop transitions 2012-01-13 17:27:51 +07:00
scottjehl
a6b23b15be dontmove is no longer in use 2012-01-13 17:27:50 +07:00
scottjehl
76664aebc1 not needed, as flip already uses fade now in the "in" transition. 2012-01-13 17:27:50 +07:00
scottjehl
c2733fc8e7 for non-3d browsers, use fade instead of flip 2012-01-13 17:27:50 +07:00
toddparker
d231dd71cc Updated -moz out to match 2012-01-13 17:27:50 +07:00
toddparker
d39fb83ec4 Broke out the global and in and out transition rules for asymmetric timing
Also added duplicate buttons at the booth to test scroll position
smoothness.
2012-01-13 17:27:50 +07:00
scottjehl
920738c8b9 rolled that last one back. 2012-01-13 17:27:50 +07:00
scottjehl
dbddd9dbb6 a little faster on the fades. needs cleanup later 2012-01-13 17:27:50 +07:00
scottjehl
1532f509c6 removed spin because we aren't using it no mo 2012-01-13 17:27:50 +07:00
scottjehl
b6145b5a1a updated the slide and flip handlers to use combo fade/slide/flip transitions 2012-01-13 17:27:49 +07:00
scottjehl
1e7e65a6b8 fixed up the pop out transition for outin handler 2012-01-13 17:27:49 +07:00
scottjehl
554ef6da53 removed unused image 2012-01-13 17:27:49 +07:00
Todd Parker
0327298ca1 Loader design tweaks
Removed the spin class from the loader container, tweaked opacity and
added slight glow to bottom of loader, increased padding. Downloaded a
fresh loader image.
2012-01-13 17:27:49 +07:00
Todd Parker
8221c3e98e Add -moz prefixes for initial cut at Firefox transition support 2012-01-13 17:27:48 +07:00
Todd Parker
df64a22e3e Shorter fade out (150ms) and fade in (300ms) for speedier transitions. 2012-01-13 17:27:48 +07:00
Todd Parker
ff618ff5e1 Faster spinner animation
Was 4ms per frame, now 3ms.
2012-01-13 17:27:48 +07:00
scottjehl
cde86da912 position loader fixed by default, then check if it's positioned correctly and if not, switch to an absolute positioned scheme, with updates on scroll (or scrollstop in iOS 4). 2012-01-13 17:27:03 +07:00
Todd Parker
ad2f977ca8 All new loader hotness
Created a new loader that has a circle baked into the animated gif so
there's less of a chance of artifacts in bad browsers. The edge is
chunky because it's a gif but then added 1px of padding to the loader
parent and that the border-radius can smooth this out in iOS. Actually
looks sharp in Android too because of interaction effects between these
rounded corners. Loader spin is faster and more compressed (16 colors).
Removed the body-a class on the spinner since we're just setting this to
flat black = one less gradient to render.
2012-01-13 17:27:02 +07:00
scottjehl
1e6e411278 removed unused image 2012-01-13 17:27:02 +07:00
Todd Parker
609397dda4 More loader tweaks 2012-01-13 17:27:02 +07:00
Todd Parker
7c160b77af Loader design tweaks
Removed the spin class from the loader container, tweaked opacity and
added slight glow to bottom of loader, increased padding. Downloaded a
fresh loader image.
2012-01-13 17:27:02 +07:00
scottjehl
fe5ef1aea9 gif loader style updates 2012-01-13 17:27:02 +07:00
scottjehl
88914e01a4 gif loader styles 2012-01-13 17:27:01 +07:00
scottjehl
f50e029bac hard-set opacity for "out" to prevent blinks 2012-01-13 17:27:01 +07:00
scottjehl
1a78cc86c3 gif-based loader animation 2012-01-13 17:27:01 +07:00
Mat Marquis
00b7c85b4f Applied top margin to dialog headers rather than .ui-dialog, as the latter was breaking content-only dialogs meant to align with the top of the viewport. 2012-01-13 17:25:52 +07:00
Mat Marquis
20b0434207 Moved .ui-dialog to element wrapping dialog header/content/footer, switched overlay non-theming class to .ui-dialog-page. 2012-01-13 17:25:52 +07:00
Mat Marquis
eb9968c2b6 Partial dialog refactor, in progress. 2012-01-13 17:25:52 +07:00
Frederik Lassen
de5ca04a74 Optimized the images even more. (Using ScriptPNG) 2012-01-13 17:25:51 +07:00
zachleat
e19ee8d953 Fix for browsers with JavaScript but without box-shadow enabled. outline: 0; outline-width: 2px; doesn't work, requires an outline-style to be set. 2012-01-13 17:25:50 +07:00
zachleat
3ca5a8a85e Per @toddparker's comment, added boxshadow to link buttons. Also changed focus class on sliders to add to the handle, while excluding the toggle switch. 2012-01-13 17:25:50 +07:00
zachleat
5cc81797ba First stab at more consistent focus classes on form elements, using .ui-focus. Links will still contain outline property. 2012-01-13 17:25:50 +07:00
Garann Means
0201319c74 Corrected fix for #3262 so it doesn't prevent buttons filling available space 2012-01-13 17:25:49 +07:00
Garann Means
226384d872 Fix for #3262 - set max-width for header/footer buttons and title
Text-overflow: ellipsis already set.
2012-01-13 17:25:48 +07:00
Tyler Benziger
fd6b776447 gradient syntax fix 2012-01-13 17:25:47 +07:00
Tyler Benziger
8520cc015c gradient syntax fix 2012-01-13 17:25:47 +07:00
Jake Boone
bd1fa8a67f Use shorthand notation for margin 2012-01-13 17:25:45 +07:00
Tyler Benziger
09c0b6214b Gradient syntax fixed 2012-01-13 17:25:45 +07:00
toddparker
f0744317c0 More tweaks to the sliders to fit well at 320px 2012-01-13 17:25:45 +07:00
toddparker
0c0d7e4e6d Tweaked slider to be a bit wider
Checked to ensure this fits in inset lists
2012-01-13 17:24:55 +07:00
toddparker
ba1a6f74a9 Tightened up vertical spacing for form field containers at smartphone widths
There was more spacing between elements than needed, this cleans it up.
2012-01-13 17:24:55 +07:00
toddparker
201d3062be Tweaked fieldset border rules so field contains work with this element. Fixes #2448 2012-01-13 17:24:55 +07:00
Ghislain Seguin
49a42f376c Added @import to replace index.php 2012-01-13 17:20:24 +07:00
Ghislain Seguin
ad1653c7f4 Use @imports instead of the PHP combine, r.js will take care of optimization 2012-01-13 17:20:24 +07:00
Ghislain Seguin
7e7b1b63f1 Finished merging branch 'out-in-transition', I had trailing commas in there instead of semi-colons 2012-01-12 10:09:25 -08:00
Ghislain Seguin
9e935c31f6 Merge branch 'out-in-transition'
Conflicts:
	css/structure/index.php
	docs/_assets/js/jqm-docs.js
	index.html
2012-01-12 09:56:48 -08:00
scottjehl
a83727e4be combined redundant syntax 2012-01-12 21:41:54 +07:00
scottjehl
2cd994b2e8 added the timing durations to the transitions themselves 2012-01-12 21:41:39 +07:00
scottjehl
32350a813a fixed some typos where webkit needed to be moz 2012-01-12 21:38:25 +07:00
scottjehl
70670bc344 fix up dialog presentation - headers were busted 2012-01-12 21:26:41 +07:00
scottjehl
6cd1adc528 no bg image/gradient on ui-overlay 2012-01-12 21:26:27 +07:00
scottjehl
155adc14c1 CSS for ui-overlay-x applies to container now too - removed double class 2012-01-12 12:27:14 +07:00
Mat Marquis
6db136ff12 Merge branch 'out-in-transition' of github.com:jquery/jquery-mobile into out-in-transition 2012-01-11 18:04:17 -05:00
Mat Marquis
f7d59da646 Updated 3d transform test to accomodate FF10. 2012-01-11 16:28:08 -05:00
scottjehl
e4d7ff92e8 special case for dialogs - the theme class will apply to the page container when a dialog is shown, and that class will be removed when the dialog is hidden. This allows the transition to appear to affect only the inset window portion of the dialog page. 2012-01-11 10:01:47 +07:00
Ghislain Seguin
d47b6ba6c9 Removed as this is done through @import statements now 2012-01-10 14:34:59 -08:00
Ghislain Seguin
19bcd5a250 Have index.php serve the right file, this is deprecated and should be removed before 1.1 release 2012-01-10 14:32:48 -08:00
Ghislain Seguin
ee1d1f2670 Ported 148cb09132 to valencia theme 2012-01-10 14:31:27 -08:00
Mat Marquis
148cb09132 Updated docs’ CSS to use new @import scheme. 2012-01-10 16:35:51 -05:00
Mat Marquis
bac53cf151 Single CSS concat file using @import, rather than the PHP concat. 2012-01-10 16:35:50 -05:00
Mat Marquis
1f5449e552 Added page turning transition. 2012-01-10 14:10:45 -05:00
toddparker
3da8b6e245 Whitespace 2012-01-10 10:31:36 -05:00
toddparker
fab717a459 Added in drop shadow on pages in "flow" transition, adjusted timing to be longer 2012-01-10 10:29:04 -05:00
scottjehl
75d0d95bea pulled out the 3D madness 2012-01-10 12:51:27 +07:00
scottjehl
a7e15820d8 changed up the timing and origin 2012-01-10 12:51:05 +07:00
scottjehl
8f5e263bd8 added an experimental 3D transition, "flow" 2012-01-10 12:51:05 +07:00
scottjehl
ffa23bc137 removed rotate transition from concat files and docs 2012-01-10 12:50:53 +07:00
scottjehl
fd700aaa15 removed the experimental rotate transition 2012-01-10 12:50:33 +07:00
scottjehl
40d9fa978a split the slide transitions into 3 files for slide, slidedown, and slideup 2012-01-10 12:50:33 +07:00
scottjehl
86e9c9df68 removed fallback transition CSS for non-3D browsers 2012-01-10 12:50:22 +07:00
scottjehl
3271066c97 updated the rotate transition to move the page out of view 2012-01-10 12:50:22 +07:00
scottjehl
22162fd5e7 removed z-index rules, no longer needed 2012-01-10 12:50:21 +07:00
scottjehl
11848a6829 z index not needed 2012-01-10 12:50:21 +07:00
scottjehl
f6ec2436b7 brought back a full flip transition for 3d supporting browsers, using 90deg pairs. Needs further testing 2012-01-10 12:50:21 +07:00
scottjehl
7341d7c9d0 whitespace 2012-01-10 12:50:21 +07:00
scottjehl
7be58bc085 removed or moved opacity rules for simpler cascade 2012-01-10 12:50:21 +07:00
scottjehl
9d2f96fc91 removed z-index rules, as pages no longer overlap in transitions 2012-01-10 12:50:21 +07:00
toddparker
74a8f2c2c3 Moved non-3D rules to the bottom to hide the ugliness
Rule order doesn't seem to matter because of specificity.
2012-01-10 12:50:21 +07:00
toddparker
6ddc8c0e9d First cut at making pop work for non-3D browsers. Still rough, but works.
I had to create a new set of basic keyframes for non-3D because we had
opacity baked into our keyframes. As an upside, I could tweak the scale
factor differently between Android (0 > 1) and 3D (0.8 > 1).
2012-01-10 12:50:21 +07:00
toddparker
4d5e2ec437 Slide transition improvements
- Switched from opacity to outline for nofade
- Re-vamped the non-3D slides to eliminate blinking
2012-01-10 12:50:21 +07:00
toddparker
9531ff46f8 A few more slide tweaks, still blinky or skips frames in unpredictable ways 2012-01-10 12:50:20 +07:00
toddparker
0edc6271a5 Added "nofade" transition, slide/up/down for non-3D devices
- Introduced a class (nofade) which is similar to dontmove for
overwriting the fade in/out classes. We're not scoping all classes to
with supported or not like in flip so we need to negate the fade rules
with a new animation
- Added a selector block at the top to lengthen all slide animations to
300ms to reduce blinkiness on Android. Shorter caused animations to
break out of sequence. Needs refinement on timing.
- Added rules to apply the "nofade" classes to the replace the fade
in/out animations for non-3D browsers. Had to set the duration equal to
the slide animations to keep it all in sync.
2012-01-10 12:50:20 +07:00
toddparker
373abd7623 Re-org file, scoped all flip rules to the 3d supported class to avoid android seeing these
Cleaned up unsupported rules, added to top of file - needed both fade
in and out rules
2012-01-10 12:50:20 +07:00
scottjehl
13cdc5d7c4 added a rotate transition, just for fun. 2012-01-10 12:50:20 +07:00
scottjehl
bce5a5a33d flipped the default timing for in and out - they were backwards 2012-01-10 12:50:06 +07:00