Linear-gradient not working when css minified (and workaround)

Bug Reports
1

I have been working on a site with a linear-gradient background using the following css:

#grad {
  background-image: linear-gradient( 95deg, hsl(20deg 5% 88%) 0%, hsl(0deg 4% 91%) 20%, hsl(30deg 5% 93%) 29%, hsl(0deg 4% 95%) 36%, hsl(0deg 0% 97%) 43%, hsl(0deg 0% 99%) 50%, hsl(0deg 4% 95%) 57%, hsl(30deg 5% 91%) 64%, hsl(20deg 5% 88%) 71%, hsl(30deg 7% 84%) 80%, hsl(27deg 9% 80%) 100% );
}

This works fine in the preview, but when I went to publish it to the bss server, it doesn’t show.

A bit of experimenting with exports and it seem that it ‘breaks’ when exported with css minified.

The work-around it to put the exact same code in a scss file in bss and then it works.

1 Like
2

Thank you for the report! It appears that the CSS minifier which we use turns 0% to 0 in HSL values which is incorrect. We will fix this in our next update.

3 Likes