I am trying to create a component in React in which the component fades from clear to blurry, and the remainder of the component is cut off / hidden without expanding the width of the actual page. I have tried stacking two div's on top of each other using absolute positioning and z-index, but that doesn't solve the issue of hiding the overflow content.
Any ideas?
Example image (StackOverflow won't let me embed): https://i.stack.imgur.com/bl4Ra.png