Files
my-links/inertia/components/visibilty/visibilty.tsx
2024-10-07 01:33:59 +02:00

32 lines
697 B
TypeScript

import { Visibility } from '#enums/visibility';
import styled from '@emotion/styled';
import { IoEarthOutline } from 'react-icons/io5';
const VisibilityStyle = styled.span(({ theme }) => ({
userSelect: 'none',
fontWeight: 300,
fontSize: '0.6em',
color: theme.colors.primary,
border: `1px solid ${theme.colors.primary}`,
borderRadius: '50px',
padding: '0.15em 0.65em',
display: 'flex',
gap: '0.35em',
alignItems: 'center',
}));
const VisibilityBadge = ({
label,
visibility,
}: {
label: string;
visibility: Visibility;
}) =>
visibility === Visibility.PUBLIC && (
<VisibilityStyle>
{label} <IoEarthOutline size="1em" />
</VisibilityStyle>
);
export default VisibilityBadge;