bigbuffet-rw/app/soapbox/features/ui/components/background_shapes.tsx
Justin 20209c81ab Improve visuals with branding
Co-authored-by: Alex Gleason <alex@alexgleason.me>
2022-08-01 14:40:07 -04:00

16 lines
608 B
TypeScript

import classNames from 'classnames';
import React from 'react';
interface IBackgroundShapes {
/** Whether the shapes should be absolute positioned or fixed. */
position?: 'fixed' | 'absolute',
}
/** Gradient that appears in the background of the UI. */
const BackgroundShapes: React.FC<IBackgroundShapes> = ({ position = 'fixed' }) => (
<div className={classNames(position, 'top-0 inset-x-0 flex justify-center overflow-hidden pointer-events-none')}>
<div className='w-screen h-screen bg-gradient-sm lg:bg-gradient-light lg:dark:bg-gradient-dark' />
</div>
);
export default BackgroundShapes;