
// @optional widgets/typography/code/code.scss
// @require core/reset/reset.scss

//SOURCE: http://prismjs.com/download.html?themes=prism&languages=markup+css+css-extras+clike+javascript

/* PRISM */

code[class*='language-'] {

  font-family: Consolas, Monaco, 'Andale Mono', monospace;
  direction: ltr;
  text-align: left;
  white-space: pre;
  word-spacing: normal;
  word-break: normal;
  line-height: 1.5;
  tab-size: 4;
  hyphens: none;
  flex: 1 1 auto;
  width: 100%;

  .token {

    &.comment,
    &.prolog,
    &.doctype,
    &.cdata {
      color: darken( $color-teal, 15 );
    }

    &.punctuation {
      color: darken( $color-gray, 15 );
    }

    &.property,
    &.tag,
    &.boolean,
    &.number,
    &.constant,
    &.symbol,
    &.deleted {
      color: darken( $color-pink, 15 );
    }

    &.selector,
    &.attr-name,
    &.string,
    &.char,
    &.builtin,
    &.inserted {
      color: darken( $color-green, 15 );
    }

    &.atrule,
    &.attr-value,
    &.keyword {
      color: darken( $color-blue, 15 );
    }

    &.function {
      color: darken( $color-red, 15 );
    }

    &.regex,
    &.important,
    &.variable {
      color: darken( $color-orange, 15 );
    }

    &.important {
      font-weight: bold;
    }

    &.entity {
      cursor: help;
    }

    &.operator,
    &.entity,
    &.url {
      color: darken( $color-teal, 15 );
      background: hsla(0, 0%, 100%, .5);
    }

  }

  .namespace {
  	opacity: .7;
  }

}
