summaryrefslogtreecommitdiff
path: root/dashes
diff options
context:
space:
mode:
Diffstat (limited to 'dashes')
-rw-r--r--dashes/index.html128
1 files changed, 0 insertions, 128 deletions
diff --git a/dashes/index.html b/dashes/index.html
deleted file mode 100644
index 3eab393..0000000
--- a/dashes/index.html
+++ /dev/null
@@ -1,128 +0,0 @@
-<html>
- <head>
- <title>Dashes — EM dash, EN dash, hyphen, minus</title>
- <meta charset="UTF-8">
- <style type="text/css">
- * {
- padding: 0;
- margin: 0;
- }
-
- body {
- background-color: #142429;
- font-family: 'Futura';
- text-align: center;
- }
-
- h1 {
- color: #B65C2D;
- font-size: 50px;
- padding-top: 1.5em;
- }
-
- p.sentence {
- color: #999;
- font-size: 22px;
- padding: 0.5em;
- }
-
- p.example {
- color: #999;
- font-size: 72px;
- line-height: 70px;
- }
-
- p.how-to {
- color: #666;
- font-family: 'Courier';
- font-size: 14px;
- padding-bottom: 1em;
- }
-
- p.buttons {
- margin: 10px;
- }
-
- p.buttons a {
- padding: 8px;
- color: #ccc;
- text-decoration: none;
- }
-
- p.buttons a:hover, p.buttons a.current {
- text-shadow: 0 -1px 2px #000;
- color: #B65C2D;
- }
-
- span.use-on {
- display: none;
- }
-
- span.entity {
- display: inline;
- }
- </style>
- <script type="text/javascript">
- var showOnly = function(class_name) {
- var es = document.getElementsByClassName('use-on');
- var i = es.length;
-
- while (i--) {
- es[i].style.display = 'none';
- }
-
- var es = document.getElementsByClassName(class_name);
- var i = es.length;
-
- while (i--) {
- es[i].style.display = 'inline';
- }
- }
-
- </script>
- </head>
- <body>
-
- <p class="buttons">
- <a id="select-entity" href="javascript:showOnly('entity');return false;" onclick="showOnly('entity');">HTML</a>
- <a id="select-osx" href="javascript:showOnly('osx');return false;" onclick="showOnly('osx');">OS X</a>
- <a id="select-latex" href="javascript:showOnly('latex');return false;" onclick="showOnly('latex');">LaTeX</a>
- </p>
-
- <h1>EM Dash</h1>
- <p class="example">&#8212;</p>
- <p class="sentence">I believe I shall—no, I’m going to do it.</p>
- <p class="how-to">
- <span class="use-on entity">&amp;#8212;</span>
- <span class="use-on osx" title="shift option hyphen">&#x21e7;&#x2325;&#8208;</span>
- <span class="use-on latex">&#8208;&#8208;&#8208;</span>
- </p>
-
- <h1>EN Dash</h1>
- <p class="example">&#8211;</p>
- <p class="sentence">It will take 15–20 minutes.</p>
- <p class="how-to">
- <span class="use-on entity">&amp;#8212;</span>
- <span class="use-on osx" title="option hyphen">&#x2325;&#8208;</span>
- <span class="use-on latex">&#8208;&#8208;</span>
- </p>
-
- <h1>Hyphen</h1>
- <p class="example">&#8208;</p>
- <p class="sentence">Only use upper-case letters.</p>
- <p class="how-to">
- <span class="use-on entity">&amp;#8212;</span>
- <span class="use-on osx" title="hyphen">&#8208;</span>
- <span class="use-on latex">&#8208;</span>
- </p>
-
- <h1>Minus</h1>
- <p class="example">&#8722;</p>
- <p class="sentence">12 &#8722; 3 = 9</p>
- <p class="how-to">
- <span class="use-on entity">&amp;#8212;</span>
- <span class="use-on osx">no shortcut</span>
- <span class="use-on latex">$&#8208;$</span>
- </p>
- </body>
-</html>