syntax-highlighting
Version:
Syntax Highlighting Colorschemes for many applications
223 lines (199 loc) • 8.68 kB
HTML
<html>
<head>
<meta charset="utf-8">
<title>Colorscheme Duotones - DarkHeath</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="../../../assets/css/duotones-colorschemes/style-darkHeath.css">
<link rel="stylesheet" href="../../output/prism/duotone-darkheath.dark.css">
</head>
<body>
<header class="header"><h1><a href="http://atelierbram.github.io/syntax-highlighting/duotones/">Colorscheme DuoTones - <span class="small">DarkHeath</span></a></h1>
<p>Based on <a href="http://simurai.com/projects/2016/01/01/duotone-themes/">Duotone Themes</a> by <a href="http://simurai.com/">Simurai</a> for Atom.</p>
</header>
<nav class="nav container" id="nav">
<ul class="nav_list">
<li><a href="../dark-earth/">DarkEarth</a></li>
<li><a href="../dark-desert/">DarkDesert</a></li>
<li><a href="../dark-forest/">DarkForest</a></li>
<li><a href="../dark-park">DarkPark</a></li>
<li><a href="../dark-meadow">DarkMeadow</a></li>
<li><a href="../dark-sea/">DarkSea</a></li>
<li><a href="../dark-lake/">DarkLake</a></li>
<li><a href="../dark-pool/">DarkPool</a></li>
<li><a href="../dark-space/">DarkSpace</a></li>
<li><a href="../dark/">Dark</a></li>
<li class="current"><a href="#!">DarkHeath</a></li>
<li><a href="../dark-cave/">DarkCave</a></li>
</ul>
</nav>
<div class="cf wrap container">
<div class="row">
<h3 class="demo-tiles-header" id="demo-tilesHeader"><span class="demo-tiles-header-text" id="demo-tilesHeaderText" data-text-swap="- show 16">Colorscheme <b class="number-shades" id="numberShades" data-text-swap="- extended to 16 Shades" data-text-original="- original 7 Shades">- original 7 Shades</b></span></h3>
<div id="demoTiles" class="demo-tiles collapsed">
<div class="unit bg-base00 shade-original w-1v7"><span>base00</span></div>
<div class="unit bg-base01 shade-added hidden"> <span>base01</span></div>
<div class="unit bg-base02 shade-added hidden"> <span>base02</span></div>
<div class="unit bg-base03 shade-original w-1v7"><span>base03</span></div>
<div class="unit bg-base04 shade-added hidden"> <span>base04</span></div>
<div class="unit bg-base08 shade-added hidden"> <span>base08</span></div>
<div class="unit bg-base0f shade-added hidden"> <span>base0F</span></div>
<div class="unit bg-base0e shade-added hidden"> <span>base0E</span></div>
<div class="unit bg-base05 shade-original w-1v7"><span>base05</span></div>
<div class="unit bg-base06 shade-original w-1v7"> <span>base06</span></div>
<div class="unit bg-base07 shade-added hidden"><span>base07</span></div>
<div class="unit bg-base09 shade-original w-1v7"><span>base09</span></div>
<div class="unit bg-base0a shade-added hidden"> <span>base0A</span></div>
<div class="unit bg-base0d shade-added hidden"> <span>base0D</span></div>
<div class="unit bg-base0c shade-original w-1v7"><span>base0C</span></div>
<div class="unit bg-base0b shade-original w-1v7"><span>base0B</span></div>
</div>
<div class="col">
<h3>HTML</h3>
<pre class="language-markup"><code><!doctype html>
<html class="no-js" lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="x-ua-compatible" content="ie=edge">
<title>Demo</title>
<meta name="description" content="Demo">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="apple-touch-icon" href="apple-touch-icon.png">
<!-- Place favicon.ico in the root directory -->
<link rel="stylesheet" href="/normalize.css">
<link rel="stylesheet" href="/main.css"></code></pre>
</div>
<div class="col">
<h3>CSS</h3>
<pre class="language-css"><code>h1 {
font-size: 2em;
margin: 0.67em 0;
}
mark {
background: #ff0;
color: #000;
}
small {
font-size: 80% !important;
}</code></pre>
</div>
<div class="col">
<h3>Sass <small>scss</small></h3>
<pre class="language-scss"><code>.visuallyhidden {
// Hide only visually, but have it available for screen readers:
// http://snook.ca/archives/html_and_css/hiding-content-for-accessibility
border: 0;
clip: rect(0 0 0 0);
height: 1px;
margin: -1px;
overflow: hidden;
padding: 0;
position: absolute;
width: 1px;
}
.inner-wrap {
max-width: 50em;
margin: 0 auto;
padding-left: emCalc(24);
padding-right: emCalc(24);
}
@media only screen and (min-width: 550px) {
article {
ul {
list-style: circle;
}
ol {
list-style: decimal;
}
}
.inner-wrap {
padding-left: emCalc(48);
padding-right: emCalc(48);
}
}</code></pre>
</div>
<div class="col">
<h3>Javascript</h3>
<pre class="language-javascript"><code>/*! loadJS: load a JS file asynchronously. [c]2014 @scottjehl, Filament Group, Inc. (Based on http://goo.gl/REQGQ by Paul Irish). Licensed MIT */
(function( w ){
var loadJS = function( src, cb ){
"use strict";
var ref = w.document.getElementsByTagName( "script" )[ 0 ];
var script = w.document.createElement( "script" );
script.src = src;
script.async = true;
ref.parentNode.insertBefore( script, ref );
if (cb && typeof(cb) === "function") {
script.onload = cb;
}
return script;
};
// commonjs
if( typeof module !== "undefined" ){
module.exports = loadJS;
}
else {
w.loadJS = loadJS;
}
}( typeof global !== "undefined" ? global : this )); }</code></pre></div>
<div class="col">
<h3> </h3>
<pre class="language-javascript screenshot">
<code>
function foo(bar) {
var a = 42,
b = 'Prism';
return a + bar(b);
}</code></pre></div>
<div class="col">
<h3>PHP</h3>
<pre class="language-php">
<code><?php namespace App\Services;
use App\User;
use Validator;
use Illuminate\Contracts\Auth\Registrar as RegistrarContract;
class Registrar implements RegistrarContract {
/**
* Get a validator for an incoming registration request.
*
* @param array $data
* @return \Illuminate\Contracts\Validation\Validator
*/
public function validator(array $data)</code></pre></div>
<div class="col">
<h3>Ruby</h3>
<pre class="language-ruby">
<code>##
# Array ISO Test
assert('Array', '15.2.12') do
assert_equal(Class, Array.class)
end
assert('Array inclueded modules', '15.2.12.3') do
assert_true(Array.include?(Enumerable))
end
assert('Array.[]', '15.2.12.4.1') do
assert_equal([1, 2, 3], Array.[](1,2,3))
end</code></pre></div>
<div class="col">
<h3>Python</h3>
<pre class="language-python">
<code>class _BaseHTMLProcessor(sgmllib.SGMLParser):
elements_no_end_tag = ['area', 'base', 'basefont', 'br', 'col', 'frame', 'hr',
'img', 'input', 'isindex', 'link', 'meta', 'param']
_r_barebang = re.compile(r'<!((?!DOCTYPE|--|\[))', re.IGNORECASE)
_r_bareamp = re.compile("&(?!#\d ;|#x[0-9a-fA-F] ;|\w ;)")
_r_shorttag = re.compile(r'<([^<\s] ?)\s*/>')
def __init__(self, encoding):
self.encoding = encoding
if _debug: sys.stderr.write('entering BaseHTMLProcessor, encoding=%s\n' % self.encoding)
sgmllib.SGMLParser.__init__(self)</code></pre></div>
</div> <!-- /.row -->
</div><!-- \.cf wrap -->
<footer class="footer cf">
<small><a href="http://atelierbram.github.io/syntax-highlighting/duotones/">DuoTones - Colorschemes</a> By <a href="http://atelierbramdehaan.nl">Bram de Haan</a> - based on <a href="http://simurai.com/projects/2016/01/01/duotone-themes/">Duotone Themes</a> by <a href="http://simurai.com/">Simurai</a> for Atom.</small>
</footer>
<script src="http://cdnjs.cloudflare.com/ajax/libs/prism/0.0.1/prism.min.js"></script>
<script src="../../../assets/js/vendor/domready.min.js"></script>
<script src="../../../assets/js/app/colorscheme-demo.min.js"></script>
</body>
</html>