TIL 01.20

인풋창은 원래 커서 클릭하면 테두리까지 밝게 빛나게 변하는데,
이런 효과를 줄이려면 outline: none 을 해주면 된다.

나는 그냥 이것만 적어주어도 적용이 됐었는데 그 이유는 모르겠다.
확실하게 적용하려면 아래와 같이 써주면 된다.

export const Input = styled.input`
  border: none;
  border-bottom: 1px solid #ccc;
  color: #555;
  box-sizing: border-box;
  font-size: 18px;
  :focus-visible {
    outline: none;
  }
  padding-left: 10px;