Skip to content

Instantly share code, notes, and snippets.

@biyootiful
Last active December 1, 2017 20:29
Show Gist options
  • Save biyootiful/0007f4165630861dca94d5bc01f1960c to your computer and use it in GitHub Desktop.
Save biyootiful/0007f4165630861dca94d5bc01f1960c to your computer and use it in GitHub Desktop.
//from JSON data
const items = JSONdata.items;
const itemRef = items[currentSlideIndex][currentItem];
const colorRef = itemRef.color;
const urlRef = itemRef.url;
//background image
<div style={{ ..., backgroundImage: `url("${urlRef}"), transition: "background 700ms ease-in"}} />
//background screen (transparent layer with color)
<div style={{ ..., background:"linear-gradient(45deg," + colorRef.slice(0, -2) + "0.55) 0%, rgba(0,0,0,0.25) 100%)"}} />
//border color
<div style={{ ..., border: "solid " + colorRef + " 10px"}} />
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment