You should also add the standard CSS rule to each if statement. If you
don't do so your CSS is brittle as you never know when vendor prefixed CSS
rules are removed from the corresponding browser.
So always do
@if is("browser.engine", "webkit") {
-webkit-transform: translate(-40%, 0);
-webkit-transition: *-webkit-transform* 1s, opacity 2s;
transform: translate(-40%, 0);
transition: transform 1s, opacity 2s;
}
Also note the bold text as that seems to be wrong throughout your example.
When you use vendor prefixed transform then you should also transition that
vendor prefixed transform property.
But honestly I would just remove all the @if's because gzip compression
would be good enough for me until GWT decides to remove vendor prefixed css
rules that do not match the user.agent property (contributions welcome I
would guess). So I would just create
@defmixin slideIn(X) {
-webkit-transition: -webkit-transform 1s, opacity 2s;
-moz-transition: -moz-transform 1s, opacity 2s;
-ms-transition: -ms-transform 1s, opacity 2s;
-o-transition: -o-transform 1s, opacity 2s;
transition: transform 1s, opacity 2s;
-webkit-transform: translate(X, 0);
-moz-transform: translate(X, 0);
-ms-transform: translate(X, 0);
-o-transform: translate(X, 0);
transform: translate(X, 0);
}
-- J.
--
You received this message because you are subscribed to the Google Groups
"Google Web Toolkit" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To post to this group, send email to [email protected].
Visit this group at http://groups.google.com/group/google-web-toolkit.
For more options, visit https://groups.google.com/d/optout.
