const Container = styled(Select)`
width: 100%;
padding: 10px 12px;
font-size: 16px;
border-radius: 6px;
transition: border-color 0.3s ease, box-shadow 0.3s ease;
background-color: white;
& .MuiSelect-select {
padding: 0px;
}
& input {
border: 0px;
}
& fieldset {
border: 1px solid #ccc;
}
&:hover fieldset {
border-color: #ccc !important;
}
/* Select가 선택(포커스) 되었을 때 */
&.Mui-focused fieldset {
border-color: #007bff !important;
border-width: 1px !important; /* ✅ 두께를 고정 */
}
`;
'라이브러리 > MUI' 카테고리의 다른 글
[MUI] MUI 컴포넌트 styled-component로 기존 스타일 덮기 (0) | 2024.12.22 |
---|---|
[MUI] <Typography /> 두줄만 보이게 하기, 두줄 이후로는 ... 으로 표시하기 (0) | 2024.12.22 |