File: /var/www/vhost/disk-apps/pwa.sports-crowd.com/node_modules/@angular/material/card/_card-theme.scss
@use 'sass:map';
@use '../core/theming/theming';
@use '../core/typography/typography';
@use '../core/tokens/token-utils';
@use '../core/tokens/m2/mat/card' as tokens-mat-card;
@use '../core/tokens/m2/mdc/elevated-card' as tokens-mdc-elevated-card;
@use '../core/tokens/m2/mdc/outlined-card' as tokens-mdc-outlined-card;
@use '@material/card/elevated-card-theme' as mdc-elevated-card-theme;
@use '@material/card/outlined-card-theme' as mdc-outlined-card-theme;
@mixin color($config-or-theme) {
$config: theming.get-color-config($config-or-theme);
$mdc-elevated-card-color-tokens: token-utils.resolve-elevation(
tokens-mdc-elevated-card.get-color-tokens($config),
container-elevation,
container-shadow-color
);
$mdc-outlined-card-color-tokens: token-utils.resolve-elevation(
tokens-mdc-outlined-card.get-color-tokens($config),
container-elevation,
container-shadow-color,
);
$mat-card-color-tokens: tokens-mat-card.get-color-tokens($config);
// Add values for card tokens.
.mat-mdc-card {
@include mdc-elevated-card-theme.theme($mdc-elevated-card-color-tokens);
@include mdc-outlined-card-theme.theme($mdc-outlined-card-color-tokens);
@include token-utils.create-token-values(tokens-mat-card.$prefix, $mat-card-color-tokens);
}
}
@mixin typography($config-or-theme) {
$config: typography.private-typography-to-2018-config(
theming.get-typography-config($config-or-theme));
$mdc-elevated-card-typography-tokens: tokens-mdc-elevated-card.get-typography-tokens($config);
$mdc-outlined-card-typography-tokens: tokens-mdc-outlined-card.get-typography-tokens($config);
$mat-card-typography-tokens: tokens-mat-card.get-typography-tokens($config);
// Add values for card tokens.
.mat-mdc-card {
@include mdc-elevated-card-theme.theme($mdc-elevated-card-typography-tokens);
@include mdc-outlined-card-theme.theme($mdc-outlined-card-typography-tokens);
@include token-utils.create-token-values(tokens-mat-card.$prefix, $mat-card-typography-tokens);
}
}
@mixin density($config-or-theme) {
$density-scale: theming.get-density-config($config-or-theme);
$mdc-elevated-card-density-tokens: tokens-mdc-elevated-card.get-density-tokens($density-scale);
$mdc-outlined-card-density-tokens: tokens-mdc-outlined-card.get-density-tokens($density-scale);
$mat-card-density-tokens: tokens-mat-card.get-density-tokens($density-scale);
// Add values for card tokens.
.mat-mdc-card {
@include mdc-elevated-card-theme.theme($mdc-elevated-card-density-tokens);
@include mdc-outlined-card-theme.theme($mdc-outlined-card-density-tokens);
@include token-utils.create-token-values(tokens-mat-card.$prefix, $mat-card-density-tokens);
}
}
@mixin theme($theme-or-color-config) {
$theme: theming.private-legacy-get-theme($theme-or-color-config);
@include theming.private-check-duplicate-theme-styles($theme, 'mat-card') {
$color: theming.get-color-config($theme);
$density: theming.get-density-config($theme);
$typography: theming.get-typography-config($theme);
@if $color != null {
@include color($color);
}
@if $density != null {
@include density($density);
}
@if $typography != null {
@include typography($typography);
}
}
}
@mixin theme-from-tokens($tokens) {
@if ($tokens != ()) {
$elevated-card-tokens: map.get($tokens, tokens-mdc-elevated-card.$prefix);
// Work around a bug in MDC where the elevation is not resolved to an actual shadow value.
$elevated-card-tokens: token-utils.resolve-elevation(
$elevated-card-tokens,
container-elevation,
container-shadow-color
);
$outlined-card-tokens: map.get($tokens, tokens-mdc-outlined-card.$prefix);
// Work around a bug in MDC where the elevation is not resolved to an actual shadow value.
$outlined-card-tokens: token-utils.resolve-elevation(
$outlined-card-tokens,
container-elevation,
container-shadow-color
);
@include mdc-elevated-card-theme.theme($elevated-card-tokens);
@include mdc-outlined-card-theme.theme($outlined-card-tokens);
@include token-utils.create-token-values(
tokens-mat-card.$prefix, map.get($tokens, tokens-mat-card.$prefix));
}
}