<commit_before>$mq-col1: $mq-not-medium;
$mq-col2: $mq-medium;
$mq-col3: $mq-x-large;

#main-wrap {
  --main-max-width: calc(100vh - #{$site-header-outer-height} - #{$col1-uniboard-controls});
  @include breakpoint($mq-col2) {
    --main-max-width: auto;
  }
}

.coord-trainer {
  grid-area: main;
  display: grid;

  overflow: hidden; // coords cause mobile to have horiz scrolling

  &__side { grid-area: side; }
  &__board { grid-area: board; }
  &__table { grid-area: table; }
  &__progress { grid-area: progress; }
  &__score { grid-area: score; }

  grid-template-areas:
  'board'
  'progress'
  'score'
  'table'
  'side';
  grid-row-gap: $block-gap;

  @include breakpoint($mq-col2) {
    grid-template-columns: $col2-uniboard-width $block-gap $col2-uniboard-table;
    grid-template-rows: fit-content(0);
    grid-template-areas:
    'board    . table'
    'board    . side'
    'progress . .'
    'score    . .';
  }

  @include breakpoint($mq-col3) {
    grid-template-areas:
    'side . board    . table'
    '.    . progress . .'
    '.    . score    . .';
    grid-template-columns: $col3-uniboard-side $block-gap $col3-uniboard-width $block-gap $col3-uniboard-table;
  }

  .box {
    padding: $block-gap;
    h1 {
      font-size: 1.5em;
      padding: 0 !important;
      text-align: center;
    }
    p {
      margin-top: 1em;
    }
  }

  form.color {
    margin-top: $block-gap;
    .color i {
      display: block;
      width: 30px;
      height: 30px;
      background-size: 30px 30px;
      background-repeat: no-repeat;
      padding: 0;
    }
    .color_1 i {
      background-image: url(../piece/cburnett/wK.svg);
    }
    .color_2 i {
      background-image: url(../images/wbK.svg);
    }
    .color_3 i {
      background-image: url(../piece/cburnett/bK.svg);
    }
  }

  .next_coord {
    @extend %flex-center;
    z-index: 2;
    justify-content: center;
    position: absolute;
    top: 0;
    left: 0;
    width: 90%;
    height: 100%;
    font-size: 180px;
    font-family: monospace;
    font-weight: bold;
    text-transform: uppercase;
    opacity: 1;
    pointer-events: none;
    color: #eee;
    text-shadow: 0 10px 10px #444;
    opacity: 0.8;
    @include transition();
    &.nope {
      color: $c-bad !important;
    }
  }
  #next_coord0 {
    color: #fff;
  }<commit_msg>use lowercase in coordinate training<commit_after>$mq-col1: $mq-not-medium;
$mq-col2: $mq-medium;
$mq-col3: $mq-x-large;

#main-wrap {
  --main-max-width: calc(100vh - #{$site-header-outer-height} - #{$col1-uniboard-controls});
  @include breakpoint($mq-col2) {
    --main-max-width: auto;
  }
}

.coord-trainer {
  grid-area: main;
  display: grid;

  overflow: hidden; // coords cause mobile to have horiz scrolling

  &__side { grid-area: side; }
  &__board { grid-area: board; }
  &__table { grid-area: table; }
  &__progress { grid-area: progress; }
  &__score { grid-area: score; }

  grid-template-areas:
  'board'
  'progress'
  'score'
  'table'
  'side';
  grid-row-gap: $block-gap;

  @include breakpoint($mq-col2) {
    grid-template-columns: $col2-uniboard-width $block-gap $col2-uniboard-table;
    grid-template-rows: fit-content(0);
    grid-template-areas:
    'board    . table'
    'board    . side'
    'progress . .'
    'score    . .';
  }

  @include breakpoint($mq-col3) {
    grid-template-areas:
    'side . board    . table'
    '.    . progress . .'
    '.    . score    . .';
    grid-template-columns: $col3-uniboard-side $block-gap $col3-uniboard-width $block-gap $col3-uniboard-table;
  }

  .box {
    padding: $block-gap;
    h1 {
      font-size: 1.5em;
      padding: 0 !important;
      text-align: center;
    }
    p {
      margin-top: 1em;
    }
  }

  form.color {
    margin-top: $block-gap;
    .color i {
      display: block;
      width: 30px;
      height: 30px;
      background-size: 30px 30px;
      background-repeat: no-repeat;
      padding: 0;
    }
    .color_1 i {
      background-image: url(../piece/cburnett/wK.svg);
    }
    .color_2 i {
      background-image: url(../images/wbK.svg);
    }
    .color_3 i {
      background-image: url(../piece/cburnett/bK.svg);
    }
  }

  .next_coord {
    @extend %flex-center;
    z-index: 2;
    justify-content: center;
    position: absolute;
    top: 0;
    left: 0;
    width: 90%;
    height: 100%;
    font-size: 180px;
    font-weight: bold;
    opacity: 1;
    pointer-events: none;
    color: #eee;
    text-shadow: 0 10px 10px #444;
    opacity: 0.8;
    @include transition();
    &.nope {
      color: $c-bad !important;
    }
  }
  #next_coord0 {
    color: #fff;
  }
{'fraction_non_alphanumeric': 0.16166883963494133, 'fraction_numerical': 0.024337244676227728, 'mean_word_length': 2.176673567977916, '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': '4485358', 'n_tokens_mistral': 1871, 'n_tokens_neox': 1764, 'n_words': 344}