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

22 lines
632 B
TypeScript

import styled from '@emotion/styled';
import TransitionLayout from '~/components/layouts/_transition_layout';
const DropdownContainer = styled(TransitionLayout)<{ show: boolean }>(
({ show, theme }) => ({
zIndex: 99,
position: 'absolute',
top: 'calc(100% + 0.5em)',
right: 0,
minWidth: '175px',
backgroundColor: show ? theme.colors.secondary : theme.colors.background,
border: `2px solid ${theme.colors.secondary}`,
borderRadius: theme.border.radius,
boxShadow: theme.colors.boxShadow,
display: show ? 'flex' : 'none',
flexDirection: 'column',
overflow: 'hidden',
})
);
export default DropdownContainer;