1

I want to use FancyBox in my project and have run bower install fancyBox#master --save and all gets added fine, however when running gulp the url() paths in CSS are not rewritten. The images however are copied into the correct folder (./images)

There is a very similar app that we use (jquery.chosen) that has a very similar set-up, with a flat folder structure and matching CSS, but it works fine here.

I'm not particularly experienced with Gulp, and can't figure out what the cause here would be.

We are running the WordPress theme Sage by Roots as a base.

I have created a Gist of the files: https://gist.github.com/rkorebrits/099729078bc9eea5a33427a61d0cadd9

#fancybox-loading, .fancybox-close, .fancybox-prev span, .fancybox-next span {
    background-image: url(fancybox_sprite.png);
}

.chosen-container-single .chosen-single div b {
    background: url(../images/chosen-sprite.png) no-repeat 0 11px; 
}

Could this be an issue specific to FancyBox or is this an issue with the set-up?

Richard
  • 4,341
  • 5
  • 35
  • 55

1 Answers1

0

Following above I had to rewrite the URLs as so within jquery.fancybox.css

anywhere background: or background-image is set, change to.

../images/fancybox_overlay.png

This works on Sage 8

ste
  • 351
  • 1
  • 3
  • 11