Angular 16: Angular Material 확인란(MDC)의 크기를 어떻게 변경합니까?

Question

이제는 레거시로 간주되는 Material에서 다음과 같이 확인란의 크기를 설정할 수 있습니다.

.mat-checkbox-frame {
  폭: 1.5rem;
}

MDC에서도 동일한 효과를 얻으려면 어떻게 해야 합니까?

Answer 1

체크박스의 크기를 변경하려면 styles.scss에 다음 CSS 코드를 추가하세요.

으아악

그러나 기본 파급 효과를 사용하려는 경우 이는 솔루션의 절반에 불과합니다. 이제 물결 효과의 원 안에 완벽하게 맞도록 확인란을 정렬해야 합니다. styles.scss에 다음 CSS 코드를 추가하세요:

으아악

실시간 데모를 참고하세요.