Skip to content

keyframes better support older iOS (8.x) webkit - #720

Merged
kitten merged 2 commits into
styled-components:masterfrom
tyfoo:keyframes-webkit
Apr 20, 2017
Merged

keyframes better support older iOS (8.x) webkit#720
kitten merged 2 commits into
styled-components:masterfrom
tyfoo:keyframes-webkit

Conversation

@tyfoo

@tyfoo tyfoo commented Apr 20, 2017

Copy link
Copy Markdown
Contributor

When using styled-components in one of our projects we noticed that on older iOS devices (8.x, iPhone 6 and 6 Plus) animations didn't work.

After some investigation we've found http://stackoverflow.com/questions/9211261/css3-animation-not-working-in-safari and after some experimentation, the solution suggested in http://stackoverflow.com/a/34013139 worked.

This PR adds changes keyframes to generate both @keyframes {name} and @-webkit-keyframes {name}.

@mxstbr-bot

mxstbr-bot commented Apr 20, 2017

Copy link
Copy Markdown
Warnings
⚠️ There are library changes, but not tests. That's OK as long as you're refactoring existing code

Generated by 🚫 dangerJS

@tyfoo
tyfoo force-pushed the keyframes-webkit branch from f583532 to 7c5e97b Compare April 20, 2017 15:30
@kitten

kitten commented Apr 20, 2017

Copy link
Copy Markdown
Member

LGTM 🚢 Please note, that this is is already working in v2, since we've switched to stylis, which does vendor @Keyframes for us

@kitten
kitten merged commit 60ef73e into styled-components:master Apr 20, 2017
@jesnil01

Copy link
Copy Markdown

👍 Thanks for this!

This is not only present on IOS devices but older webkit browsers on desktop as well.

Looking forward for this in a future version!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

4 participants