<commit_before><style>
  {{!-- flow like a normal webpage for development --}}
  html {
    cursor: auto;
    overflow: scroll;
  }
  body {
    height: 1000px;
  }

  .layout {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  .layout > div {
    margin-bottom: 20px;
  }

  .currentTemperatures {
    display: flex;
    flex-direction: row;
    align-items: center;
  }
  .currentTemperatures > div {
    margin: 0 20px;
    text-align: center;
  }
  .temperatureCircle {
    width: 118px;
    height: 118px;
    border-radius: 71px;
    border: 6px solid #000;
    font-size: 65px;
    color: #000;
    line-height: 118px;
    text-align: center;
    background: #fff;
    box-shadow: 0 0 0 2px #fff;
  }
  .lowHigh {
    line-height: 1em;
    text-transform: uppercase;
  }

  .conditionDetails {
    display: flex;
    flex-direction: row;
    align-items: center;
  }
  .conditionDetails > div {
    text-align: center;
    padding-left: 45px;
    padding-right: 30px;
  }
  .icon {
    position: relative;
  }
  .icon > img {
    -webkit-filter: invert(1);
    filter: invert(1);
    height: 50px;
    width: 50px;
    position: absolute;
    margin: -13px 0 0 -45px;
  }

  .suntimeContainer {
    padding-left: 7px;
  }
  .suntime {
    position: relative;
  }
  .suntime > img {
    position: absolute;
    height: 50px;
    width: 50px;
    top: -13px;
    left: -45px;
  }

  .alerts {
    text-align: left;
    width: 315px;
  }
  .alerts li {
    list-style-type: none;
    color: #f88;
    margin-bottom: 1em;
  }
  .alerts img {
    position: absolute;
    margin-left: -40px;
  }

  .chartContainer {
    position: relative;
    width: 270px;
    height: 150px;
    left: -20px;
  }
  .chartContainer .tempIcon {
    position: absolute;
    top: -12px;
    right: -45px;
    width: 50px;
    height: 50px;
  }
  .chartContainer .windIcon {
    position: absolute;
    top: 15px;
    right: -45px;
    width: 50px;
    height: 50px;
  }
  .chartContainer .precipIcon {
    position: absolute;
    top: 44px;
    right: -45px;
    width: 50px;
    height: 50px;
  }
  #chart {
    width: 270px;
    height: 150px;
  }

  .forecastSummary {
    width: 315px;
  }
  .forecastSummaryTitle {
    text-transform: uppercase;
    text-align: left;
    font-weight: bold;
    color: #fff;
  }
  .forecastSummaryText {
    font-size: 0.75em;
    text-align: left;
    line-height: 1.5em;
  }

  .weekly {
    width: 315px;
  }
  .weekly td {<commit_msg>Match forecast text to calendar.<commit_after><style>
  {{!-- flow like a normal webpage for development --}}
  html {
    cursor: auto;
    overflow: scroll;
  }
  body {
    height: 1000px;
  }

  .layout {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  .layout > div {
    margin-bottom: 20px;
  }

  .currentTemperatures {
    display: flex;
    flex-direction: row;
    align-items: center;
  }
  .currentTemperatures > div {
    margin: 0 20px;
    text-align: center;
  }
  .temperatureCircle {
    width: 118px;
    height: 118px;
    border-radius: 71px;
    border: 6px solid #000;
    font-size: 65px;
    color: #000;
    line-height: 118px;
    text-align: center;
    background: #fff;
    box-shadow: 0 0 0 2px #fff;
  }
  .lowHigh {
    line-height: 1em;
    text-transform: uppercase;
  }

  .conditionDetails {
    display: flex;
    flex-direction: row;
    align-items: center;
  }
  .conditionDetails > div {
    text-align: center;
    padding-left: 45px;
    padding-right: 30px;
  }
  .icon {
    position: relative;
  }
  .icon > img {
    -webkit-filter: invert(1);
    filter: invert(1);
    height: 50px;
    width: 50px;
    position: absolute;
    margin: -13px 0 0 -45px;
  }

  .suntimeContainer {
    padding-left: 7px;
  }
  .suntime {
    position: relative;
  }
  .suntime > img {
    position: absolute;
    height: 50px;
    width: 50px;
    top: -13px;
    left: -45px;
  }

  .alerts {
    text-align: left;
    width: 315px;
  }
  .alerts li {
    list-style-type: none;
    color: #f88;
    margin-bottom: 1em;
  }
  .alerts img {
    position: absolute;
    margin-left: -40px;
  }

  .chartContainer {
    position: relative;
    width: 270px;
    height: 150px;
    left: -20px;
  }
  .chartContainer .tempIcon {
    position: absolute;
    top: -12px;
    right: -45px;
    width: 50px;
    height: 50px;
  }
  .chartContainer .windIcon {
    position: absolute;
    top: 15px;
    right: -45px;
    width: 50px;
    height: 50px;
  }
  .chartContainer .precipIcon {
    position: absolute;
    top: 44px;
    right: -45px;
    width: 50px;
    height: 50px;
  }
  #chart {
    width: 270px;
    height: 150px;
  }

  .forecastSummary {
    width: 315px;
  }
  .forecastSummaryTitle {
    text-transform: uppercase;
    text-align: left;
    font-weight: bold;
    color: #fff;
  }
  .forecastSummaryText {
    font-size: 20px;
    text-align: left;
    line-height: 1.5em;
  }

  .weekly {
    width: 315px;
  }
  .weekly td {
{'fraction_non_alphanumeric': 0.1278300941695051, 'fraction_numerical': 0.04628330995792426, 'mean_word_length': 2.1102803738317757, 'pattern_counts': {'":': 0, '<': 5, '<?xml version=': 0, '>': 15, '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': '5420970', 'n_tokens_mistral': 2085, 'n_tokens_neox': 1860, 'n_words': 442}