Styled-component 스크롤바 디자인

스타일컴포넌트에서 스크롤바 안보이게 하기

스크롤은 작동되지만 안보이게 하고 싶다면!

 &::-webkit-scrollbar {
    display: none;
  }

MDN 공식 사이트에 따르면 모든 사용자에게 나오는것이 아니라고합니다!
구현 간에 비호환성이 있을 수도 있다.

CSS 스크롤바 선택기

::-webkit-scrollbar : 전체 스크롤바.

::-webkit-scrollbar-button : 스크롤 막대의 버튼

::-webkit-scrollbar-thumb : 드래그 가능한 스크롤 핸들.

::-webkit-scrollbar-track : 흰색 막대 위에 회색 막대가 있는 스크롤 막대의 트랙

::-webkit-scrollbar-track-piece : 핸들로 덮이지 않은 트랙 부분

::-webkit-scrollbar-corner : 수평 및 수직 스크롤 막대가 만나는 스크롤 막대의 하단 모서리 이것은 종종 브라우저 창의 오른쪽 하단 모서리입니다.

::-webkit-resizer : 일부 요소의 하단 모서리에 나타나는 드래그 가능한 크기 조정 핸들.

처음 사용해본 속성이였고 이번에 사용된 속성은
::-webkit-scrollbar 로 전체 스크롤바를 안보이게 하고 싶었다.
이유는 깔끔한 모달창을 만들고 싶었기 때문이다.
앞으로 다시 사용 할 수도 있을 것 같은 속성이다.