event-timeline/app/static/timeline/css/icons/icons.html
2021-11-12 18:21:51 +00:00

1117 lines
No EOL
38 KiB
HTML
Executable file

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>IcoMoon Demo</title>
<meta name="description" content="An Icon Font Generated By IcoMoon.io">
<meta name="viewport" content="width=device-width">
<style>
body {
padding: 0;
margin: 0;
font-family: sans-serif;
font-size: 1em;
line-height: 1.5;
color: #555;
background: #fff;
}
h1 {
font-size: 1.5em;
font-weight: normal;
}
small {
font-size: .66666667em;
}
a {
color: #e74c3c;
text-decoration: none;
}
a:hover, a:focus {
box-shadow: 0 1px #e74c3c;
}
.bshadow0, input {
box-shadow: inset 0 -2px #e7e7e7;
}
input:hover {
box-shadow: inset 0 -2px #ccc;
}
input, fieldset {
font-size: 1em;
margin: 0;
padding: 0;
border: 0;
}
input {
color: inherit;
line-height: 1.5;
height: 1.5em;
padding: .25em 0;
}
input:focus {
outline: none;
box-shadow: inset 0 -2px #449fdb;
}
.glyph {
font-size: 16px;
width: 15em;
padding-bottom: 1em;
margin-right: 4em;
margin-bottom: 1em;
float: left;
overflow: hidden;
}
.liga {
width: 80%;
width: calc(100% - 2.5em);
}
.talign-right {
text-align: right;
}
.talign-center {
text-align: center;
}
.bgc1 {
background: #f1f1f1;
}
.fgc1 {
color: #999;
}
.fgc0 {
color: #000;
}
p {
margin-top: 1em;
margin-bottom: 1em;
}
.mvm {
margin-top: .75em;
margin-bottom: .75em;
}
.mtn {
margin-top: 0;
}
.mtl, .mal {
margin-top: 1.5em;
}
.mbl, .mal {
margin-bottom: 1.5em;
}
.mal, .mhl {
margin-left: 1.5em;
margin-right: 1.5em;
}
.mhmm {
margin-left: 1em;
margin-right: 1em;
}
.mls {
margin-left: .25em;
}
.ptl {
padding-top: 1.5em;
}
.pbs, .pvs {
padding-bottom: .25em;
}
.pvs, .pts {
padding-top: .25em;
}
.clearfix {
zoom: 1;
}
.unit {
float: left;
}
.unitRight {
float: right;
}
.size1of2 {
width: 50%;
}
.size1of1 {
width: 100%;
}
.clearfix:before, .clearfix:after {
content: " ";
display: table;
}
.clearfix:after {
clear: both;
}
.noLiga-true {
display: none;
}
.textbox0 {
width: 3em;
background: #f1f1f1;
padding: .25em .5em;
line-height: 1.5;
height: 1.5em;
}
#testDrive {
padding-top: 24px;
}
.fs0 {
font-size: 16px;
}
.fs1 {
font-size: 32px;
}
.fs2 {
font-size: 32px;
}
.fs3 {
font-size: 32px;
}
.fs4 {
font-size: 32px;
}
@font-face {
font-family: 'tl-icons';
src:url('fonts/tl-icons.eot');
src:url('fonts/tl-icons.eot?#iefix') format('embedded-opentype'),
url('fonts/tl-icons.ttf') format('truetype'),
url('fonts/tl-icons.woff') format('woff'),
url('fonts/tl-icons.svg#tl-icons') format('svg');
font-weight: normal;
font-style: normal;
}
[class^="tl-icon-"], [class*=" tl-icon-"] {
font-family: 'tl-icons';
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
/* Better Font Rendering =========== */
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.tl-icon-vine:before {
content: "\e64d";
}
.tl-icon-wikipedia:before {
content: "\e64e";
}
.tl-icon-chevron-right:before {
content: "\e64f";
}
.tl-icon-chevron-left:before {
content: "\e650";
}
.tl-icon-youtube:before {
content: "\e651";
}
.tl-icon-foursquare:before {
content: "\e652";
}
.tl-icon-camera-retro:before {
content: "\e653";
}
.tl-icon-doc:before {
content: "\e654";
}
.tl-icon-weibo:before {
content: "\e655";
}
.tl-icon-resize-horizontal:before {
content: "\e656";
}
.tl-icon-resize-vertical:before {
content: "\e657";
}
.tl-icon-resize-full:before {
content: "\e658";
}
.tl-icon-resize-small:before {
content: "\e659";
}
.tl-icon-twitter:before {
content: "\e62b";
}
.tl-icon-google-plus:before {
content: "\e62c";
}
.tl-icon-video:before {
content: "\e62d";
}
.tl-icon-plaintext:before {
content: "\e62e";
}
.tl-icon-image-v2:before {
content: "\e62f";
}
.tl-icon-quote-v2:before {
content: "\e630";
}
.tl-icon-zoom-in:before {
content: "\e631";
}
.tl-icon-zoom-out:before {
content: "\e632";
}
.tl-icon-list:before {
content: "\e633";
}
.tl-icon-music:before {
content: "\e634";
}
.tl-icon-location:before {
content: "\e635";
}
.tl-icon-web:before {
content: "\e636";
}
.tl-icon-share-v2:before {
content: "\e637";
}
.tl-icon-soundcloud:before {
content: "\e639";
}
.tl-icon-video-v2:before {
content: "\e63a";
}
.tl-icon-tumblr:before {
content: "\e63b";
}
.tl-icon-lastfm:before {
content: "\e63c";
}
.tl-icon-github:before {
content: "\e63d";
}
.tl-icon-goback:before {
content: "\e63e";
}
.tl-icon-doc-v2:before {
content: "\e63f";
}
.tl-icon-googledrive:before {
content: "\e640";
}
.tl-icon-facebook:before {
content: "\e641";
}
.tl-icon-flickr:before {
content: "\e642";
}
.tl-icon-dribbble:before {
content: "\e643";
}
.tl-icon-image:before {
content: "\e605";
}
.tl-icon-vimeo:before {
content: "\e606";
}
.tl-icon-instagram:before {
content: "\e644";
}
.tl-icon-pinterest:before {
content: "\e645";
}
.tl-icon-arrow-left:before {
content: "\e646";
}
.tl-icon-arrow-down:before {
content: "\e647";
}
.tl-icon-arrow-up:before {
content: "\e648";
}
.tl-icon-arrow-right:before {
content: "\e649";
}
.tl-icon-share:before {
content: "\e64a";
}
.tl-icon-quote:before {
content: "\e64b";
}
.tl-icon-evernote:before {
content: "\e64c";
}
.tl-icon-mappin:before {
content: "\e600";
}
.tl-icon-swipe-right:before {
content: "\e601";
}
.tl-icon-swipe-left:before {
content: "\e602";
}
.tl-icon-touch-spread:before {
content: "\e603";
}
.tl-icon-touch-pinch:before {
content: "\e604";
}
</style>
</head>
<body>
<div class="bgc1 clearfix">
<h1 class="mhmm mvm"><span class="fgc1">Font Name:</span> tl-icons <small class="fgc1">(Glyphs:&nbsp;53)</small></h1>
</div>
<div class="clearfix mhl ptl">
<h1 class="mvm mtn bshadow fgc1">Grid Size: 14</h1>
<div class="glyph fs1">
<div class="clearfix bshadow0 pbs">
<span class="tl-icon-vine"></span><span class="mls"> icon-vine</span>
</div>
<fieldset class="fs0 size1of1 clearfix">
<input type="text" readonly value="e64d" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xe64d;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix noLiga-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="" class="liga unitRight" />
</div>
</div>
<div class="glyph fs1">
<div class="clearfix bshadow0 pbs">
<span class="tl-icon-wikipedia"></span><span class="mls"> icon-wikipedia</span>
</div>
<fieldset class="fs0 size1of1 clearfix">
<input type="text" readonly value="e64e" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xe64e;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix noLiga-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="" class="liga unitRight" />
</div>
</div>
<div class="glyph fs1">
<div class="clearfix bshadow0 pbs">
<span class="tl-icon-chevron-right"></span><span class="mls"> icon-chevron-right</span>
</div>
<fieldset class="fs0 size1of1 clearfix">
<input type="text" readonly value="e64f" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xe64f;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix noLiga-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="" class="liga unitRight" />
</div>
</div>
<div class="glyph fs1">
<div class="clearfix bshadow0 pbs">
<span class="tl-icon-chevron-left"></span><span class="mls"> icon-chevron-left</span>
</div>
<fieldset class="fs0 size1of1 clearfix">
<input type="text" readonly value="e650" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xe650;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix noLiga-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="" class="liga unitRight" />
</div>
</div>
<div class="glyph fs1">
<div class="clearfix bshadow0 pbs">
<span class="tl-icon-youtube"></span><span class="mls"> icon-youtube</span>
</div>
<fieldset class="fs0 size1of1 clearfix">
<input type="text" readonly value="e651" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xe651;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix noLiga-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="" class="liga unitRight" />
</div>
</div>
<div class="glyph fs1">
<div class="clearfix bshadow0 pbs">
<span class="tl-icon-foursquare"></span><span class="mls"> icon-foursquare</span>
</div>
<fieldset class="fs0 size1of1 clearfix">
<input type="text" readonly value="e652" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xe652;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix noLiga-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="" class="liga unitRight" />
</div>
</div>
<div class="glyph fs1">
<div class="clearfix bshadow0 pbs">
<span class="tl-icon-camera-retro"></span><span class="mls"> icon-camera-retro</span>
</div>
<fieldset class="fs0 size1of1 clearfix">
<input type="text" readonly value="e653" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xe653;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix noLiga-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="" class="liga unitRight" />
</div>
</div>
<div class="glyph fs1">
<div class="clearfix bshadow0 pbs">
<span class="tl-icon-doc"></span><span class="mls"> icon-doc</span>
</div>
<fieldset class="fs0 size1of1 clearfix">
<input type="text" readonly value="e654" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xe654;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix noLiga-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="" class="liga unitRight" />
</div>
</div>
<div class="glyph fs1">
<div class="clearfix bshadow0 pbs">
<span class="tl-icon-weibo"></span><span class="mls"> icon-weibo</span>
</div>
<fieldset class="fs0 size1of1 clearfix">
<input type="text" readonly value="e655" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xe655;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix noLiga-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="" class="liga unitRight" />
</div>
</div>
<div class="glyph fs1">
<div class="clearfix bshadow0 pbs">
<span class="tl-icon-resize-horizontal"></span><span class="mls"> icon-resize-horizontal</span>
</div>
<fieldset class="fs0 size1of1 clearfix">
<input type="text" readonly value="e656" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xe656;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix noLiga-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="" class="liga unitRight" />
</div>
</div>
<div class="glyph fs1">
<div class="clearfix bshadow0 pbs">
<span class="tl-icon-resize-vertical"></span><span class="mls"> icon-resize-vertical</span>
</div>
<fieldset class="fs0 size1of1 clearfix">
<input type="text" readonly value="e657" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xe657;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix noLiga-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="" class="liga unitRight" />
</div>
</div>
<div class="glyph fs1">
<div class="clearfix bshadow0 pbs">
<span class="tl-icon-resize-full"></span><span class="mls"> icon-resize-full</span>
</div>
<fieldset class="fs0 size1of1 clearfix">
<input type="text" readonly value="e658" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xe658;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix noLiga-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="" class="liga unitRight" />
</div>
</div>
<div class="glyph fs1">
<div class="clearfix bshadow0 pbs">
<span class="tl-icon-resize-small"></span><span class="mls"> icon-resize-small</span>
</div>
<fieldset class="fs0 size1of1 clearfix">
<input type="text" readonly value="e659" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xe659;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix noLiga-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="" class="liga unitRight" />
</div>
</div>
</div>
<div class="clearfix mhl ptl">
<h1 class="mvm mtn bshadow fgc1">Grid Size: 16</h1>
<div class="glyph fs2">
<div class="clearfix bshadow0 pbs">
<span class="tl-icon-twitter"></span><span class="mls"> icon-twitter</span>
</div>
<fieldset class="fs0 size1of1 clearfix">
<input type="text" readonly value="e62b" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xe62b;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix noLiga-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="" class="liga unitRight" />
</div>
</div>
<div class="glyph fs2">
<div class="clearfix bshadow0 pbs">
<span class="tl-icon-google-plus"></span><span class="mls"> icon-google-plus</span>
</div>
<fieldset class="fs0 size1of1 clearfix">
<input type="text" readonly value="e62c" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xe62c;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix noLiga-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="" class="liga unitRight" />
</div>
</div>
<div class="glyph fs2">
<div class="clearfix bshadow0 pbs">
<span class="tl-icon-video"></span><span class="mls"> icon-video</span>
</div>
<fieldset class="fs0 size1of1 clearfix">
<input type="text" readonly value="e62d" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xe62d;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix noLiga-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="" class="liga unitRight" />
</div>
</div>
<div class="glyph fs2">
<div class="clearfix bshadow0 pbs">
<span class="tl-icon-plaintext"></span><span class="mls"> icon-plaintext</span>
</div>
<fieldset class="fs0 size1of1 clearfix">
<input type="text" readonly value="e62e" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xe62e;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix noLiga-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="" class="liga unitRight" />
</div>
</div>
<div class="glyph fs2">
<div class="clearfix bshadow0 pbs">
<span class="tl-icon-image-v2"></span><span class="mls"> icon-image-v2</span>
</div>
<fieldset class="fs0 size1of1 clearfix">
<input type="text" readonly value="e62f" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xe62f;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix noLiga-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="" class="liga unitRight" />
</div>
</div>
<div class="glyph fs2">
<div class="clearfix bshadow0 pbs">
<span class="tl-icon-quote-v2"></span><span class="mls"> icon-quote-v2</span>
</div>
<fieldset class="fs0 size1of1 clearfix">
<input type="text" readonly value="e630" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xe630;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix noLiga-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="" class="liga unitRight" />
</div>
</div>
<div class="glyph fs2">
<div class="clearfix bshadow0 pbs">
<span class="tl-icon-zoom-in"></span><span class="mls"> icon-zoom-in</span>
</div>
<fieldset class="fs0 size1of1 clearfix">
<input type="text" readonly value="e631" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xe631;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix noLiga-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="" class="liga unitRight" />
</div>
</div>
<div class="glyph fs2">
<div class="clearfix bshadow0 pbs">
<span class="tl-icon-zoom-out"></span><span class="mls"> icon-zoom-out</span>
</div>
<fieldset class="fs0 size1of1 clearfix">
<input type="text" readonly value="e632" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xe632;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix noLiga-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="" class="liga unitRight" />
</div>
</div>
<div class="glyph fs2">
<div class="clearfix bshadow0 pbs">
<span class="tl-icon-list"></span><span class="mls"> icon-list</span>
</div>
<fieldset class="fs0 size1of1 clearfix">
<input type="text" readonly value="e633" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xe633;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix noLiga-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="" class="liga unitRight" />
</div>
</div>
<div class="glyph fs2">
<div class="clearfix bshadow0 pbs">
<span class="tl-icon-music"></span><span class="mls"> icon-music</span>
</div>
<fieldset class="fs0 size1of1 clearfix">
<input type="text" readonly value="e634" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xe634;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix noLiga-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="" class="liga unitRight" />
</div>
</div>
<div class="glyph fs2">
<div class="clearfix bshadow0 pbs">
<span class="tl-icon-location"></span><span class="mls"> icon-location</span>
</div>
<fieldset class="fs0 size1of1 clearfix">
<input type="text" readonly value="e635" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xe635;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix noLiga-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="" class="liga unitRight" />
</div>
</div>
<div class="glyph fs2">
<div class="clearfix bshadow0 pbs">
<span class="tl-icon-web"></span><span class="mls"> icon-web</span>
</div>
<fieldset class="fs0 size1of1 clearfix">
<input type="text" readonly value="e636" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xe636;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix noLiga-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="" class="liga unitRight" />
</div>
</div>
<div class="glyph fs2">
<div class="clearfix bshadow0 pbs">
<span class="tl-icon-share-v2"></span><span class="mls"> icon-share-v2</span>
</div>
<fieldset class="fs0 size1of1 clearfix">
<input type="text" readonly value="e637" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xe637;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix noLiga-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="" class="liga unitRight" />
</div>
</div>
<div class="glyph fs2">
<div class="clearfix bshadow0 pbs">
<span class="tl-icon-soundcloud"></span><span class="mls"> icon-soundcloud</span>
</div>
<fieldset class="fs0 size1of1 clearfix">
<input type="text" readonly value="e639" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xe639;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix noLiga-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="" class="liga unitRight" />
</div>
</div>
<div class="glyph fs2">
<div class="clearfix bshadow0 pbs">
<span class="tl-icon-video-v2"></span><span class="mls"> icon-video-v2</span>
</div>
<fieldset class="fs0 size1of1 clearfix">
<input type="text" readonly value="e63a" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xe63a;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix noLiga-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="" class="liga unitRight" />
</div>
</div>
<div class="glyph fs2">
<div class="clearfix bshadow0 pbs">
<span class="tl-icon-tumblr"></span><span class="mls"> icon-tumblr</span>
</div>
<fieldset class="fs0 size1of1 clearfix">
<input type="text" readonly value="e63b" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xe63b;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix noLiga-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="" class="liga unitRight" />
</div>
</div>
<div class="glyph fs2">
<div class="clearfix bshadow0 pbs">
<span class="tl-icon-lastfm"></span><span class="mls"> icon-lastfm</span>
</div>
<fieldset class="fs0 size1of1 clearfix">
<input type="text" readonly value="e63c" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xe63c;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix noLiga-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="" class="liga unitRight" />
</div>
</div>
<div class="glyph fs2">
<div class="clearfix bshadow0 pbs">
<span class="tl-icon-github"></span><span class="mls"> icon-github</span>
</div>
<fieldset class="fs0 size1of1 clearfix">
<input type="text" readonly value="e63d" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xe63d;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix noLiga-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="" class="liga unitRight" />
</div>
</div>
<div class="glyph fs2">
<div class="clearfix bshadow0 pbs">
<span class="tl-icon-goback"></span><span class="mls"> icon-goback</span>
</div>
<fieldset class="fs0 size1of1 clearfix">
<input type="text" readonly value="e63e" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xe63e;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix noLiga-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="" class="liga unitRight" />
</div>
</div>
<div class="glyph fs2">
<div class="clearfix bshadow0 pbs">
<span class="tl-icon-doc-v2"></span><span class="mls"> icon-doc-v2</span>
</div>
<fieldset class="fs0 size1of1 clearfix">
<input type="text" readonly value="e63f" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xe63f;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix noLiga-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="" class="liga unitRight" />
</div>
</div>
<div class="glyph fs2">
<div class="clearfix bshadow0 pbs">
<span class="tl-icon-googledrive"></span><span class="mls"> icon-googledrive</span>
</div>
<fieldset class="fs0 size1of1 clearfix">
<input type="text" readonly value="e640" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xe640;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix noLiga-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="" class="liga unitRight" />
</div>
</div>
<div class="glyph fs2">
<div class="clearfix bshadow0 pbs">
<span class="tl-icon-facebook"></span><span class="mls"> icon-facebook</span>
</div>
<fieldset class="fs0 size1of1 clearfix">
<input type="text" readonly value="e641" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xe641;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix noLiga-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="" class="liga unitRight" />
</div>
</div>
<div class="glyph fs2">
<div class="clearfix bshadow0 pbs">
<span class="tl-icon-flickr"></span><span class="mls"> icon-flickr</span>
</div>
<fieldset class="fs0 size1of1 clearfix">
<input type="text" readonly value="e642" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xe642;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix noLiga-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="" class="liga unitRight" />
</div>
</div>
<div class="glyph fs2">
<div class="clearfix bshadow0 pbs">
<span class="tl-icon-dribbble"></span><span class="mls"> icon-dribbble</span>
</div>
<fieldset class="fs0 size1of1 clearfix">
<input type="text" readonly value="e643" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xe643;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix noLiga-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="" class="liga unitRight" />
</div>
</div>
<div class="glyph fs2">
<div class="clearfix bshadow0 pbs">
<span class="tl-icon-image"></span><span class="mls"> icon-image</span>
</div>
<fieldset class="fs0 size1of1 clearfix">
<input type="text" readonly value="e605" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xe605;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix noLiga-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="" class="liga unitRight" />
</div>
</div>
<div class="glyph fs2">
<div class="clearfix bshadow0 pbs">
<span class="tl-icon-vimeo"></span><span class="mls"> icon-vimeo</span>
</div>
<fieldset class="fs0 size1of1 clearfix">
<input type="text" readonly value="e606" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xe606;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix noLiga-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="" class="liga unitRight" />
</div>
</div>
</div>
<div class="clearfix mhl ptl">
<h1 class="mvm mtn bshadow fgc1">Grid Size: 20</h1>
<div class="glyph fs3">
<div class="clearfix bshadow0 pbs">
<span class="tl-icon-instagram"></span><span class="mls"> icon-instagram</span>
</div>
<fieldset class="fs0 size1of1 clearfix">
<input type="text" readonly value="e644" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xe644;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix noLiga-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="" class="liga unitRight" />
</div>
</div>
<div class="glyph fs3">
<div class="clearfix bshadow0 pbs">
<span class="tl-icon-pinterest"></span><span class="mls"> icon-pinterest</span>
</div>
<fieldset class="fs0 size1of1 clearfix">
<input type="text" readonly value="e645" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xe645;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix noLiga-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="" class="liga unitRight" />
</div>
</div>
<div class="glyph fs3">
<div class="clearfix bshadow0 pbs">
<span class="tl-icon-arrow-left"></span><span class="mls"> icon-arrow-left</span>
</div>
<fieldset class="fs0 size1of1 clearfix">
<input type="text" readonly value="e646" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xe646;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix noLiga-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="" class="liga unitRight" />
</div>
</div>
<div class="glyph fs3">
<div class="clearfix bshadow0 pbs">
<span class="tl-icon-arrow-down"></span><span class="mls"> icon-arrow-down</span>
</div>
<fieldset class="fs0 size1of1 clearfix">
<input type="text" readonly value="e647" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xe647;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix noLiga-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="" class="liga unitRight" />
</div>
</div>
<div class="glyph fs3">
<div class="clearfix bshadow0 pbs">
<span class="tl-icon-arrow-up"></span><span class="mls"> icon-arrow-up</span>
</div>
<fieldset class="fs0 size1of1 clearfix">
<input type="text" readonly value="e648" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xe648;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix noLiga-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="" class="liga unitRight" />
</div>
</div>
<div class="glyph fs3">
<div class="clearfix bshadow0 pbs">
<span class="tl-icon-arrow-right"></span><span class="mls"> icon-arrow-right</span>
</div>
<fieldset class="fs0 size1of1 clearfix">
<input type="text" readonly value="e649" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xe649;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix noLiga-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="" class="liga unitRight" />
</div>
</div>
<div class="glyph fs3">
<div class="clearfix bshadow0 pbs">
<span class="tl-icon-share"></span><span class="mls"> icon-share</span>
</div>
<fieldset class="fs0 size1of1 clearfix">
<input type="text" readonly value="e64a" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xe64a;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix noLiga-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="" class="liga unitRight" />
</div>
</div>
<div class="glyph fs3">
<div class="clearfix bshadow0 pbs">
<span class="tl-icon-quote"></span><span class="mls"> icon-quote</span>
</div>
<fieldset class="fs0 size1of1 clearfix">
<input type="text" readonly value="e64b" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xe64b;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix noLiga-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="" class="liga unitRight" />
</div>
</div>
<div class="glyph fs3">
<div class="clearfix bshadow0 pbs">
<span class="tl-icon-evernote"></span><span class="mls"> icon-evernote</span>
</div>
<fieldset class="fs0 size1of1 clearfix">
<input type="text" readonly value="e64c" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xe64c;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix noLiga-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="" class="liga unitRight" />
</div>
</div>
</div>
<div class="clearfix mhl ptl">
<h1 class="mvm mtn bshadow fgc1">Grid Size: Unknown</h1>
<div class="glyph fs4">
<div class="clearfix bshadow0 pbs">
<span class="tl-icon-mappin"></span><span class="mls"> icon-mappin</span>
</div>
<fieldset class="fs0 size1of1 clearfix">
<input type="text" readonly value="e600" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xe600;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix noLiga-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="" class="liga unitRight" />
</div>
</div>
<div class="glyph fs4">
<div class="clearfix bshadow0 pbs">
<span class="tl-icon-swipe-right"></span><span class="mls"> icon-swipe-right</span>
</div>
<fieldset class="fs0 size1of1 clearfix">
<input type="text" readonly value="e601" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xe601;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix noLiga-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="" class="liga unitRight" />
</div>
</div>
<div class="glyph fs4">
<div class="clearfix bshadow0 pbs">
<span class="tl-icon-swipe-left"></span><span class="mls"> icon-swipe-left</span>
</div>
<fieldset class="fs0 size1of1 clearfix">
<input type="text" readonly value="e602" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xe602;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix noLiga-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="" class="liga unitRight" />
</div>
</div>
<div class="glyph fs4">
<div class="clearfix bshadow0 pbs">
<span class="tl-icon-touch-spread"></span><span class="mls"> icon-touch-spread</span>
</div>
<fieldset class="fs0 size1of1 clearfix">
<input type="text" readonly value="e603" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xe603;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix noLiga-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="" class="liga unitRight" />
</div>
</div>
<div class="glyph fs4">
<div class="clearfix bshadow0 pbs">
<span class="tl-icon-touch-pinch"></span><span class="mls"> icon-touch-pinch</span>
</div>
<fieldset class="fs0 size1of1 clearfix">
<input type="text" readonly value="e604" class="unit size1of2" />
<input type="text" maxlength="1" readonly value="&#xe604;" class="unitRight size1of2 talign-right" />
</fieldset>
<div class="fs0 bshadow0 clearfix noLiga-true">
<span class="unit pvs fgc1">liga: </span>
<input type="text" readonly value="" class="liga unitRight" />
</div>
</div>
</div>
<!--[if gt IE 8]><!-->
<div class="mhl clearfix mbl">
<h1>Font Test Drive</h1>
<label>
Font Size: <input id="fontSize" type="number" class="textbox0 mbm"
min="8" value="48" />
px
</label>
<input id="testText" type="text" class="phl size1of1 mvl"
placeholder="Type some text to test..."/>
</label>
<div id="testDrive" class="icon-">&nbsp;
</div>
</div>
<!--<![endif]-->
<div class="bgc1 clearfix">
<p class="mhl">Generated by <a href="http://icomoon.io/app">IcoMoon</a></p>
</div>
<script>
if (!('boxShadow' in document.body.style)) {
document.body.setAttribute('class', 'noBoxShadow');
}
document.body.addEventListener("click", function(e) {
var target = e.target;
if (target.tagName === "INPUT" &&
target.getAttribute('class').indexOf('liga') === -1) {
target.select();
}
});
(function() {
var fontSize = document.getElementById('fontSize'),
testDrive = document.getElementById('testDrive'),
testText = document.getElementById('testText');
function updateTest() {
testDrive.innerHTML = testText.value || String.fromCharCode(160);
if (window.icomoonLiga) {
window.icomoonLiga(testDrive);
}
}
function updateSize() {
testDrive.style.fontSize = fontSize.value + 'px';
}
fontSize.addEventListener('change', updateSize, false);
testText.addEventListener('input', updateTest, false);
testText.addEventListener('change', updateTest, false);
updateSize();
}());
</script>
</body>
</html>