iteration variable `i` leaked into background image url. #74

Open
asuth opened this Issue Feb 29, 2012 · 4 comments

Comments

Projects
None yet
4 participants

asuth commented Feb 29, 2012

When I use a file path that includes /i/, nib replaces that /i/ with /0/ in the vendor-prefixed gradients.

a
    background-image url(/i/providence/plus.png) linear-gradient(top, rgba(0,0,0,0.25), rgba(0,0,0,0.07))

produces

a {
  background-image: url("/0/providence/plus.png") -webkit-gradient(linear, left top, left bottom, color-stop(0, rgba(0,0,0,0.25)), color-stop(1, rgba(0,0,0,0.07)));
  background-image: url("/0/providence/plus.png") -webkit-linear-gradient(top, rgba(0,0,0,0.25) 0%, rgba(0,0,0,0.07) 100%);
  background-image: url("/0/providence/plus.png") -moz-linear-gradient(top, rgba(0,0,0,0.25) 0%, rgba(0,0,0,0.07) 100%);
  background-image: url("/i/providence/plus.png") linear-gradient(top, rgba(0,0,0,0.25) 0%, rgba(0,0,0,0.07) 100%);
}
Contributor

kizu commented Apr 14, 2012

There are two workarounds for this:

  1. Enclose the url in quotes, like url('/i/providence/plus.png').
  2. Escape the i, like url(/\i/providence/plus.png).

In those cases the i won't be replaced.

asuth commented Apr 16, 2012

hm, fair enough, but should be fixed!

Just met this bug. I enclosed the URL in quotes to avoid it, but I would prefer to use the simpler and valid CSS syntax with no quotes.

Owner

tj commented Aug 29, 2012

blah yeah that is no good, we need to get on mandatory $ var prefixes. CSS url() syntax is a disaster, why they didn't force quotes is beyond me but it's extremely lame

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment