diff --git a/packages/streamwall/src/renderer/overlay.tsx b/packages/streamwall/src/renderer/overlay.tsx index f7770ef..e33a290 100644 --- a/packages/streamwall/src/renderer/overlay.tsx +++ b/packages/streamwall/src/renderer/overlay.tsx @@ -75,7 +75,7 @@ function Overlay({ activeColor={activeColor} isListening={isListening} > - + {hasTitle && ( ` visibility: ${({ isVisible }) => (isVisible ? 'visible' : 'hidden')}; ` -const BlurCover = styled.div` +const FilterCover = styled.div` position: absolute; left: 0; right: 0; top: 0; bottom: 0; - backdrop-filter: ${({ isBlurred }) => (isBlurred ? 'blur(30px)' : 'blur(0)')}; + backdrop-filter: ${({ isBlurred, isDesaturated }) => + [isBlurred ? 'blur(30px)' : '', isDesaturated ? 'grayscale(75%)' : ''].join( + ' ', + )}; ` const VersionText = styled.div`