Address Safari bug on rendering of box-shadow

TurkServer / meteor-tutorials

Create super cool animated tutorials for your Meteor app.

MIT License

103 stars 21 forks source link

Address Safari bug on rendering of box-shadow #19

Open enfascination opened 7 years ago

enfascination commented 7 years ago

This change fixes Issue #16 (at least for me)

mizzao commented 7 years ago

Hey @enfascination, I've been a little too busy to review all pull requests lately, so I gave you commit access to make any changes you'd like. It would be nice to follow the style used by the rest of the code and make sure you test this in different browsers using the demo app, just to make sure everything works as before.

If you give me your Meteor developer username, I can give you permission to publish a new version of this package as well. Thanks!

mizzao commented 7 years ago

@enfascination BTW: would love to talk to you about experimenting with societies and governance sometime. I was discussing this with @ejolly and he mentioned you gave him the idea. I am planning for how we might run these experiments via multiplayer games: https://www.scienceathome.org/community/blog/new-collaborator-andrew-mao/

enfascination commented 7 years ago

Thanks Andrew. Testing my fix on other browsers I found that fixing this for Safari breaks it for Firefox. Because neither Safari or Firefox has webkit/moz prefixed versions of box-shadow, this problem can't be fixed (without getting rid of border-radius on the inset tutorial box).

mizzao commented 7 years ago

A few ideas:

What if you use Stylus or Sass mixins to generate the right CSS instead of having to prefix it yourself? (could just use the Meteor package.)
Feel free to just kill the border radius if you'd like if it fixes the shadow on all browsers
Alternatively, feel free to try anything else if it achieves the same effect