<commit_before>@import    grid
@import default
@import   reset
@import  mixins

$font-color: #222
$base-color: #06f
$light-text-color: #777

h1, h2, h3, h4
  font-weight: bold

h1
  @include adjust-font-size($h1-scale, 0.6, 0.4)
  font-weight: normal
h2
  @include adjust-font-size($h2-scale, 0.5, 0.5)
  font-weight: normal
h3
  @include adjust-font-size($h3-scale, 0.5, 0.5)
  font-weight: normal
h4
  @include adjust-font-size($h4-scale, 2, 0)

body
  font: ($base-font * 1.05) 'Georgia', serif
  color: $font-color

  line-height: $vertical-rhythm

#info a
  color: #ff3019
  position: relative
  
  &:hover
    color: darken(#ff3019, 10%)
  &:active
    color: #ff3019
    top: 1px
  &:visited
    color: #cf0404

#wrapper
  width: $width
  margin: 0 auto

#header
  position: relative
  z-index: 5000

  h1, h2
    display: inline
    margin: 0
    padding: 0

    vertical-align: baseline

  h2
    color: lightgrey
    font-size: small
    font-weight: normal

.buttons
  float: right

#main-canvas
  margin: -350px 136px 28px 136px

  -moz-transition: margin-top 0.8s ease-in-out
  -webkit-transition: margin-top 0.8s ease-in-out

#game
  #canvas-wrapper
    position: relative
  .rotate
    display: inline-block
    height: 80px
    width:  47px

    position: absolute
    bottom: 170px

    &.left
      background: transparent url('../img/arrows.png')   0px 0 no-repeat
      left:  40px
    &.right
      right: 40px
      background: transparent url('../img/arrows.png') -53px 0 no-repeat

.inserter
  position: absolute
  display: block
  background: transparent url('../img/drop.png') no-repeat

  width:  50px
  height: 50px

#selector
  width: 101px

  .rotate
    display: inline-block
    height: 80px
    width:  47px
    position: absolute
    &.left
      background: transparent url('../img/arrows.png')   0px 0 no-repeat
      left:  -36px
    &.right
      right: -36px
      background: transparent url('../img/arrows.png') -53px 0 no-repeat

#palette
  width: 100%
  height: 120px
  overflow-x: auto
  overflow-y: hidden

  white-space: nowrap
  text-align: left

  img
    margin: 0 $vertical-rhythm / 2

#info
  padding-top: $vertical-rhythm

  .how-to-play
    @include col(6)

  .whats-next
    @include prepend(1)
    @include col(6)

  .about
    @include prepend(1)
    @include col(6)
    @include last

.popup
  background: #ccc<commit_msg>Adding colored scroll bar<commit_after>@import    grid
@import default
@import   reset
@import  mixins

$font-color: #222
$base-color: #06f
$light-text-color: #777

h1, h2, h3, h4
  font-weight: bold

h1
  @include adjust-font-size($h1-scale, 0.6, 0.4)
  font-weight: normal
h2
  @include adjust-font-size($h2-scale, 0.5, 0.5)
  font-weight: normal
h3
  @include adjust-font-size($h3-scale, 0.5, 0.5)
  font-weight: normal
h4
  @include adjust-font-size($h4-scale, 2, 0)

body
  font: ($base-font * 1.05) 'Georgia', serif
  color: $font-color

  line-height: $vertical-rhythm

#info a
  color: #ff3019
  position: relative
  
  &:hover
    color: darken(#ff3019, 10%)
  &:active
    color: #ff3019
    top: 1px
  &:visited
    color: #cf0404

#wrapper
  width: $width
  margin: 0 auto

#header
  position: relative
  z-index: 5000

  h1, h2
    display: inline
    margin: 0
    padding: 0

    vertical-align: baseline

  h2
    color: lightgrey
    font-size: small
    font-weight: normal

.buttons
  float: right

#main-canvas
  margin: -350px 136px 28px 136px

  -moz-transition: margin-top 0.8s ease-in-out
  -webkit-transition: margin-top 0.8s ease-in-out

#game
  #canvas-wrapper
    position: relative
  .rotate
    display: inline-block
    height: 80px
    width:  47px

    position: absolute
    bottom: 170px

    &.left
      background: transparent url('../img/arrows.png')   0px 0 no-repeat
      left:  40px
    &.right
      right: 40px
      background: transparent url('../img/arrows.png') -53px 0 no-repeat

.inserter
  position: absolute
  display: block
  background: transparent url('../img/drop.png') no-repeat

  width:  50px
  height: 50px

#selector
  width: 101px

  .rotate
    display: inline-block
    height: 80px
    width:  47px
    position: absolute
    &.left
      background: transparent url('../img/arrows.png')   0px 0 no-repeat
      left:  -36px
    &.right
      right: -36px
      background: transparent url('../img/arrows.png') -53px 0 no-repeat

#palette
  width: 100%
  height: 120px
  overflow-x: auto
  overflow-y: hidden

  white-space: nowrap
  text-align: left

  img
    margin: 0 $vertical-rhythm / 2

  &::-webkit-scrollbar
    height: 8px

  &::-webkit-scrollbar-track
    background:           #e2e2e2
    webkit-border-radius: 10px
    border-radius:        10px
    -webkit-box-shadow:   inset 0 0 1px rgba(0,0,0,0.2)

  &::-webkit-scrollbar-thumb
    webkit-border-radius: 10px
    border-radius:        10px
    background:           #ff3019
    -webkit-box-shadow:   inset 0 0 6px rgba(0,0,0,0.5)

  &::-webkit-scrollbar-thumb:window-inactive
    background: rgba(255,0,0,0.4)

#info
  padding-top: $vertical-rhythm

  .how-to-play
    @include col(6)

  .whats-next
    @include prepend(1)
    @include col(6)

  .about
    @include prepend(1)
    @include col(6)
    @include last

.popup
  background: #ccc
{'fraction_non_alphanumeric': 0.12352493338408832, 'fraction_numerical': 0.056909021697754095, 'mean_word_length': 2.5627118644067797, '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': '769618', 'n_tokens_mistral': 2184, 'n_tokens_neox': 1943, 'n_words': 502}