dark-light-choose()가 작동하지 않을 수 있는 이유는?

[awesomerobot (Kris)]

SCSS가 컴파일되는 방식 때문에, 커스텀 다크/라이트 정의는 테마 내의 color_definitions.scss에 추가해야 하며, 다른 scss 파일에서는 작동하지 않는다고 생각합니다.

color_definitions.scss는 캐스케이드에서 매우 상위에 위치해 있습니다(기본 스타일 대부분보다 앞서므로), 따라서 .modal.history-modal ins 부분을 거기에 추가하면 안 됩니다. 대신 색상 정의 자체만 추가하면 됩니다…

$dark-theme-ins: #acf2bd;
$light-theme-ins: #4da06d;

$ins: dark-light-choose($light-theme-ins, $dark-theme-ins);

:root {
  --custom-ins: #{$ins};
}

그리고 common 또는 테마의 다른 파일 중 하나에서 다음과 같이 하면 됩니다:

.modal.history-modal {
    ins {
        background: var(--custom-ins);
    }
}