@import datarepr
@import cards
@import light
@import dark


.repple-entry .CodeMirror
  height: auto

.repple-entry
  white-space: pre
  font-family: monospace

.repple-inputbox
  width: 100%


.repple-displaybanner, .repple-inbanner
    width: 1em;

.repple-container .repple-entry > *
    padding: 9px 0px 9px 4px

.repple-outbanner
    /* border-left: 0.2em solid #383;
    margin-left: 0.4em;
    margin-right: 0.4em;

.repple-errbanner
    /* border-left: 0.2em solid #f88;
    margin-left: 0.4em;
    margin-right: 0.4em;

.repple-in, .repple-out, .repple-err, .repple-inputline
  display: flex


.repple-result
    padding-left: 0.5em;
    border-left: 3px solid transparent;
    height: auto;


/* .repple-entry, .repple-inputbox
/*     margin-bottom: 2px;



.collapsed:before
  content: "...";

.collapsed > *
  display: none !important;

textarea.repple-replarea
  display: none

.repple-entry
  height: auto
  width: 100%
  line-height: 1


.repple-card-data
  display: none

.repple-container
  width: 100%
  /* border: 2px solid black
  overflow-y: hidden

.repple-repl-container
  padding: 10px
  .repple-repl, .repple-aside
    height: 500px
    overflow-y: auto
    box-sizing: border-box

.repple-repl-aside-container
  display: flex
  flex-direction: row
  justify-content: space-between
  padding: 10px
  .repple-repl, .repple-aside
    height: 500px
    width: 49%
    overflow-y: auto
    box-sizing: border-box

.repple-editor-container
  display: flex
  flex-direction: row
  justify-content: space-between
  padding: 10px
  .repple-editor, .repple-aside
    height: 500px
    width: 49%
    overflow-y: auto
    box-sizing: border-box

.repple-editor-repl-container
  display: flex
  flex-direction: row
  justify-content: space-between
  padding: 10px
  .repple-editor
    .CodeMirror
      height: 100%
  .repple-editor, .repple-repl
    height: 500px
    width: 49%
    overflow-y: auto
    box-sizing: border-box