Permalink
Browse files

Initial commit of the entire font set and sample files

Signed-off-by: J. Hogue <j@projectevolution.com>
  • Loading branch information...
1 parent 1aac798 commit d881bc8622c0840dae6a4fe3a6da3b094a2048a8 @jhogue committed Sep 12, 2012

Large diffs are not rendered by default.

Oops, something went wrong.
@@ -0,0 +1,363 @@
+<!doctype html>
+<html>
+<head>
+<title>Your Font/Glyphs</title>
+<link rel="stylesheet" href="style.css" />
+<style>
+ section, header, footer {display: block;}
+ body {
+ font-family: sans-serif;
+ color: #444;
+ line-height: 1.5;
+ font-size: 1em;
+ }
+ * {
+ -moz-box-sizing: border-box;
+ -webkit-box-sizing: border-box;
+ box-sizing: border-box;
+ margin: 0;
+ paddin: 0;
+ }
+ .glyph {
+ float: left;
+ text-align: center;
+ background: #eee;
+ padding: .75em;
+ margin: .75em 1.5em .75em 0;
+ width: 7em;
+ border-radius: .375em;
+ box-shadow: inset 0 0 0 1px #fff, 0 0 0 1px #ccc;
+ }
+ .glyph input {
+ width: 100%;
+ text-align: center;
+ font-family: consolas, monospace;
+ }
+ .glyph input, .mtm {
+ margin-top: .75em;
+ }
+ .w-main {
+ width: 80%;
+ }
+ .centered {
+ margin-left: auto;
+ margin-right: auto;
+ }
+ .fs1 {
+ font-size: 2em;
+ }
+ header {
+ margin: 2em 0;
+ padding-bottom: .5em;
+ color: #666;
+ box-shadow: 0 2px #eee;
+ }
+ header h1 {
+ font-size: 2em;
+ font-weight: normal;
+ }
+ .clearfix:before, .clearfix:after { content: ""; display: table; }
+ .clearfix:after, .clear { clear: both; }
+ footer {
+ margin-top: 2em;
+ padding: .5em 0;
+ box-shadow: 0 -2px #eee;
+ }
+ a, a:visited {
+ color: #B35047;
+ text-decoration: none;
+ }
+ a:hover, a:focus {color: #000;}
+ .box1 {
+ display: inline-block;
+ width: 15em;
+ padding: .25em .5em;
+ background: #eee;
+ margin: .5em 1em .5em 0;
+ }
+</style>
+</head>
+<body>
+ <div class="w-main centered">
+ <section class="mtm clearfix" id="glyphs">
+ <header>
+ <h1>Your font contains the following glyphs</h1>
+ <p>The generated SVG font can be imported back to <a href="http://icomoon.io/app">IcoMoon</a> for modification.</p>
+ </header>
+ <div class="glyph">
+ <div class="fs1" aria-hidden="true" data-icon="&#x21;"></div>
+ <input type="text" readonly="readonly" value="&amp;#x21;" />
+ </div>
+ <div class="glyph">
+ <div class="fs1" aria-hidden="true" data-icon="&#x22;"></div>
+ <input type="text" readonly="readonly" value="&amp;#x22;" />
+ </div>
+ <div class="glyph">
+ <div class="fs1" aria-hidden="true" data-icon="&#x23;"></div>
+ <input type="text" readonly="readonly" value="&amp;#x23;" />
+ </div>
+ <div class="glyph">
+ <div class="fs1" aria-hidden="true" data-icon="&#x24;"></div>
+ <input type="text" readonly="readonly" value="&amp;#x24;" />
+ </div>
+ <div class="glyph">
+ <div class="fs1" aria-hidden="true" data-icon="&#x25;"></div>
+ <input type="text" readonly="readonly" value="&amp;#x25;" />
+ </div>
+ <div class="glyph">
+ <div class="fs1" aria-hidden="true" data-icon="&#x26;"></div>
+ <input type="text" readonly="readonly" value="&amp;#x26;" />
+ </div>
+ <div class="glyph">
+ <div class="fs1" aria-hidden="true" data-icon="&#x27;"></div>
+ <input type="text" readonly="readonly" value="&amp;#x27;" />
+ </div>
+ <div class="glyph">
+ <div class="fs1" aria-hidden="true" data-icon="&#x28;"></div>
+ <input type="text" readonly="readonly" value="&amp;#x28;" />
+ </div>
+ <div class="glyph">
+ <div class="fs1" aria-hidden="true" data-icon="&#x29;"></div>
+ <input type="text" readonly="readonly" value="&amp;#x29;" />
+ </div>
+ <div class="glyph">
+ <div class="fs1" aria-hidden="true" data-icon="&#x2a;"></div>
+ <input type="text" readonly="readonly" value="&amp;#x2a;" />
+ </div>
+ <div class="glyph">
+ <div class="fs1" aria-hidden="true" data-icon="&#x2b;"></div>
+ <input type="text" readonly="readonly" value="&amp;#x2b;" />
+ </div>
+ <div class="glyph">
+ <div class="fs1" aria-hidden="true" data-icon="&#x2c;"></div>
+ <input type="text" readonly="readonly" value="&amp;#x2c;" />
+ </div>
+ <div class="glyph">
+ <div class="fs1" aria-hidden="true" data-icon="&#x2d;"></div>
+ <input type="text" readonly="readonly" value="&amp;#x2d;" />
+ </div>
+ <div class="glyph">
+ <div class="fs1" aria-hidden="true" data-icon="&#x2e;"></div>
+ <input type="text" readonly="readonly" value="&amp;#x2e;" />
+ </div>
+ <div class="glyph">
+ <div class="fs1" aria-hidden="true" data-icon="&#x2f;"></div>
+ <input type="text" readonly="readonly" value="&amp;#x2f;" />
+ </div>
+ <div class="glyph">
+ <div class="fs1" aria-hidden="true" data-icon="&#x30;"></div>
+ <input type="text" readonly="readonly" value="&amp;#x30;" />
+ </div>
+ <div class="glyph">
+ <div class="fs1" aria-hidden="true" data-icon="&#x31;"></div>
+ <input type="text" readonly="readonly" value="&amp;#x31;" />
+ </div>
+ <div class="glyph">
+ <div class="fs1" aria-hidden="true" data-icon="&#x32;"></div>
+ <input type="text" readonly="readonly" value="&amp;#x32;" />
+ </div>
+ <div class="glyph">
+ <div class="fs1" aria-hidden="true" data-icon="&#x33;"></div>
+ <input type="text" readonly="readonly" value="&amp;#x33;" />
+ </div>
+ <div class="glyph">
+ <div class="fs1" aria-hidden="true" data-icon="&#x34;"></div>
+ <input type="text" readonly="readonly" value="&amp;#x34;" />
+ </div>
+ <div class="glyph">
+ <div class="fs1" aria-hidden="true" data-icon="&#x35;"></div>
+ <input type="text" readonly="readonly" value="&amp;#x35;" />
+ </div>
+ <div class="glyph">
+ <div class="fs1" aria-hidden="true" data-icon="&#x36;"></div>
+ <input type="text" readonly="readonly" value="&amp;#x36;" />
+ </div>
+ <div class="glyph">
+ <div class="fs1" aria-hidden="true" data-icon="&#x37;"></div>
+ <input type="text" readonly="readonly" value="&amp;#x37;" />
+ </div>
+ <div class="glyph">
+ <div class="fs1" aria-hidden="true" data-icon="&#x38;"></div>
+ <input type="text" readonly="readonly" value="&amp;#x38;" />
+ </div>
+ <div class="glyph">
+ <div class="fs1" aria-hidden="true" data-icon="&#x39;"></div>
+ <input type="text" readonly="readonly" value="&amp;#x39;" />
+ </div>
+ <div class="glyph">
+ <div class="fs1" aria-hidden="true" data-icon="&#x3a;"></div>
+ <input type="text" readonly="readonly" value="&amp;#x3a;" />
+ </div>
+ <div class="glyph">
+ <div class="fs1" aria-hidden="true" data-icon="&#x3b;"></div>
+ <input type="text" readonly="readonly" value="&amp;#x3b;" />
+ </div>
+ <div class="glyph">
+ <div class="fs1" aria-hidden="true" data-icon="&#x3c;"></div>
+ <input type="text" readonly="readonly" value="&amp;#x3c;" />
+ </div>
+ <div class="glyph">
+ <div class="fs1" aria-hidden="true" data-icon="&#x3d;"></div>
+ <input type="text" readonly="readonly" value="&amp;#x3d;" />
+ </div>
+ <div class="glyph">
+ <div class="fs1" aria-hidden="true" data-icon="&#x3e;"></div>
+ <input type="text" readonly="readonly" value="&amp;#x3e;" />
+ </div>
+ <div class="glyph">
+ <div class="fs1" aria-hidden="true" data-icon="&#x3f;"></div>
+ <input type="text" readonly="readonly" value="&amp;#x3f;" />
+ </div>
+ <div class="glyph">
+ <div class="fs1" aria-hidden="true" data-icon="&#x40;"></div>
+ <input type="text" readonly="readonly" value="&amp;#x40;" />
+ </div>
+ </section>
+ <div class="clear"></div>
+ <section class="mtm clearfix" id="glyphs">
+ <header>
+ <h1>CSS Class Names</h1>
+ </header>
+ <span class="box1">
+ <span aria-hidden="true" class="icon-minute-00"></span>
+ &nbsp;icon-minute-00
+ </span>
+ <span class="box1">
+ <span aria-hidden="true" class="icon-minute-03"></span>
+ &nbsp;icon-minute-03
+ </span>
+ <span class="box1">
+ <span aria-hidden="true" class="icon-minute-06"></span>
+ &nbsp;icon-minute-06
+ </span>
+ <span class="box1">
+ <span aria-hidden="true" class="icon-minute-09"></span>
+ &nbsp;icon-minute-09
+ </span>
+ <span class="box1">
+ <span aria-hidden="true" class="icon-minute-12"></span>
+ &nbsp;icon-minute-12
+ </span>
+ <span class="box1">
+ <span aria-hidden="true" class="icon-minute-15"></span>
+ &nbsp;icon-minute-15
+ </span>
+ <span class="box1">
+ <span aria-hidden="true" class="icon-minute-18"></span>
+ &nbsp;icon-minute-18
+ </span>
+ <span class="box1">
+ <span aria-hidden="true" class="icon-minute-21"></span>
+ &nbsp;icon-minute-21
+ </span>
+ <span class="box1">
+ <span aria-hidden="true" class="icon-minute-24"></span>
+ &nbsp;icon-minute-24
+ </span>
+ <span class="box1">
+ <span aria-hidden="true" class="icon-minute-27"></span>
+ &nbsp;icon-minute-27
+ </span>
+ <span class="box1">
+ <span aria-hidden="true" class="icon-minute-30"></span>
+ &nbsp;icon-minute-30
+ </span>
+ <span class="box1">
+ <span aria-hidden="true" class="icon-minute-33"></span>
+ &nbsp;icon-minute-33
+ </span>
+ <span class="box1">
+ <span aria-hidden="true" class="icon-minute-36"></span>
+ &nbsp;icon-minute-36
+ </span>
+ <span class="box1">
+ <span aria-hidden="true" class="icon-minute-39"></span>
+ &nbsp;icon-minute-39
+ </span>
+ <span class="box1">
+ <span aria-hidden="true" class="icon-minute-42"></span>
+ &nbsp;icon-minute-42
+ </span>
+ <span class="box1">
+ <span aria-hidden="true" class="icon-minute-45"></span>
+ &nbsp;icon-minute-45
+ </span>
+ <span class="box1">
+ <span aria-hidden="true" class="icon-minute-48"></span>
+ &nbsp;icon-minute-48
+ </span>
+ <span class="box1">
+ <span aria-hidden="true" class="icon-minute-51"></span>
+ &nbsp;icon-minute-51
+ </span>
+ <span class="box1">
+ <span aria-hidden="true" class="icon-minute-54"></span>
+ &nbsp;icon-minute-54
+ </span>
+ <span class="box1">
+ <span aria-hidden="true" class="icon-minute-57"></span>
+ &nbsp;icon-minute-57
+ </span>
+ <span class="box1">
+ <span aria-hidden="true" class="icon-hour-12"></span>
+ &nbsp;icon-hour-12
+ </span>
+ <span class="box1">
+ <span aria-hidden="true" class="icon-hour-01"></span>
+ &nbsp;icon-hour-01
+ </span>
+ <span class="box1">
+ <span aria-hidden="true" class="icon-hour-02"></span>
+ &nbsp;icon-hour-02
+ </span>
+ <span class="box1">
+ <span aria-hidden="true" class="icon-hour-03"></span>
+ &nbsp;icon-hour-03
+ </span>
+ <span class="box1">
+ <span aria-hidden="true" class="icon-hour-04"></span>
+ &nbsp;icon-hour-04
+ </span>
+ <span class="box1">
+ <span aria-hidden="true" class="icon-hour-05"></span>
+ &nbsp;icon-hour-05
+ </span>
+ <span class="box1">
+ <span aria-hidden="true" class="icon-hour-06"></span>
+ &nbsp;icon-hour-06
+ </span>
+ <span class="box1">
+ <span aria-hidden="true" class="icon-hour-07"></span>
+ &nbsp;icon-hour-07
+ </span>
+ <span class="box1">
+ <span aria-hidden="true" class="icon-hour-08"></span>
+ &nbsp;icon-hour-08
+ </span>
+ <span class="box1">
+ <span aria-hidden="true" class="icon-hour-09"></span>
+ &nbsp;icon-hour-09
+ </span>
+ <span class="box1">
+ <span aria-hidden="true" class="icon-hour-10"></span>
+ &nbsp;icon-hour-10
+ </span>
+ <span class="box1">
+ <span aria-hidden="true" class="icon-hour-11"></span>
+ &nbsp;icon-hour-11
+ </span>
+ </section>
+ <footer>
+ <p>Generated by <a href="http://icomoon.io">IcoMoon.io</a></p>
+ </footer>
+ </div>
+ <script>
+ document.getElementById("glyphs").addEventListener("click", function(e) {
+ var target = e.target;
+ if (target.tagName === "INPUT") {
+ target.select();
+ }
+ });
+ </script>
+</body>
+</html>
Oops, something went wrong.

0 comments on commit d881bc8

Please sign in to comment.