background property does not support linear-gradient anymore
See original GitHub issueThe background property for <Box> no longer supports css gradients as strings
Expected Behavior
In previous versions it has worked, i rolled back to 2.10.0 and I get my gradients back, but in 2.15.2 they have stopped working. It seems 2.13 was the last working version for this (see code pen link)
Actual Behavior
URL, screen shot, or Codepen exhibiting the issue
Try rolling back to 2.13 or older, gradient comes back.
https://codesandbox.io/s/thirsty-elgamal-8n0md?file=/src/App.js
Steps to Reproduce
add this background property to Box component
background="linear-gradient(rgba(0,0,0,1), rgba(34,26,62,1))"
Your Environment
- Grommet version: 2.15.2
- Browser Name and version: Chrome
- Operating System and version (desktop or mobile): desktop, windows
Issue Analytics
- State:
- Created 3 years ago
- Comments:5 (2 by maintainers)
Top Results From Across the Web
Background Gradient property is not working - Stack Overflow
Here your are facing two issues. First you have to consider that by making the .parent element absolute position, you remove it from...
Read more >linear-gradient() - CSS: Cascading Style Sheets | MDN
The linear-gradient() CSS function creates an image consisting of a progressive transition between two or more colors along a straight line.
Read more >CSS Gradients
Gradients are background-image While declaring the a solid color uses background-color property in CSS, gradients use background-image . This ...
Read more >What no one told you about CSS Variables
An important rule is to always consider CSS variables (custom properties) as ordinary properties and not only variables that store values.
Read more >Problem with Linear Gradient in Safari - HTML & CSS - SitePoint
in Safari when i inspect the element, the “background-image” line has a warning icon by it but doesn't tell me what's going on...
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
Hi -
I was literally just about to say that after upgrading to 2.16.0 it appears fixed…
Sorry!
@fuzing are you using grommet v2.16.0? The problem is supposed to be solved on this release. Please send us reproducible code in case it doesn’t.