<commit_before>@use 'sass:math';
@use '../core/style/variables';
@use '../core/style/elevation';
@use '../core/style/private';
@use '../../cdk/a11y';


$padding: 16px !default;
$border-radius: 4px !default;
$header-size: 40px !default;

.mat-card {
  @include elevation.elevation-transition;
  @include private.private-animation-noop();
  display: block;
  position: relative;
  padding: $padding;
  border-radius: $border-radius;

  .mat-divider-horizontal {
    position: absolute;
    left: 0;
    width: 100%;

    [dir='rtl'] & {
      left: auto;
      right: 0;
    }

    &.mat-divider-inset {
      position: static;
      margin: 0;

      [dir='rtl'] & {
        // Needs to be reset explicitly since the divider set `margin-right` in particular in RTL.
        margin-right: 0;
      }
    }
  }

  @include a11y.high-contrast(active, off) {
    outline: solid 1px;
  }
}

// base styles for each card section preset (mat-card-content, etc)
%mat-card-section-base {
  display: block;
  margin-bottom: 16px;
}

.mat-card-title {
  display: block;
  margin-bottom: 8px;
}

.mat-card-subtitle, .mat-card-content {
  @extend %mat-card-section-base;
}

.mat-card-actions {
  @extend %mat-card-section-base;
  margin-left: math.div(-$padding, 2);
  margin-right: math.div(-$padding, 2);
  padding: 8px 0;
}

.mat-card-actions-align-end {
  display: flex;
  justify-content: flex-end;
}

.mat-card-image {
  width: calc(100% + #{$padding * 2});
  margin: 0 (-$padding) 16px (-$padding);
}

.mat-card-footer {
  // The negative margins pulls out the element, countering the padding
  // to get the footer to be flush against the side of the card.
  $margin: -$padding;
<commit_msg>fix(material/card): handle picture element as mat-card-image (#23678)<commit_after>@use 'sass:math';
@use '../core/style/variables';
@use '../core/style/elevation';
@use '../core/style/private';
@use '../../cdk/a11y';


$padding: 16px !default;
$border-radius: 4px !default;
$header-size: 40px !default;

.mat-card {
  @include elevation.elevation-transition;
  @include private.private-animation-noop();
  display: block;
  position: relative;
  padding: $padding;
  border-radius: $border-radius;

  .mat-divider-horizontal {
    position: absolute;
    left: 0;
    width: 100%;

    [dir='rtl'] & {
      left: auto;
      right: 0;
    }

    &.mat-divider-inset {
      position: static;
      margin: 0;

      [dir='rtl'] & {
        // Needs to be reset explicitly since the divider set `margin-right` in particular in RTL.
        margin-right: 0;
      }
    }
  }

  @include a11y.high-contrast(active, off) {
    outline: solid 1px;
  }
}

// base styles for each card section preset (mat-card-content, etc)
%mat-card-section-base {
  display: block;
  margin-bottom: 16px;
}

.mat-card-title {
  display: block;
  margin-bottom: 8px;
}

.mat-card-subtitle, .mat-card-content {
  @extend %mat-card-section-base;
}

.mat-card-actions {
  @extend %mat-card-section-base;
  margin-left: math.div(-$padding, 2);
  margin-right: math.div(-$padding, 2);
  padding: 8px 0;
}

.mat-card-actions-align-end {
  display: flex;
  justify-content: flex-end;
}

.mat-card-image {
  width: calc(100% + #{$padding * 2});
  margin: 0 (-$padding) 16px (-$padding);

  // The following properties are to handle `mat-card-image` on a `picture` element.
  display: block;
  overflow: hidden;

  img {
    width: 100%;
  }
}

.mat-card-footer {
  // The negative margins pulls out the element, countering the padding
  // to get the footer to be flush against the side of the card.
  $margin: -$padding;

{'fraction_non_alphanumeric': 0.161731843575419, 'fraction_numerical': 0.019553072625698324, 'mean_word_length': 2.9093886462882095, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 3, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '2945827', 'n_tokens_mistral': 1354, 'n_tokens_neox': 1263, 'n_words': 320}