30 lines
775 B
TypeScript
30 lines
775 B
TypeScript
import styled from "styled-components"
|
|
|
|
export default styled.input`
|
|
width: 100%;
|
|
border-radius: 100px; /* arbitrarily large value */
|
|
height: 2.5rem;
|
|
text-align: center;
|
|
font-size: 1.2rem;
|
|
outline: none;
|
|
color: ${({ theme }) => theme.theme.color.text.default};
|
|
border: 1px solid
|
|
${(props) => props.theme.theme.component.input.color.border.default};
|
|
background-color: ${(props) =>
|
|
props.theme.theme.component.input.color.background.default};
|
|
|
|
::placeholder {
|
|
color: ${(props) => props.theme.theme.component.input.color.placeHolder};
|
|
opacity: 1;
|
|
}
|
|
|
|
&:hover {
|
|
border: 1px solid
|
|
${({ theme }) => theme.theme.component.input.color.border.hover};
|
|
}
|
|
|
|
&:focus {
|
|
border: 1px solid
|
|
${({ theme }) => theme.theme.component.input.color.border.focus};
|
|
}
|
|
`
|