kmx.io/prism.js/prism-coy.css

• Show log

  Commit

• Hash : a0ec4bfc
  Author :
  Date : 2013-07-11T16:32:00
  

  lighter stripes; show basic box-shadow and discard lifted-shadow effect on pseudo elements because of overflow conflicts; rm html, body definitions

Download

• prism-coy.css

• /**
   * prism.js Coy theme for JavaScript, CoffeeScript, CSS and HTML
   * Based on https://github.com/tshedor/workshop-wp-theme (Example: http://workshop.kansan.com/category/sessions/basics or http://workshop.timshedor.com/category/sessions/basics);
   * @author Tim  Shedor
   */
  
  code[class*="language-"],
  pre[class*="language-"] {
    color: black;
    font-family: Consolas, Monaco, 'Andale Mono', monospace;
    direction: ltr;
    text-align: left;
    white-space: pre;
    word-spacing: normal;
  
    -moz-tab-size: 4;
    -o-tab-size: 4;
    tab-size: 4;
  
    -webkit-hyphens: none;
    -moz-hyphens: none;
    -ms-hyphens: none;
    hyphens: none;
  }
  
  /* Code blocks */
  pre[class*="language-"] {
    position:relative;
    padding: 1em;
    margin: .5em 0;
    -webkit-box-shadow: -1px 0px 0px 0px #358ccb, 0px 0px 0px 1px #dfdfdf;
    -moz-box-shadow: -1px 0px 0px 0px #358ccb, 0px 0px 0px 1px #dfdfdf;
    box-shadow: -1px 0px 0px 0px #358ccb, 0px 0px 0px 1px #dfdfdf;
    border-left: 10px solid #358ccb;
    background-color: #fdfdfd;
    background-image: -webkit-linear-gradient(transparent 50%, rgba(69, 142, 209, 0.04) 50%);
    background-image: -moz-linear-gradient(transparent 50%, rgba(69, 142, 209, 0.04) 50%);
    background-image: -ms-linear-gradient(transparent 50%, rgba(69, 142, 209, 0.04) 50%);
    background-image: -o-linear-gradient(transparent 50%, rgba(69, 142, 209, 0.04) 50%);
    background-image: linear-gradient(transparent 50%, rgba(69, 142, 209, 0.04) 50%);
    background-size: 3em 3em;
    background-origin:content-box;
    overflow:visible;
    max-height:30em;
  }
  
  code[class*="language"] {
    max-height:29em;
    display:block;
    overflow:scroll;
  }
  
  /* Margin bottom to accomodate shadow */
  :not(pre) > code[class*="language-"],
  pre[class*="language-"] {
    background-color:#fdfdfd;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    margin-bottom: 1em;
  }
  
  /* Inline code */
  :not(pre) > code[class*="language-"] {
    position:relative;
    padding: .2em;
    -webkit-border-radius: 0.3em;
    -moz-border-radius: 0.3em;
    -ms-border-radius: 0.3em;
    -o-border-radius: 0.3em;
    border-radius: 0.3em;
    color: #c92c2c;
    border: 1px solid rgba(0, 0, 0, 0.1);
  }
  
  pre[class*="language-"]:before,
  pre[class*="language-"]:after {
    content: '';
    z-index: -2;
    display:block;
    position: absolute;
    bottom: 0.75em;
    left: 0.18em;
    width: 40%;
    height: 20%;
    -webkit-box-shadow: 0px 13px 8px #979797;
    -moz-box-shadow: 0px 13px 8px #979797;
    box-shadow: 0px 13px 8px #979797;
    -webkit-transform: rotate(-2deg);
    -moz-transform: rotate(-2deg);
    -ms-transform: rotate(-2deg);
    -o-transform: rotate(-2deg);
    transform: rotate(-2deg);
  }
  
  :not(pre) > code[class*="language-"]:after,
  pre[class*="language-"]:after {
    right: 0.75em;
    left: auto;
    -webkit-transform: rotate(2deg);
    -moz-transform: rotate(2deg);
    -ms-transform: rotate(2deg);
    -o-transform: rotate(2deg);
    transform: rotate(2deg);
  }
  
  .token.comment,
  .token.block-comment,
  .token.prolog,
  .token.doctype,
  .token.cdata {
    color: #7D8B99;
  }
  
  .token.punctuation {
    color: #5F6364;
  }
  
  .token.property,
  .token.tag,
  .token.boolean,
  .token.number,
  .token.function-name {
    color: #c92c2c;
  }
  
  .token.selector,
  .token.attr-name,
  .token.string,
  .token.function {
    color: #2f9c0a;
  }
  
  .token.operator,
  .token.entity,
  .token.url {
    color: #a67f59;
    background: rgba(255, 255, 255, 0.5);
  }
  
  .token.atrule,
  .token.attr-value,
  .token.keyword,
  .token.class-name {
    color: #1990b8;
  }
  
  .token.regex,
  .token.important {
    color: #e90;
  }
  .language-css .token.string,
  .style .token.string {
    color: #a67f59;
    background: rgba(255, 255, 255, 0.5);
  }
  
  .token.important {
    font-weight: normal;
  }
  
  .token.entity {
    cursor: help;
  }
  
  .namespace {
    opacity: .7;
  }
  
  @media screen and (max-width:767px){
    pre[class*="language-"]:before,
    pre[class*="language-"]:after {
      bottom:14px;
      -webkit-box-shadow:none;
      -moz-box-shadow:none;
      box-shadow:none;
    }
  
  }
  
  /* Plugin styles */
  .token.tab:not(:empty):before,
  .token.cr:before,
  .token.lf:before {
    color: #e0d7d1;
  }

Download