<commit_before>/*
  App
 */
:root {
  --prompt-width: 50px;
}

#app {
  padding-top: 20px;
}

/*
  Globals
 */

pre
{
    font-size: 14px;
    line-height: 1.21429em;

    word-wrap: break-word;
}

body
{
    font-family: 'Source Sans Pro';
    font-size: 16px;
    line-height: 22px;
    background-color: var(--main-bg-color);
    color: var(--main-fg-color);
}

img
{
    display: block;
    max-width: 100%;

    margin-right: auto;
    margin-left: auto;
}

th,
td {
    padding: 0.5em 1em;
    border: 1px solid var(--primary-border);
}

/*
  Cell
 */

.draggable-cell {
    position: relative;
    padding: 10px;
}

.cell-drag-handle
{
    position: absolute;
    z-index: 999;
    width: var(--prompt-width);
    height: 100%;
    cursor: move;
}

.cell
{
    position: relative;
    background: var(--cell-bg);
    transition: all .1s ease-in-out;
}

.cell:hover
{
    box-shadow: 1px 1px 3px rgba(0,0,0,.12), -1px -1px 3px rgba(0,0,0,.12);
}

.cell.focused {
    box-shadow: 3px 3px 9px rgba(0,0,0,.12), -3px -3px 9px rgba(0,0,0,.12);
}

.cell:hover .input_area .cell_inputs,
.cell:active .input_area .cell_inputs
{
    background-color: var(--cell-bg-hover);
}


.cell:focus .input_area .cell_inputs,
.cell.focused .input_area .cell_inputs
{
    background-color: var(--cell-bg-focus);
}

.cell_toolbar-mask
{
    position: absolute;
    top: -37px;
    right: -5px;
    z-index: 99;
    height: 32px;

    /* Set the left padding to 50px to give users extra room to move their
    mouse to the toolbar without causing the cell to go out of focus and thus
    hide the toolbar before they get there. */
    padding: 5px 5px 0px 50px;
}

.cell_toolbar
{
    display: inline-box;
    background: var(--toolbar-bg);
    box-shadow: 0 1px 2px 0 rgba(0,0,0,.50);
}

.cell_toolbar button
{
    display: inline-block;

    width: 22px;
    height: 20px;
    padding: 2px 4px;

    text-align: center;

    border: none;
    outline: none;
    background: none;
}

.cell_toolbar button i
{
    font-size: 16px;
    line-height: 1;

    color: var(--toolbar-button);
}

.cell_toolbar button i:hover
{
    color: var(--toolbar-button-hover);
}

.cell_markdown.rendered
{
    padding: 10px 10px 10px var(--prompt-width);
}

.cell_markdown.unrendered .CodeMirror-lines
{
    padding-left: var(--prompt-width);
}

.pagers
{
    padding: 10px var(--prompt-width) 10px var(--prompt-width);
    background-color: var(--pager-bg);
    word-wrap: break-word;
}

.cell_display
{
    word-wrap: break-word;
    padding: 10px 10px 10px calc(var(--prompt-width) + 10px);
}

.cell_display:empty
{
    display:none;
}

.cell_code .input_area
{
    display: flex;
    flex-direction: row;
}

.cell_code .input_area .cell_inputs
{
    font-family: monospace;
    font-size: 12px;

    width: var(--prompt-width);
    padding: 9px 0;

    text-align: center;

    color: var(--input-color);
    background-color: var(--pager-bg);

    flex: 0 0 auto;
}

.cell_code .input_area .cell_editor
{
    flex: 1 1 auto;
}

.creator-hover-mask {
  display: block;
  position: relative;
  overflow: visible;
  height: 0px;
}

.creator-hover-region {
  display: flex;
  position: relative;
  overflow: visible;
  top: -30px;
  height: 60px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  pointer-events: none;
}

.creator-tool {
  display: inline-block;
  background: var(--main-bg-color);
  box-shadow: 0 1px 2px 0 rgba(0,0,0,.50);
  margin-top: -15px;
  pointer-events: all;
}

.creator-tool button
{
  display: inline-block;

  width: 22px;
  height: 20px;
  padding: 2px 4px;

  text-align: center;

  border: none;
  outline: none;
  background: none;
}

.creator-tool button i
{
  /* These icons are thin, use a larger font than the cell toolbar */
  font-size: 17px;
  line-height: 1;

  color: var(--toolbar-button);
}

.creator-tool button i:hover
{
  color: var(--toolbar-button-hover);
}

.creator-tool .creator-label {
  color: var(--toolbar-button);
  font-size: 12px;
  text-transform: uppercase;
  padding: 5px;
  vertical-align: text-bottom;
  font-weight: bold;
}

code {
  font-family: 'Source Code Pro';
  white-space: pre;
  font-size: 14px;
}

/*
    Codemirror
 */

.CodeMirror
{
    font-family: 'Source Code Pro';
    font-size: 14px;<commit_msg>Wrap code (text/plain) so it fits within a cell<commit_after>/*
  App
 */
:root {
  --prompt-width: 50px;
}

#app {
  padding-top: 20px;
}

/*
  Globals
 */

pre
{
    font-size: 14px;
    line-height: 1.21429em;

    word-wrap: break-word;
}

body
{
    font-family: 'Source Sans Pro';
    font-size: 16px;
    line-height: 22px;
    background-color: var(--main-bg-color);
    color: var(--main-fg-color);
}

img
{
    display: block;
    max-width: 100%;

    margin-right: auto;
    margin-left: auto;
}

th,
td {
    padding: 0.5em 1em;
    border: 1px solid var(--primary-border);
}

/*
  Cell
 */

.draggable-cell {
    position: relative;
    padding: 10px;
}

.cell-drag-handle
{
    position: absolute;
    z-index: 999;
    width: var(--prompt-width);
    height: 100%;
    cursor: move;
}

.cell
{
    position: relative;
    background: var(--cell-bg);
    transition: all .1s ease-in-out;
}

.cell:hover
{
    box-shadow: 1px 1px 3px rgba(0,0,0,.12), -1px -1px 3px rgba(0,0,0,.12);
}

.cell.focused {
    box-shadow: 3px 3px 9px rgba(0,0,0,.12), -3px -3px 9px rgba(0,0,0,.12);
}

.cell:hover .input_area .cell_inputs,
.cell:active .input_area .cell_inputs
{
    background-color: var(--cell-bg-hover);
}


.cell:focus .input_area .cell_inputs,
.cell.focused .input_area .cell_inputs
{
    background-color: var(--cell-bg-focus);
}

.cell_toolbar-mask
{
    position: absolute;
    top: -37px;
    right: -5px;
    z-index: 99;
    height: 32px;

    /* Set the left padding to 50px to give users extra room to move their
    mouse to the toolbar without causing the cell to go out of focus and thus
    hide the toolbar before they get there. */
    padding: 5px 5px 0px 50px;
}

.cell_toolbar
{
    display: inline-box;
    background: var(--toolbar-bg);
    box-shadow: 0 1px 2px 0 rgba(0,0,0,.50);
}

.cell_toolbar button
{
    display: inline-block;

    width: 22px;
    height: 20px;
    padding: 2px 4px;

    text-align: center;

    border: none;
    outline: none;
    background: none;
}

.cell_toolbar button i
{
    font-size: 16px;
    line-height: 1;

    color: var(--toolbar-button);
}

.cell_toolbar button i:hover
{
    color: var(--toolbar-button-hover);
}

.cell_markdown.rendered
{
    padding: 10px 10px 10px var(--prompt-width);
}

.cell_markdown.unrendered .CodeMirror-lines
{
    padding-left: var(--prompt-width);
}

.pagers
{
    padding: 10px var(--prompt-width) 10px var(--prompt-width);
    background-color: var(--pager-bg);
    word-wrap: break-word;
}

.cell_display
{
    word-wrap: break-word;
    padding: 10px 10px 10px calc(var(--prompt-width) + 10px);
}

.cell_display:empty
{
    display:none;
}

.cell_code .input_area
{
    display: flex;
    flex-direction: row;
}

.cell_code .input_area .cell_inputs
{
    font-family: monospace;
    font-size: 12px;

    width: var(--prompt-width);
    padding: 9px 0;

    text-align: center;

    color: var(--input-color);
    background-color: var(--pager-bg);

    flex: 0 0 auto;
}

.cell_code .input_area .cell_editor
{
    flex: 1 1 auto;
}

.creator-hover-mask {
  display: block;
  position: relative;
  overflow: visible;
  height: 0px;
}

.creator-hover-region {
  display: flex;
  position: relative;
  overflow: visible;
  top: -30px;
  height: 60px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  pointer-events: none;
}

.creator-tool {
  display: inline-block;
  background: var(--main-bg-color);
  box-shadow: 0 1px 2px 0 rgba(0,0,0,.50);
  margin-top: -15px;
  pointer-events: all;
}

.creator-tool button
{
  display: inline-block;

  width: 22px;
  height: 20px;
  padding: 2px 4px;

  text-align: center;

  border: none;
  outline: none;
  background: none;
}

.creator-tool button i
{
  /* These icons are thin, use a larger font than the cell toolbar */
  font-size: 17px;
  line-height: 1;

  color: var(--toolbar-button);
}

.creator-tool button i:hover
{
  color: var(--toolbar-button-hover);
}

.creator-tool .creator-label {
  color: var(--toolbar-button);
  font-size: 12px;
  text-transform: uppercase;
  padding: 5px;
  vertical-align: text-bottom;
  font-weight: bold;
}

code {
  font-family: 'Source Code Pro';
  white-space: pre-wrap;
  font-size: 14px;
}

/*
    Codemirror
 */

.CodeMirror
{
    font-family: 'Source Code Pro';
    font-size: 14px;
{'fraction_non_alphanumeric': 0.14952835681844648, 'fraction_numerical': 0.03586817281937813, 'mean_word_length': 2.732290308561495, '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': '3182555', 'n_tokens_mistral': 3639, 'n_tokens_neox': 3305, 'n_words': 787}