<commit_before>.chat {
  .flexy();
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: 100%;
  margin: auto;
  pointer-events: none;
  overflow: hidden;
  user-select: none;
}
.chat-offset {
  flex: 1;
  position: relative;
}
.chat-window {
  .size_of(chat; width);
  .flexy(stretch; flex-end; column);
  position: relative;
  min-width: @tile;
  max-width: calc(~"100% -" @tile);
  height: 100%;
  top: 0;   //
  right: 0; // needed for closing animation
  margin: auto;
  pointer-events: auto;
  user-select: auto;
  border-left: 1px solid @color_chat_border;
  transform-origin: right;
  &.closed {
    position: absolute;
    opacity: 0;
    transform: translate(100%);
  }
}
.chat-log {
  .flexy(column; flex-end);
  flex: 1;
}
.chat-messages {
  .scrollbar_inner();
  position: relative;
  padding: 1em 0;
  overflow-y: auto;
  user-select: none; // so you only select text and not entire chat menu
  span {
    user-select: auto; // so you only select text and not entire chat menu
    white-space: pre-wrap; // honors new line (shift + enter)
    word-break: break-word;
    &:empty {
      &:after {
        content: " ";
      }
    }
  }
}
.chat-box {
  position: relative;
  border-top: 1px solid @color_chat_border;
}
.chat-input {
  .scrollbar_inner();
  width: 100%;
  min-height: @tile;
  max-height: @tile_xl;
  padding: 1.25em 1em;
  background: none;
  border: none;
  outline: 0;
  overflow-y: auto;
  resize: none;
  &:focus,
  &:valid {
    ~ .chat-placeholder {
      visibility: hidden;
    }
    ~ .chat-teach-enter {
      transform: translate3d(0, -2em, 0);
      background-size: 100% .25em;
    }
  }
  ~ .chat-typing-notice {
    font-size: @font_size_small;
    transform: translate3d(0, -2em, 0);
    background-size: 100% .25em;
    &:before {
      content: attr(data-typing-notice);
    }
  }
  &:focus {
    ~ .chat-teach-enter {
      color: @color_select;
      &:before {
        content: attr(data-step-2);
      }
    }
  }
  &:valid {
    ~ .chat-teach-enter {
      &:before {
        content: attr(data-step-3);
      }
    }
  }
  &:not(:focus) {
    &:valid {
      ~ .chat-teach-enter {
        color: @red;
        &:before {
          content: attr(data-remind);
        }
      }
    }
  }
}
.chat-placeholder,
.chat-teach-enter,
.chat-typing-notice  {
  position: absolute;
  top: 0;
  left: 0;
  margin: 1.25em .75em;
  padding: 0 .25em;
  pointer-events: none;
  user-select: none;
  &:before {
    transition: opacity @run_fast @run @bezier_fadein;
  }
  &:after {
    display: none;
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: .125em;
    height: 100%;
    background: @color_menu_faint;
    animation: in-fade @run_slower @run backwards;
  }
}
.chat-placeholder {
  color: fade(@white, (100 * @opacity_darker_dark));
  &:before {
    content: attr(data-before);
  }
}
.chat-teach-enter {
  .gradient(to bottom, @dye_inner, @dye_inner);
  color: @gray;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 0% .25em;
  transition+: color @run @bezier_deform;
  transition+: background @run_slow @bezier_deform;
  transition+: transform @run @bezier_deform;
  &:before {
    content: attr(data-step-1);
  }
}
.chat-typing-notice {
  .gradient(to bottom, @dye_inner, @dye_inner);
  color: @gray;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 0% .25em;
  transition+: color @run @bezier_deform;
  transition+: background @run_slow @bezier_deform;
  transition+: transform @run @bezier_deform;
}
.chat-date {
  padding-top: (@tile / 4);
  &.divider-small {
    color: fade(@white, (100 * @opacity_darker_dark));
    line-height: 1;
    user-select: auto;
    &:before,
    &:after {
      height: 1px;
    }
  }
}
.chat-message {
  padding: 0 (@tile / 4);
  &:not(:first-child) {
    .message-head {
      margin-top: (@tile / 4);
    }
  }
}
.message-head {
  .flexy(center);
  color: white;
}
.message-avatar {
  flex: 0 0 auto;
  animation: in-fade @run_fast @run_fast backwards;
  .iconpile {
    height: .75em;
    width: .75em;
    [class|="stroke"] {<commit_msg>fix date of past msgs not showing up in menu view of chat<commit_after>.chat {
  .flexy();
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: 100%;
  margin: auto;
  pointer-events: none;
  overflow: hidden;
  user-select: none;
}
.chat-offset {
  flex: 1;
  position: relative;
}
.chat-window {
  .size_of(chat; width);
  .flexy(stretch; flex-end; column);
  position: relative;
  min-width: @tile;
  max-width: calc(~"100% -" @tile);
  height: 100%;
  top: 0;   //
  right: 0; // needed for closing animation
  margin: auto;
  pointer-events: auto;
  user-select: auto;
  border-left: 1px solid @color_chat_border;
  transform-origin: right;
  &.closed {
    position: absolute;
    opacity: 0;
    transform: translate(100%);
  }
}
.chat-log {
  .flexy(column; flex-end);
  flex: 1;
}
.chat-messages {
  .scrollbar_inner();
  position: relative;
  padding: 1em 0;
  overflow-y: auto;
  user-select: none; // so you only select text and not entire chat menu
  span {
    user-select: auto; // so you only select text and not entire chat menu
    white-space: pre-wrap; // honors new line (shift + enter)
    word-break: break-word;
    &:empty {
      &:after {
        content: " ";
      }
    }
  }
}
.chat-box {
  position: relative;
  border-top: 1px solid @color_chat_border;
}
.chat-input {
  .scrollbar_inner();
  width: 100%;
  min-height: @tile;
  max-height: @tile_xl;
  padding: 1.25em 1em;
  background: none;
  border: none;
  outline: 0;
  overflow-y: auto;
  resize: none;
  &:focus,
  &:valid {
    ~ .chat-placeholder {
      visibility: hidden;
    }
    ~ .chat-teach-enter {
      transform: translate3d(0, -2em, 0);
      background-size: 100% .25em;
    }
  }
  ~ .chat-typing-notice {
    font-size: @font_size_small;
    transform: translate3d(0, -2em, 0);
    background-size: 100% .25em;
    &:before {
      content: attr(data-typing-notice);
    }
  }
  &:focus {
    ~ .chat-teach-enter {
      color: @color_select;
      &:before {
        content: attr(data-step-2);
      }
    }
  }
  &:valid {
    ~ .chat-teach-enter {
      &:before {
        content: attr(data-step-3);
      }
    }
  }
  &:not(:focus) {
    &:valid {
      ~ .chat-teach-enter {
        color: @red;
        &:before {
          content: attr(data-remind);
        }
      }
    }
  }
}
.chat-placeholder,
.chat-teach-enter,
.chat-typing-notice  {
  position: absolute;
  top: 0;
  left: 0;
  margin: 1.25em .75em;
  padding: 0 .25em;
  pointer-events: none;
  user-select: none;
  &:before {
    transition: opacity @run_fast @run @bezier_fadein;
  }
  &:after {
    display: none;
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: .125em;
    height: 100%;
    background: @color_menu_faint;
    animation: in-fade @run_slower @run backwards;
  }
}
.chat-placeholder {
  color: fade(@white, (100 * @opacity_darker_dark));
  &:before {
    content: attr(data-before);
  }
}
.chat-teach-enter {
  .gradient(to bottom, @dye_inner, @dye_inner);
  color: @gray;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 0% .25em;
  transition+: color @run @bezier_deform;
  transition+: background @run_slow @bezier_deform;
  transition+: transform @run @bezier_deform;
  &:before {
    content: attr(data-step-1);
  }
}
.chat-typing-notice {
  .gradient(to bottom, @dye_inner, @dye_inner);
  color: @gray;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 0% .25em;
  transition+: color @run @bezier_deform;
  transition+: background @run_slow @bezier_deform;
  transition+: transform @run @bezier_deform;
}
.chat-date {
  padding-top: (@tile / 4);
  &.divider-small {
    color: @color_chat_border;
    line-height: 1;
    user-select: auto;
    &:before,
    &:after {
      height: 1px;
    }
  }
}
.chat-message {
  padding: 0 (@tile / 4);
  &:not(:first-child) {
    .message-head {
      margin-top: (@tile / 4);
    }
  }
}
.message-head {
  .flexy(center);
  color: white;
}
.message-avatar {
  flex: 0 0 auto;
  animation: in-fade @run_fast @run_fast backwards;
  .iconpile {
    height: .75em;
    width: .75em;
    [class|="stroke"] {
{'fraction_non_alphanumeric': 0.15583013435700577, 'fraction_numerical': 0.023392514395393475, 'mean_word_length': 2.6184895833333335, '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': '1677894', 'n_tokens_mistral': 3322, 'n_tokens_neox': 3153, 'n_words': 714}