search

streamich / nano-css

Distilled CSS-in-JS for gourmet developers
The Unlicense
430 stars 24 forks source link

"important" addon adds "!important" in the middle of a data url #203

Open TheBosZ opened 6 years ago

TheBosZ commented 6 years ago

Because it's just looking for a semicolon, it's inserting an "!important" in the middle of this url:

{
  'background-image': 'url("data:image/svg+xml;utf8,%3Csvg xmlns=\'http://www.w3.org/2000/svg\' xmlns:xlink=\'http://www.w3.org/1999/xlink\' width=\'48\' height=\'36\' viewBox=\'0 0 48 36\' fill=\'rgb(28,28,28)\'%3E%3Crect x=\'16\' y=\'12\' width=\'16\' height=\'2\' /%3E%3Crect x=\'16\' y=\'17\' width=\'16\' height=\'2\' /%3E%3Crect x=\'16\' y=\'22\' width=\'16\' height=\'2\' /%3E%3C/svg>")',
}

Result:

background-image:url("data:image/svg+xml !important;utf8,%3-csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='48' height='36' viewBox='0 0 48 36' fill='rgb(28,28,28)'%3E%3Crect x='16' y='12' width='16' height='2' /%3E%3Crect x='16' y='17' width='16' height='2' /%3E%3Crect x='16' y='22' width='16' height='2' /%3E%3C/svg>") !important;

Note that the part xml;utf8, got converted to xml !important;utf8