// *************************************
//
//   Split Pane
//   -> Splitted Markdown/Preview Panes
//
// -------------------------------------
//   Template (Haml)
// -------------------------------------
//
// .split[.split-editor]
// .split[.split-preview]
//
// *************************************

.split {
  overflow: scroll;
  padding: 0 !important;
  -webkit-overflow-scrolling: touch;

// -------------------------------------
//   Modifiers
// -------------------------------------

// .split--modifier

// -------------------------------------
//   States
// -------------------------------------

// .split.is-state

// -------------------------------------
//   Context
// -------------------------------------

// .has-split

// -------------------------------------
//   Scaffolding
// -------------------------------------

// .split-scaffolding

  &-editor {
    padding-left: 0;
    padding-right: 0;
    position: relative;
    z-index: map-get($z-index, editor);

    .show-preview & {
      display: none;
    }

    @include from('tablet') {
      border-right: 1px solid $c-border;
      float: left;
      padding-right: 16px;
      width: 50%;

      .show-preview & {
        display: block;
      }
    }
  }

  &-preview {
    background-color: #fff;
    display: none;
    top: 0;
    position: relative;
    z-index: map-get($z-index, preview);

    .show-preview & {
      display: block;
    }

    @include from('tablet') {
      display: block;
      float: right;
      position: relative;
      top: 0;
      width: 50%;
    }
  }
}