@import 'graphiql.css'

.playground
  position absolute
  top 106px
  left 0
  right 0
  bottom 0
  display flex
  flex-direction row
  min-width 960px

.playground-schema
  min-width 400px
  width 36%
  border-right 1px solid #E0E0E0
  box-shadow 0 0 8px rgba(0, 0, 0, 0.15)
  position relative
  z-index 100
  .CodeMirror
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    font-size: 13px;
    font-family: 'Consolas', 'Inconsolata', 'Droid Sans Mono', 'Monaco', monospace;
    color: #141823;

  .cm-def
    &.called-function
      background rgba(219, 89, 76, .2)
      border-radius 1px
      box-shadow 0 0 0 3px rgba(219, 89, 76, .2)

.playground-graphiql
  flex 1
  height 100%