Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Embed Theme Example
<div class="embed-nav group" id="embed-nav">
<ul>
<li>
<a id="html-link" href="#html-box">
HTML
</a>
</li>
<li>
<a id="css-link" href="#css-box">
CSS
</a>
</li>
<li>
<a id="js-link" href="#js-box">
JS
</a>
</li>
<li>
<a id="result-link" href="#result-box" class="active">
Result
</a>
</li>
</ul>
<div class="logo-wrap" id="edit-area">
<a target="_blank" href="<%= url_to_pen_view(@pen, 'pen') %>" title="Edit on CodePen">
Edit
<span class="on">on</span>[[[http://codepen.io/chriscoyier/pen/LfyGq]]]
</a>
</div>
</div>
.cp-embed-logo {
fill: #ccc;
}
.embed-nav {
background: linear-gradient(#666, black);
}
/*
Monokai style - ported by Luigi Maselli - http://grigio.org
*/
#output pre {
background-color: #263238;
}
hljs, #output code.cm-s-default {
display: block;
overflow-x: auto;
padding: 0;
background: #263238;
color: white;
font-family: Menlo, Monaco, "Andale Mono", "lucida console", "Courier New", monospace;
line-height: 1.45;
tab-size: 2;
-webkit-font-smoothing: auto;
-webkit-text-size-adjust: none;
position: relative;
border-radius: 2px;
margin: 0 0 1em;
}
#output .cm-tag,
.hljs-tag,
.hljs-tag .hljs-title,
.hljs-keyword,
.hljs-literal,
.hljs-strong,
.hljs-change,
.hljs-winutils,
.hljs-flow,
.nginx .hljs-title,
.tex .hljs-special {
color: #e91e63;
}
hljs {
color: #ddd;
}
hljs .hljs-constant,
.asciidoc .hljs-code,
.markdown .hljs-code {
color: #66d9ef;
}
.hljs-code,
.hljs-class .hljs-title,
.hljs-header {
color: white;
}
#output .cm-attribute,
.hljs-link_label,
.hljs-attribute,
.hljs-symbol,
.hljs-symbol .hljs-string,
.hljs-value,
.hljs-regexp {
color: #9fa8da;
}
#output .cm-string,
.hljs-link_url,
.hljs-tag .hljs-value,
.hljs-string,
.hljs-bullet,
.hljs-subst,
.hljs-title,
.hljs-emphasis,
.hljs-type,
.hljs-preprocessor,
.hljs-pragma,
.ruby .hljs-class .hljs-parent,
.hljs-built_in,
.django .hljs-template_tag,
.django .hljs-variable,
.smalltalk .hljs-class,
.hljs-javadoc,
.django .hljs-filter .hljs-argument,
.smalltalk .hljs-localvars,
.smalltalk .hljs-array,
.hljs-attr_selector,
.hljs-pseudo,
.hljs-addition,
.hljs-stream,
.hljs-envvar,
.apache .hljs-tag,
.apache .hljs-cbracket,
.tex .hljs-command,
.hljs-prompt,
.hljs-name {
color: #9ccc65;
}
#output .cm-comment,
.hljs-comment,
.hljs-annotation,
.smartquote,
.hljs-blockquote,
.hljs-horizontal_rule,
.hljs-decorator,
.hljs-pi,
.hljs-doctype,
.hljs-deletion,
.hljs-shebang,
.apache .hljs-sqbracket,
.tex .hljs-formula {
color: #75715e;
}
.hljs-keyword,
.hljs-literal,
.css .hljs-id,
.hljs-phpdoc,
.hljs-dartdoc,
.hljs-title,
.hljs-header,
.hljs-type,
.vbscript .hljs-built_in,
.rsl .hljs-built_in,
.smalltalk .hljs-class,
.diff .hljs-header,
.hljs-chunk,
.hljs-winutils,
.bash .hljs-variable,
.apache .hljs-tag,
.tex .hljs-special,
.hljs-request,
.hljs-status {
font-weight: bold;
}
.coffeescript .javascript,
.javascript .xml,
.tex .hljs-formula,
.xml .javascript,
.xml .vbscript,
.xml .css,
.xml .hljs-cdata {
opacity: 0.5;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.