<commit_before>colorItemMargin = 2px
colorItemSize = 16px
colorItemsPerRow = 7


.ql-toolbar.ql-snow
  border: 1px solid borderColor
  box-sizing: border-box
  font-family: 'Helvetica Neue', 'Helvetica', 'Arial', sans-serif
  padding: 8px

  *
    box-sizing: border-box

  .ql-formats
    display: inline-block
    margin-right: 15px
    vertical-align: middle

  button:hover, button.ql-active,
  .ql-picker-label:hover, .ql-picker-label.ql-active,
  .ql-picker-item:hover, .ql-picker-item.ql-selected
    color: activeColor
    .ql-fill, .ql-stroke.ql-fill
      fill: activeColor
    .ql-stroke, .ql-stroke-mitter
      stroke: activeColor

  .ql-stroke
    stroke: inactiveColor
  .ql-stroke-mitter
    stroke: inactiveColor

  .ql-fill, .ql-stroke.ql-fill
    fill: inactiveColor

  .ql-direction
    svg:last-child
      display: none
  .ql-direction.ql-active
    svg:last-child
      display: inline
    svg:first-child
      display: none

  .ql-picker
    // background-color: yellow    // TODO remove
    color: inactiveColor
    display: inline-block
    float: left
    font-size: 14px
    font-weight: 500
    height: controlHeight
    position: relative
    vertical-align: middle
  .ql-picker-label
    border: 1px solid transparent
    cursor: pointer
    display: inline-block
    height: 100%
    padding-left: 8px
    padding-right: 2px
    position: relative
    width: 100%
    &::before
      display: inline-block
      line-height: 22px
    svg
      position: absolute
      height: 18px
      margin-top: -9px
      right: 0
      top: 50%
      width: 18px
  .ql-picker-options
    background-color: backgroundColor
    border: 1px solid transparent
    display: none
    min-width: 100%
    padding: 4px 8px
    position: absolute
    white-space: nowrap
    .ql-picker-item
      cursor: pointer
      display: block
      padding-bottom: 5px
      padding-top: 5px
  .ql-picker.ql-expanded
    .ql-picker-label
      border-color: borderColor
      color: borderColor
      z-index: 2
      .ql-fill
        fill: borderColor
      .ql-stroke
        stroke: borderColor
    .ql-picker-options
      border-color: borderColor
      box-shadow: rgba(0,0,0,0.2) 0 2px 8px
      display: block
      margin-top: -1px
      z-index: 1

  .ql-color-picker, .ql-icon-picker
    width: controlHeight + 4
    .ql-picker-label
      padding: 2px 4px
      svg
        right: 4px
  .ql-icon-picker
    .ql-picker-options
      padding: 4px 0px
    .ql-picker-item
      height: controlHeight
      padding: 2px 4px
  .ql-color-picker.ql-expanded, .ql-icon-picker.ql-expanded
    .ql-picker-options
      margin-top: -7px
  .ql-color-picker
    .ql-picker-options
      padding: inputPaddingHeight inputPaddingWidth
      width: (colorItemSize + 2*colorItemMargin) * colorItemsPerRow + 2*inputPaddingWidth + 2  // +2 for the border
    .ql-picker-item<commit_msg>better way to align<commit_after>colorItemMargin = 2px
colorItemSize = 16px
colorItemsPerRow = 7


.ql-toolbar.ql-snow
  border: 1px solid borderColor
  box-sizing: border-box
  font-family: 'Helvetica Neue', 'Helvetica', 'Arial', sans-serif
  padding: 8px

  *
    box-sizing: border-box

  .ql-formats
    display: inline-block
    margin-right: 15px
    vertical-align: middle

  button:hover, button.ql-active,
  .ql-picker-label:hover, .ql-picker-label.ql-active,
  .ql-picker-item:hover, .ql-picker-item.ql-selected
    color: activeColor
    .ql-fill, .ql-stroke.ql-fill
      fill: activeColor
    .ql-stroke, .ql-stroke-mitter
      stroke: activeColor

  .ql-stroke
    stroke: inactiveColor
  .ql-stroke-mitter
    stroke: inactiveColor

  .ql-fill, .ql-stroke.ql-fill
    fill: inactiveColor

  .ql-direction
    svg:last-child
      display: none
  .ql-direction.ql-active
    svg:last-child
      display: inline
    svg:first-child
      display: none

  .ql-picker
    // background-color: yellow    // TODO remove
    color: inactiveColor
    display: inline-block
    float: left
    font-size: 14px
    font-weight: 500
    height: controlHeight
    position: relative
    vertical-align: middle
  .ql-picker-label
    border: 1px solid transparent
    cursor: pointer
    display: inline-block
    height: 100%
    padding-left: 8px
    padding-right: 2px
    position: relative
    width: 100%
    &::before
      display: inline-block
      line-height: 22px
    svg
      position: absolute
      height: 18px
      margin-top: -9px
      right: 0
      top: 50%
      width: 18px
  .ql-picker-options
    background-color: backgroundColor
    border: 1px solid transparent
    display: none
    min-width: 100%
    padding: 4px 8px
    position: absolute
    white-space: nowrap
    .ql-picker-item
      cursor: pointer
      display: block
      padding-bottom: 5px
      padding-top: 5px
  .ql-picker.ql-expanded
    .ql-picker-label
      border-color: borderColor
      color: borderColor
      z-index: 2
      .ql-fill
        fill: borderColor
      .ql-stroke
        stroke: borderColor
    .ql-picker-options
      border-color: borderColor
      box-shadow: rgba(0,0,0,0.2) 0 2px 8px
      display: block
      margin-top: -1px
      top: 100%
      z-index: 1

  .ql-color-picker, .ql-icon-picker
    width: controlHeight + 4
    .ql-picker-label
      padding: 2px 4px
      svg
        right: 4px
  .ql-icon-picker
    .ql-picker-options
      padding: 4px 0px
    .ql-picker-item
      height: controlHeight
      padding: 2px 4px
  .ql-color-picker
    .ql-picker-options
      padding: inputPaddingHeight inputPaddingWidth
      width: (colorItemSize + 2*colorItemMargin) * colorItemsPerRow + 2*inputPaddingWidth + 2  // +2 for the border
    .ql-picker-item
{'fraction_non_alphanumeric': 0.09869809992962703, 'fraction_numerical': 0.02287121745249824, 'mean_word_length': 2.2485714285714287, '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': '6578166', 'n_tokens_mistral': 2012, 'n_tokens_neox': 1855, 'n_words': 447}