Herman Code-Block Styles

.code-block {
  align-items: stretch;
  display: flex;
  flex: 1 1 20em;
  flex-direction: column;
  max-height: tools.size('rhythm') * 12;
  max-width: 100%;
  overflow: hidden;
}

.code-header {
  @include tools.contrasted('theme-light');
  flex: 0 0 auto;
  padding: 0 tools.size('shim');
}

.code-description {
  @include tools.before(' – ');
}

.hljs-pre,
.text-block pre {
  background-color: tools.color('slight');
  border: 1px solid tools.color('callout');
  color: tools.color('code');
  flex: 1 1 auto;
  flex-wrap: wrap;

  code {
    padding: tools.size('shim');
  }
}

$hljs-colors: (
  'hljs-comment': #93a1a1,
  'hljs-green': #859900,
  'hljs-cyan': #2aa198,
  'hljs-blue': #268bd2,
  'hljs-yellow': #b58900,
  'hljs-orange': #cb4b16,
  'hljs-red': #dc322f,
  'hljs-formula': #eee8d5,
);