<commit_before>/**
  * @parent gaiden_css.components
  * @stylesheet gaiden_css.components.page-banner.css Page Banner
  *
  * @demo demo/gaiden-css/components/page-banner/demo.html
**/

.page-banner {
  @include flexbox;
  @include flex-direction(row);
  @include media(small) {
    height: 576px;
  }

  width: 100%;
  height: 430px;
  position: relative;

  &__content {
    @include flexbox;
    padding: 30px;
    width: 100%;
    align-items: center;
    justify-content: center;
    text-align: center;
    z-index: 2;

    [class*='-title'] {
      color: get-color(air);
    }
  }

  &__picture {
    position: absolute;

    img {
      height: 100%;
    }
  }

  &--over {
    .page-banner__content {
      @include media(medium) {
        padding-bottom: $pageOverMedium + px;
      }

      padding-bottom: $pageOverSmall + px;
    }
  }

  + .page-banner-over {
    @include media(medium) {
      margin-top: - $pageOverMedium + px;
    }

    margin-top: - $pageOverSmall + px;
  }
}<commit_msg>Picture of page has 100% on width/height and img height: auto<commit_after>/**
  * @parent gaiden_css.components
  * @stylesheet gaiden_css.components.page-banner.css Page Banner
  *
  * @demo demo/gaiden-css/components/page-banner/demo.html
**/

.page-banner {
  @include flexbox;
  @include flex-direction(row);
  @include media(small) {
    height: 576px;
  }

  width: 100%;
  height: 430px;
  position: relative;

  &__content {
    @include flexbox;
    padding: 30px;
    width: 100%;
    align-items: center;
    justify-content: center;
    text-align: center;
    z-index: 2;

    [class*='-title'] {
      color: get-color(air);
    }
  }

  &__picture {
    position: absolute;
    width: 100%;
    height: 100%;

    img {
      height: auto;
    }
  }

  &--over {
    .page-banner__content {
      @include media(medium) {
        padding-bottom: $pageOverMedium + px;
      }

      padding-bottom: $pageOverSmall + px;
    }
  }

  + .page-banner-over {
    @include media(medium) {
      margin-top: - $pageOverMedium + px;
    }

    margin-top: - $pageOverSmall + px;
  }
}
{'fraction_non_alphanumeric': 0.14265335235378032, 'fraction_numerical': 0.019971469329529243, 'mean_word_length': 2.371794871794872, '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': '6630666', 'n_tokens_mistral': 814, 'n_tokens_neox': 755, 'n_words': 148}