<commit_before>/* -----------------------------------------------------------------------------
   #Media
   -------------------------------------------------------------------------- */
/**
 * 画像とテキストを横並びにするオブジェクトです。
 * 余白サイズ、垂直方向、要素の配置順の反転の指定ができます。
 * 任意の横幅以下でブロック（縦に積み重なる）レスポンシブ対応にすることができます。
 *
 * <div class="o-media [o-media--small o-media--middle o-media--rev o-media--stack-md-down]">
 *   <figure class="o-media__item">
 *     <img>
 *   </figure>
 *   <div class="o-media__item">
 *     <p></p>
 *   </div>
 * </div>
 */
$media-gutter: $spacing-inner !default;
$media-gutter-small: ($media-gutter / 2) !default;
$media-gutter-large: ($media-gutter * 2) !default;

.o-media {
  display: table;
  margin: 0;
  padding: 0;
}

.o-media__item {
  display: table-cell;
  width: 100%;
  margin: 0;
  padding: 0;
  vertical-align: top;
  &:not(:first-child) {
    padding-left: $media-gutter;
  }
  & > :first-child {
    margin-top: 0;
  }
  & > :last-child {
    margin-bottom: 0;
  }
}

.o-media__item > img {
  display: block;
  max-width: none;
}

.o-media--middle {
  > .o-media__item {
    vertical-align: middle;
  }
}

.o-media--bottom {
  > .o-media__item {
    vertical-align: bottom;
  }
}

.o-media--rev {
  text-align: left;
  direction: rtl;
  > .o-media__item {
    text-align: left;
    direction: ltr;
  }
  > .o-media__item:not(:first-child) {
    padding-right: $media-gutter;
    padding-left: 0;
  }
}

.o-media--small {
  > .o-media__item:not(:first-child) {
    padding-left: $media-gutter-small;
  }
  &.o-media--rev > .o-media__item:not(:first-child) {
    padding-right: $media-gutter-small;
    padding-left: 0;
  }
}

.o-media--large {
  > .o-media__item:not(:first-child) {
    padding-left: $media-gutter-large;
  }
  &.o-media--rev > .o-media__item:not(:first-child) {
    padding-right: $media-gutter-large;
    padding-left: 0;
  }
}

@include media-query-down(sm) {
  .o-media--stack-sm-down {
    > .o-media__item {
      display: block;
    }
    > .o-media__item:not(:first-child) {
      padding: $media-gutter 0 0;
    }
    > .o-media__item > img {
      margin: auto;
    }
    &.o-media--small > .o-media__item:not(:first-child) {
      padding: $media-gutter-small 0 0;
    }
    &.o-media--large > .o-media__item:not(:first-child) {
      padding: $media-gutter-large 0 0;
    }
  }
}

@include media-query-down(md) {
  .o-media--stack-md-down {
    > .o-media__item {
      display: block;
    }
    > .o-media__item:not(:first-child) {
      padding: $media-gutter 0 0;
    }
    > .o-media__item > img {
      margin: auto;
    }
    &.o-media--small > .o-media__item:not(:first-child) {
      padding: $media-gutter-small 0 0;
    }
    &.o-media--large > .o-media__item:not(:first-child) {
      padding: $media-gutter-large 0 0;
    }
  }
}<commit_msg>no message<commit_after>/* -----------------------------------------------------------------------------
   #Media
   -------------------------------------------------------------------------- */
/**
 * 画像とテキストを横並びにするオブジェクトです。
 * 余白サイズ、垂直方向、要素の配置順の反転の指定ができます。
 * 任意の横幅以下でブロック（縦に積み重なる）レスポンシブ対応にすることができます。
 *
 * <div class="o-media [o-media--small o-media--middle o-media--rev o-media--stack-md-down]">
 *   <figure class="o-media__item">
 *     <img>
 *   </figure>
 *   <div class="o-media__item">
 *     <p></p>
 *   </div>
 * </div>
 */
$media-gutter: $spacing-inner !default;
$media-gutter-small: ($media-gutter / 2) !default;
$media-gutter-large: ($media-gutter * 2) !default;

.o-media {
  display: table;
  width: 100%;
  margin: 0;
  padding: 0;
}

.o-media__item {
  display: table-cell;
  margin: 0;
  padding: 0;
  vertical-align: top;
  &:not(:first-child) {
    padding-left: $media-gutter;
  }
  & > :first-child {
    margin-top: 0;
  }
  & > :last-child {
    margin-bottom: 0;
  }
}

.o-media__item > img {
  display: block;
  max-width: none;
}

.o-media--middle {
  > .o-media__item {
    vertical-align: middle;
  }
}

.o-media--bottom {
  > .o-media__item {
    vertical-align: bottom;
  }
}

.o-media--rev {
  text-align: left;
  direction: rtl;
  > .o-media__item {
    text-align: left;
    direction: ltr;
  }
  > .o-media__item:not(:first-child) {
    padding-right: $media-gutter;
    padding-left: 0;
  }
}

.o-media--small {
  > .o-media__item:not(:first-child) {
    padding-left: $media-gutter-small;
  }
  &.o-media--rev > .o-media__item:not(:first-child) {
    padding-right: $media-gutter-small;
    padding-left: 0;
  }
}

.o-media--large {
  > .o-media__item:not(:first-child) {
    padding-left: $media-gutter-large;
  }
  &.o-media--rev > .o-media__item:not(:first-child) {
    padding-right: $media-gutter-large;
    padding-left: 0;
  }
}

@include media-query-down(sm) {
  .o-media--stack-sm-down {
    > .o-media__item {
      display: block;
    }
    > .o-media__item:not(:first-child) {
      padding: $media-gutter 0 0;
    }
    > .o-media__item > img {
      margin: auto;
    }
    &.o-media--small > .o-media__item:not(:first-child) {
      padding: $media-gutter-small 0 0;
    }
    &.o-media--large > .o-media__item:not(:first-child) {
      padding: $media-gutter-large 0 0;
    }
  }
}

@include media-query-down(md) {
  .o-media--stack-md-down {
    > .o-media__item {
      display: block;
    }
    > .o-media__item:not(:first-child) {
      padding: $media-gutter 0 0;
    }
    > .o-media__item > img {
      margin: auto;
    }
    &.o-media--small > .o-media__item:not(:first-child) {
      padding: $media-gutter-small 0 0;
    }
    &.o-media--large > .o-media__item:not(:first-child) {
      padding: $media-gutter-large 0 0;
    }
  }
}
{'fraction_non_alphanumeric': 0.23443354148082068, 'fraction_numerical': 0.009277430865298841, 'mean_word_length': 2.0107411385606873, 'pattern_counts': {'":': 0, '<': 21, '<?xml version=': 0, '>': 67, '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': '6577295', 'n_tokens_mistral': 2374, 'n_tokens_neox': 2314, 'n_words': 323}