search

stitchesjs / stitches

[Not Actively Maintained] CSS-in-JS with near-zero runtime, SSR, multi-variant support, and a best-in-class developer experience.
https://stitches.dev
MIT License
7.76k stars 254 forks source link

toTokenizedValue() should not be executed on properties with url values. #986

Open gabifromkorea opened 2 years ago

gabifromkorea commented 2 years ago

Bug report

Describe the bug

if url includes double hyphen(--) it tokenized to css vars

styled('div', {
  background: 'url("https://deploy-preview-2--instutible-bermi-d4ce5b.netlify.app/assets/blockchain_panel.56a9eae4.png")',
  ....
})
=> 
'background' property removed by stitches to prevent wrong value

To Reproduce

Avoid removing property from stitches using duplicate quotes

styled('div', {
  background: 'url(""https://deploy-preview-2--instutible-bermi-d4ce5b.netlify.app/assets/blockchain_panel.56a9eae4.png")',
  ....
})
=> 
in css {
   background: url(""https://deploy-previewcalc(var(--instutible-bermi-d4ce5b)*-2).netlify.app/assets/blockchain_panel0.56a9eae4.png")""
}
sarahhling commented 2 years ago

hello, I would like to work on this issue, thanks.

hadihallak commented 2 years ago

Reopening as the merged solution was reverted in https://github.com/stitchesjs/stitches/pull/1107