Added examples page
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83
diff --git a/examples.html b/examples.html
new file mode 100644
index 0000000..cf19a12
--- /dev/null
+++ b/examples.html
@@ -0,0 +1,76 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+
+<meta charset="utf-8" />
+<title>Prism</title>
+<link rel="stylesheet" href="style.css" />
+<link rel="stylesheet" href="prism.css" data-noprefix />
+<script src="../prefixfree/prefixfree.min.js"></script>
+
+</head>
+<body>
+
+<header><div class="wrapper">
+ <div class="intro">
+ <h1><img src="logo.svg" alt="Prism" /></h1>
+
+ <p>
+ Prism is a new elegant, robust and lightweight syntax highlighter, built with modern web standards in mind.
+ It’s a spin-off project from the popular code playground <a href="http://dabblet.com">Dabblet</a> and is extensively tested there daily by thousands of users.
+ </p>
+ </div>
+
+ <h2>Examples</h2>
+ <p>The examples in this page serve a dual purpose: They act as unit tests, making it easy to spot bugs, and at the same time demonstrate what Prism can do, on simple and on edge cases.</p>
+</div></header>
+
+<section>
+ <h1>HTML</h1>
+
+ <h2>Empty tag</h2>
+ <pre class="prism"><code class="language-html"><p></p></code></pre>
+
+ <h2>Name-attribute pair</h2>
+ <pre class="prism"><code class="language-html"><p class="prism"></p></code></pre>
+
+ <h2>Name-attribute pair without quotes</h2>
+ <pre class="prism"><code class="language-html"><p class=prism></p></code></pre>
+
+ <h2>Attribute without value</h2>
+ <pre class="prism"><code class="language-html"><p data-foo></p></code></pre>
+</pre>
+</section>
+
+<section>
+ <h1>CSS</h1>
+
+ <h2>Empty rule</h2>
+ <pre class="prism"><code class="language-css">*{}</code></pre>
+ <pre class="prism"><code class="language-css">* {}</code></pre>
+ <pre class="prism"><code class="language-css">p {}</code></pre>
+
+ <h2>Simple rule</h2>
+ <pre class="prism"><code class="language-css">p { color: red; }</code></pre>
+</pre>
+</section>
+
+<section>
+ <h1>JavaScript</h1>
+
+ <h2>Variable assignment</h2>
+ <pre class="prism"><code class="language-javascript">var foo = "bar", baz = 5;</code></pre>
+
+ <h2>Operators</h2>
+ <pre class="prism"><code class="language-javascript">(1 + 2 * 3)/4 >= 3 && 4 < 5 || 6 > 7</code></pre>
+</pre>
+</section>
+
+<footer><div class="wrapper">
+ <p>Handcrafted with love, by Lea Verou</p>
+</div></footer>
+
+<script src="prism.js"></script>
+
+</body>
+</html>
\ No newline at end of file