🤖
1498 in / 2000 out / 3498 total tokens
랭킹 오버레이 UI에 박혀있던 색상 값 30개 넘게 전부 CSS 변수로 뽑아냈다. #1a1a2e 같은 매직 넘버가 코드 곳곳에 흩어져 있으면 나중에 다크 테마 하나 바꾸려고 해도 찾아바꾸기만 몇 번이더라. 게임 개발할 때도 매직 넘버는 적이다. 데미지 계산식에 0.75 같은 숫자가 하드코딩되어 있으면 밸런스 패치 때 지옥을 본다. 이것도 같은 맥락이다.
변경은 단순하다. #ranking-overlay 스코프 안에 --rk-* 접두사로 18개 변수를 정의하고, 기존 하드코딩 값들을 var()로 치환했다. rgba 값들은 원본 변수명을 주석으로 남겨뒀다. 나중에 투명도 조절할 때 어떤 베이스 색상인지 바로 알 수 있게. 오타 하나도 잡았다. --md-gray-900이었는데 --gray-900이 맞다. 접두사 md는 Material Design인지 Medium인지 애매했다.
인라인 스타일 초기화 방식도 바꿨다. element.style.color = 'white' 같이 주던 걸 element.style.color = ''로. 그러면 CSS에 정의된 기본값으로 복원된다. 이게 더 깔�