Sorting
-
[scss] react-data-grid 에서 기본 sorting 화살표 보여주기.CSS 2022. 5. 20. 19:55
프로젝트에서 표가 들어가는 부분들은 react-data-grid 라는 라이브러리를 사용하고 있다. 헤더를 클릭하면 내림차순, 오름차순, 정렬 기준 선택없음 총 세개의 상태를 보여주는데, 정렬 기준 선택없음의 상태일 때는 화살표가 보이지 않아 화살표를 기본으로 보여주기 위한 방법을 찾았다. 내림차순 & 오름차순이 될 때마다 애니메이션이 들어간 세모가 휘릭휘릭 바뀌기에 처음에는 그 세모가 들어갈 요소만을 선택해 span 의 last-child 뒤에 pseudo selector 를 이용해서 content 를 집어넣었는데, 그렇게 하니 한 번 집어넣은 가상 요소를 내림차순 혹은 오름차순 등 표가 선택될 때마다 안 보이게 해주는 것이 더 복잡해질 뿐이었다 ^ㅠ^ :has 를 사용하고 싶었으나 sass 에서는 변환..