Revert "refactor(material/card): switch to new theming API" (#25464)

This reverts commit 3738a24.

Author: andrewseguin

src/material/card/_card-theme.scss

@@ -1,8 +1,7 @@
 @use '../core/theming/theming';
 @use '../core/mdc-helpers/mdc-helpers';
 @use '../core/typography/typography';
-@use '@material/card/elevated-card-theme' as mdc-elevated-card-theme;
-@use '@material/card/outlined-card-theme' as mdc-outlined-card-theme;
+@use '@material/card' as mdc-card;
 @use '@material/typography' as mdc-typography;
 @use '@material/theme/theme-color' as mdc-theme-color;
 @use 'sass:color';
@@ -11,31 +10,36 @@
 @mixin color($config-or-theme) {
   $config: theming.get-color-config($config-or-theme);
   $foreground: map.get($config, foreground);
+  $is-dark-theme: map.get($config, is-dark);
+
+  $orig-mdc-card-action-icon-color: mdc-card.$action-icon-color;
+  $orig-mdc-card-outline-color: mdc-card.$outline-color;
 
   @include mdc-helpers.using-mdc-theme($config) {
-    .mat-mdc-card {
-      @include mdc-elevated-card-theme.theme((
-        container-color: mdc-theme-color.prop-value(surface),
-      ));
+    mdc-card.$action-icon-color: rgba(mdc-theme-color.prop-value(on-surface),
+      mdc-theme-color.text-emphasis(medium));
+    mdc-card.$outline-color: color.mix(mdc-theme-color.prop-value(on-surface),
+      mdc-theme-color.prop-value(surface), 12%);
 
-      @include mdc-outlined-card-theme.theme((
-        outline-color: color.mix(mdc-theme-color.prop-value(on-surface),
-          mdc-theme-color.prop-value(surface), 12%)
-      ));
-    }
+    @include mdc-card.without-ripple($query: mdc-helpers.$mdc-theme-styles-query);
 
     // Card subtitles are an Angular Material construct (not MDC), so we explicitly set their
     // color to secondary text here.
     .mat-mdc-card-subtitle {
       color: theming.get-color-from-palette($foreground, secondary-text);
     }
   }
+
+  mdc-card.$action-icon-color: $orig-mdc-card-action-icon-color;
+  mdc-card.$outline-color: $orig-mdc-card-outline-color;
 }
 
 @mixin typography($config-or-theme) {
   $config: typography.private-typography-to-2018-config(
       theming.get-typography-config($config-or-theme));
   @include mdc-helpers.using-mdc-typography($config) {
+    @include mdc-card.without-ripple($query: mdc-helpers.$mdc-typography-styles-query);
+
     // Card subtitles and titles are an Angular Material construct (not MDC), so we explicitly
     // set their typographic styles here.
     .mat-mdc-card-title {

src/material/card/card.scss

@@ -1,9 +1,5 @@
-@use '@material/card' as mdc-card;
-@use '@material/card/variables' as mdc-card-variables;
-@use '@material/card/elevated-card-theme' as mdc-elevated-card-theme;
-@use '@material/card/outlined-card-theme' as mdc-outlined-card-theme;
 @use '../core/mdc-helpers/mdc-helpers';
-@use '../core/style/elevation';
+@use '@material/card' as mdc-card;
 
 // TODO(jelbourn): move header and title-group styles to their own files.
 
@@ -15,33 +11,7 @@ $mat-card-default-padding: 16px !default;
 
 @include mdc-helpers.disable-mdc-fallback-declarations {
   // Include all MDC card styles except for color and typography.
-  @include mdc-card.static-styles($query: mdc-helpers.$mdc-base-styles-query);
-}
-
-.mat-mdc-card {
-  position: relative;
-
-  @include mdc-helpers.disable-mdc-fallback-declarations {
-    // MDC's theme has `container-elevation` and `container-shadow-color` tokens, but we can't
-    // use them because they output under a `.mdc-card` selector whereas the rest of the theme
-    // isn't under any selector. Even if the mixin is pulled out of the selector, it throws a
-    // different error.
-    @include elevation.elevation(1);
-    @include mdc-elevated-card-theme.theme-styles((
-      container-color: transparent,
-      container-shape: mdc-card-variables.$shape-radius,
-    ));
-  }
-}
-
-.mat-mdc-card-outlined {
-  @include mdc-helpers.disable-mdc-fallback-declarations {
-    @include elevation.elevation(0);
-    @include mdc-outlined-card-theme.theme-styles((
-      outline-color: transparent,
-      outline-width: 1px,
-    ));
-  }
+  @include mdc-card.without-ripple($query: mdc-helpers.$mdc-base-styles-query);
 }
 
 // Title text and subtitles text within a card. MDC doesn't have pre-made title sections for cards.

src/material/card/card.ts

@@ -40,8 +40,7 @@ export const MAT_CARD_CONFIG = new InjectionToken<MatCardConfig>('MAT_CARD_CONFI
   styleUrls: ['card.css'],
   host: {
     'class': 'mat-mdc-card mdc-card',
-    '[class.mat-mdc-card-outlined]': 'appearance === "outlined"',
-    '[class.mdc-card--outlined]': 'appearance === "outlined"',
+    '[class.mdc-card--outlined]': 'appearance == "outlined"',
   },
   exportAs: 'matCard',
   encapsulation: ViewEncapsulation.None,