개요프로젝트 진행 중 다크모드 전환 간 tailwindcss로 transition 값을 설정한 요소의 transition이 매끄럽지 않음을 발견하게 되어 이를 해결할 방법을 찾아보았다.원인tailwindcss로 transition을 설정할때 transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);라는 값이 포함되는데, 이로 인해 기본 css로 transtion을 설정했을 때와 차이가 발생함을 확인했다.해결 방법transition-timing-function 값을 기본값으로 설정해주면 된다.찾아보니 transition-timing-function의 기본값은 ease값이라고 한다. tailwindcss에서는 ease-[ease]이게무슨이상한코드야로 설정할 수 있..
tailwindcss - transition-timing-function 기본값 설정
개요프로젝트 진행 중 다크모드 전환 간 tailwindcss로 transition 값을 설정한 요소의 transition이 매끄럽지 않음을 발견하게 되어 이를 해결할 방법을 찾아보았다.원인tailwindcss로 transition을 설정할때 transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);라는 값이 포함되는데, 이로 인해 기본 css로 transtion을 설정했을 때와 차이가 발생함을 확인했다.해결 방법transition-timing-function 값을 기본값으로 설정해주면 된다.찾아보니 transition-timing-function의 기본값은 ease값이라고 한다. tailwindcss에서는 ease-[ease]이게무슨이상한코드야로 설정할 수 있..
2024.12.03