angular upgrade: migrate ng material style

src/app/shared/shared.module.ts

@@ -1,7 +1,7 @@
 import { CommonModule } from '@angular/common';
 import { NgModule } from '@angular/core';
 import { FormsModule } from '@angular/forms';
-import { MatLegacyButtonModule as MatButtonModule } from '@angular/material/legacy-button';
+import { MatButtonModule } from '@angular/material/button';
 import { MatCheckboxModule } from '@angular/material/checkbox';
 import { MatDatepickerModule } from '@angular/material/datepicker';
 import { MatDialogModule } from '@angular/material/dialog';

src/styles.scss

@@ -6,19 +6,7 @@
 // Include the common styles for Angular Material. We include this here so that you only
 // have to load a single css file for Angular Material in your app.
 // Be sure that you only ever include this mixin once!
-// TODO(v15): As of v15 mat.legacy-core no longer includes default typography styles.
-//  The following line adds:
-//    1. Default typography styles for all components
-//    2. Styles for typography hierarchy classes (e.g. .mat-headline-1)
-//  If you specify typography styles for the components you use elsewhere, you should delete this line.
-//  If you don't need the default component typographies but still want the hierarchy styles,
-//  you can delete this line and instead use:
-//    `@include mat.legacy-typography-hierarchy(mat.define-typography-config());`
-/* TODO(mdc-migration): Remove all-legacy-component-typographies once all legacy components are migrated*/
-@include mat.all-legacy-component-typographies();
 @include mat.all-component-typographies();
-/* TODO(mdc-migration): Remove legacy-core once all legacy components are migrated*/
-@include mat.legacy-core();
 @include mat.core();
 
 // import your custom themes
@@ -27,18 +15,12 @@
 @import 'theme-contrast.scss';
 
 .theme-light {
-	/* TODO(mdc-migration): Remove all-legacy-component-themes once all legacy components are migrated*/
-	@include mat.all-legacy-component-themes($theme-light);
 	@include mat.all-component-themes($theme-light);
 }
 .theme-dark {
-	/* TODO(mdc-migration): Remove all-legacy-component-themes once all legacy components are migrated*/
-	@include mat.all-legacy-component-themes($theme-dark);
 	@include mat.all-component-themes($theme-dark);
 }
 .theme-contrast {
-	/* TODO(mdc-migration): Remove all-legacy-component-themes once all legacy components are migrated*/
-	@include mat.all-legacy-component-themes($theme-contrast);
 	@include mat.all-component-themes($theme-contrast);
 }
 

src/styles/partials/_forms.scss

@@ -70,13 +70,13 @@ textarea {
 }
 
 // radio input structure
-/* TODO(mdc-migration): The following rule targets internal classes of checkbox that may no longer apply for the MDC version.*/
-.mat-checkbox-label,
-.mat-checkbox-layout .mat-checkbox-label {
-	max-width: 90vw;
-	overflow-x: auto;
-	@extend .clickable;
-}
+// /* TODO(mdc-migration): The following rule targets internal classes of checkbox that may no longer apply for the MDC version.*/
+// .mat-checkbox-label,
+// .mat-checkbox-layout .mat-checkbox-label {
+// 	max-width: 90vw;
+// 	overflow-x: auto;
+// 	@extend .clickable;
+// }
 button,
 .button {
 	font-family: 'Helvetica';

src/theme-contrast.scss

@@ -14,6 +14,4 @@ $theme-contrast: mat.define-light-theme($theme-contrast-primary, $theme-contrast
 // Include theme styles for core and each component used in your app.
 // Alternatively, you can import and @include the theme mixins for each component
 // that you are using.
-/* TODO(mdc-migration): Remove all-legacy-component-themes once all legacy components are migrated*/
-@include mat.all-legacy-component-themes($theme-contrast);
 @include mat.all-component-themes($theme-contrast);

src/theme-dark.scss

@@ -14,6 +14,4 @@ $theme-dark: mat.define-dark-theme($theme-dark-primary, $theme-dark-accent, $the
 // Include theme styles for core and each component used in your app.
 // Alternatively, you can import and @include the theme mixins for each component
 // that you are using.
-/* TODO(mdc-migration): Remove all-legacy-component-themes once all legacy components are migrated*/
-@include mat.all-legacy-component-themes($theme-dark);
 @include mat.all-component-themes($theme-dark);

src/theme-light.scss

@@ -14,6 +14,4 @@ $theme-light: mat.define-light-theme($theme-light-primary, $theme-light-accent,
 // Include theme styles for core and each component used in your app.
 // Alternatively, you can import and @include the theme mixins for each component
 // that you are using.
-/* TODO(mdc-migration): Remove all-legacy-component-themes once all legacy components are migrated*/
-@include mat.all-legacy-component-themes($theme-light);
 @include mat.all-component-themes($theme-light);