_syntax.scss

/* ==========================================================================
   Syntax highlighting
   ========================================================================== */

div.highlighter-rouge,
figure.highlight {
  position: relative;
  margin-bottom: 1em;
  background: $base00;
  color: $base05;
  font-family: $monospace;
  font-size: $type-size-6;
  line-height: 1.8;
  border-radius: $border-radius;

  > pre,
  pre.highlight {
    margin: 0;
    padding: 1em;
  }
}

.highlight table {
  margin-bottom: 0;
  font-size: 1em;
  border: 0;

  td {
    padding: 0;
    width: calc(100% - 1em);
    border: 0;

    /* line numbers*/
    &.gutter,
    &.rouge-gutter {
      padding-right: 1em;
      width: 1em;
      color: $base04;
      border-right: 1px solid $base04;
      text-align: right;
    }

    /* code */
    &.code,
    &.rouge-code {
      padding-left: 1em;
    }
  }

  pre {
    margin: 0;
  }
}

.highlight pre {
  width: 100%;
}

.highlight .hll {
  background-color: $base06;
}
.highlight {
  .c {
    /* Comment */
    color: $base04;
  }
  .err {
    /* Error */
    color: $base08;
  }