Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

wrong animation in chrome after update #4

Closed
syscams opened this issue Feb 24, 2018 · 3 comments
Closed

wrong animation in chrome after update #4

syscams opened this issue Feb 24, 2018 · 3 comments

Comments

@syscams
Copy link

syscams commented Feb 24, 2018

there seems to be a bug fix in Chrome regarding the viewBox/transform-origin.
Due this fix the origin for the animation is now wrong.

I solved the problem by adding (without beeing knowledgeable):

transform-box: fill-box;

e.g.

<svg
    version="1.1"
    id="sun"
    class="climacon climacon_sun"
    xmlns="http://www.w3.org/2000/svg"
    xmlns:xlink="http://www.w3.org/1999/xlink"
    x="0px"
    y="0px"
    viewBox="15 15 70 70"
    enable-background="new 15 15 70 70"
    xml:space="preserve">
    <style type="text/css"><![CDATA[

        svg{
            shape-rendering: geometricPrecision
        }

        g, path, circle, rect{
        
            -webkit-transform-origin: 50% 50%;
            -moz-transform-origin: 50% 50%;
            -o-transform-origin: 50% 50%;
			transform-box: fill-box;
            transform-origin: 50% 50%;
...
@Orfait
Copy link

Orfait commented Mar 9, 2018

Same issue for me.
Where did you put the transform-box fix ?

@syscams
Copy link
Author

syscams commented Mar 17, 2018

I added it in all svg's inside the jar in the icons folder (I used 7-zip to open and edit the files)

        -o-transform-origin: 50% 50%;
--->		transform-box: fill-box;
        transform-origin: 50% 50%;

@dmcwhinnie
Copy link
Contributor

dmcwhinnie commented Mar 18, 2018

I created a pull request with the changes

#5

@ghys ghys closed this as completed in f89757a May 14, 2018
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

No branches or pull requests

3 participants