<commit_before>@import 'Narrative';

article > section > aside {
  @include flexbox;
  @include flex-flow(row wrap);
  @include justify-content(center);

  @include flex($fg: 1, $fs: 1, $fb: 20em);

  max-width: 36.3em;

  margin: 9px;
  padding: 0.3em;
  padding-bottom: 0;

  @media screen and (min-width: $mobileCutoff) {
    margin: 10px 1em;
    padding: 0.5em;
  }

  height: 100%;

  background-color: rgba( darken($black, 10%), 0.6 );

  border-radius: 2pt;

  a {
    text-decoration: none;

    @media screen and (min-width: $mobileCutoff) {
      @include flex($fg: 1, $fs: 0, $fb: 35%);
    }

    width: 100%;
    height: 100%;

    margin: 0.5em;
    padding: 0.11em;

    transition: all .15s cubic-bezier(.33, .66, .66, 1);

    @media screen and (min-width: $mobileCutoff) {
      margin: 0.5em;
      padding: 0.75em;
      max-width: 20em;
    }

    & > div {
      @media screen and (max-width: $mobileCutoff) {
        margin: auto;
        padding: 0.5em;
      }
    }

    img {
      width: 100%;
      min-height: 3em;
      background-color: lighten($umichBlue, 5%);
      background: radial-gradient(ellipse at top center, lighten($umichBlue, 10%) 0%, lighten($umichBlue, 5%) 100%);
    }

    figcaption {
      font-family: $serifFont + " Medium Italic";
      color: $white;
      font-size: 12pt;
      display: inline;
      padding: 2pt;
      padding-left: 0;
      padding-right: 0;
      -webkit-box-decoration-break: clone;
      -ms-box-decoration-break: clone;
      -o-box-decoration-break: clone;
      box-decoration-break: clone;

      box-shadow: 2pt 0 0 none, -2pt 0 0 none;
      transition: background .15s cubic-bezier(.33, .66, .66, 1),
                  box-shadow .15s cubic-bezier(.33, .66, .66, 1),
                  color .15s cubic-bezier(.33, .66, .66, 1);
    }

    figcaption.focus {
      background-color: $lightGreen;
      color: $black;
      box-shadow: 2pt 0 0 $lightGreen, -2pt 0 0 $lightGreen;
    }
  }

  a.pop {
    cursor: pointer;
    transform: scale(1.02);
    background-color: rgba(138, 199, 255, 0.07);
    border-radius: 2pt;
    -webkit-box-shadow: 0 10px 6px -6px rgba(0,0,0,.4);
    -moz-box-shadow: 0 10px 6px -6px rgba(0,0,0,.4);
    box-shadow: 0 10px 6px -6px rgba(0,0,0,.4);
  }

  a {
    & > div { position: relative; }

    .edgenote-icon{
      display: inline-block;
      margin-right: 4pt;
      position: relative;
      bottom: -4pt;
    }
  }

}<commit_msg>Fixes edgenote link hover color which breaks on mobile.<commit_after>@import 'Narrative';

article > section > aside {
  @include flexbox;
  @include flex-flow(row wrap);
  @include justify-content(center);

  @include flex($fg: 1, $fs: 1, $fb: 20em);

  max-width: 36.3em;

  margin: 9px;
  padding: 0.3em;
  padding-bottom: 0;

  @media screen and (min-width: $mobileCutoff) {
    margin: 10px 1em;
    padding: 0.5em;
  }

  height: 100%;

  background-color: rgba( darken($black, 10%), 0.6 );

  border-radius: 2pt;

  a {
    text-decoration: none;

    @media screen and (min-width: $mobileCutoff) {
      @include flex($fg: 1, $fs: 0, $fb: 35%);
    }

    width: 100%;
    height: 100%;

    margin: 0.5em;
    padding: 0.11em;

    transition: all .15s cubic-bezier(.33, .66, .66, 1);

    @media screen and (min-width: $mobileCutoff) {
      margin: 0.5em;
      padding: 0.75em;
      max-width: 20em;
    }

    & > div {
      @media screen and (max-width: $mobileCutoff) {
        margin: auto;
        padding: 0.5em;
      }
    }

    img {
      width: 100%;
      min-height: 3em;
      background-color: lighten($umichBlue, 5%);
      background: radial-gradient(ellipse at top center, lighten($umichBlue, 10%) 0%, lighten($umichBlue, 5%) 100%);
    }

    figcaption {
      font-family: $serifFont + " Medium Italic";
      color: $white;
      font-size: 12pt;
      display: inline;
      padding: 2pt;
      padding-left: 0;
      padding-right: 0;
      -webkit-box-decoration-break: clone;
      -ms-box-decoration-break: clone;
      -o-box-decoration-break: clone;
      box-decoration-break: clone;

      box-shadow: 2pt 0 0 none, -2pt 0 0 none;
      transition: background .15s cubic-bezier(.33, .66, .66, 1),
                  box-shadow .15s cubic-bezier(.33, .66, .66, 1),
                  color .15s cubic-bezier(.33, .66, .66, 1);
    }

    figcaption.focus {
      background-color: $lightGreen;
      color: $black;
      box-shadow: 2pt 0 0 $lightGreen, -2pt 0 0 $lightGreen;
    }
  }

  a.pop {
    cursor: pointer;
    transform: scale(1.02);
    background-color: rgba(138, 199, 255, 0.07);
    border-radius: 2pt;
    -webkit-box-shadow: 0 10px 6px -6px rgba(0,0,0,.4);
    -moz-box-shadow: 0 10px 6px -6px rgba(0,0,0,.4);
    box-shadow: 0 10px 6px -6px rgba(0,0,0,.4);
  }

  a {
    & > div { position: relative; }

    .edgenote-icon{
      display: inline-block;
      margin-right: 4pt;
      position: relative;
      bottom: -4pt;
    }
  }

  a:hover {
    background-color: rgba(138, 199, 255, 0.07);
  }

}
{'fraction_non_alphanumeric': 0.15392273994424532, 'fraction_numerical': 0.0653126244524094, 'mean_word_length': 2.2178090967328634, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 11, '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': '2462681', 'n_tokens_mistral': 2180, 'n_tokens_neox': 1835, 'n_words': 466}