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

28 lines
580 B
TypeScript

import styled from '@emotion/styled';
const Input = styled.input(({ theme }) => ({
width: '100%',
color: theme.colors.font,
backgroundColor: theme.colors.secondary,
padding: '0.75em',
border: `1px solid ${theme.colors.lightGrey}`,
borderBottom: `2px solid ${theme.colors.lightGrey}`,
borderRadius: theme.border.radius,
transition: theme.transition.delay,
'&:focus': {
borderBottom: `2px solid ${theme.colors.primary}`,
},
'&:disabled': {
opacity: 0.85,
},
'&::placeholder': {
fontStyle: 'italic',
color: theme.colors.grey,
},
}));
export default Input;