LinkedInAttic / hopscotch

A framework to make it easy for developers to add product tours to their pages.
Apache License 2.0
4.2k stars 666 forks source link

sprite-green and sprite-orange don't work #374

Open PsychoIndigo opened 5 years ago

PsychoIndigo commented 5 years ago

hopscotch pulls the images from hopscotch.min.css

link rel="dns-prefetch" href="https://github.githubassets.com" link rel="dns-prefetch" href="https://avatars0.githubusercontent.com" link rel="dns-prefetch" href="https://avatars1.githubusercontent.com" link rel="dns-prefetch" href="https://avatars2.githubusercontent.com" link rel="dns-prefetch" href="https://avatars3.githubusercontent.com" link rel="dns-prefetch" href="https://github-cloud.s3.amazonaws.com" link rel="dns-prefetch" href="https://user-images.githubusercontent.com/

and from here:

.hopscotch-bubble-close{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:0;color:#000;background:transparent url(../img/sprite-green.png) -192px -92px no-repeat;display:block;padding:8px;position:absolute;text-decoration:none;text-indent:-9999px;width:8px;height:8px;top:0;right:0}div.hopscotch-bubble .hopscotch-bubble-close.hide,div.hopscotch-bubble .hopscotch-bubble-close.hide-all{display:none}div.hopscotch-bubble .hopscotch-bubble-number{background:transparent url(../img/sprite-green.png)

edwinbbu commented 5 years ago

Same issue for me

PsychoIndigo commented 5 years ago

I figured it out. You need to manually download the images from github and attach them to the images folder if your project.

If you need to you might have to do a little css to line things up properly.