Changeset - 8bea04f3d6d3
Parent rev.
Child rev.
[Not reviewed]
default
0 0 1
domruf - 8 years ago 2018-01-11 15:50:07
dominikruf@gmail.com
Grafted from: d25d0404f1f2
fontello: add demo.html

The demo.html file is very helpful to see what icons are available and what
code and css class they have.
1 file changed with 459 insertions and 0 deletions:
kallithea/public/fontello/demo.html
459
0 comments (0 inline, 0 general)
kallithea/public/fontello/demo.html
➞
Show inline comments
 
new file 100644
 
<!DOCTYPE html>
 
<html>
 
  <head><!--[if lt IE 9]><script language="javascript" type="text/javascript" src="//html5shim.googlecode.com/svn/trunk/html5.js"></script><![endif]-->
 
    <meta charset="UTF-8"><style>/*
 
 * Bootstrap v2.2.1
 
 *
 
 * Copyright 2012 Twitter, Inc
 
 * Licensed under the Apache License v2.0
 
 * http://www.apache.org/licenses/LICENSE-2.0
 
 *
 
 * Designed and built with all the love in the world @twitter by @mdo and @fat.
 
 */
 
.clearfix {
 
  *zoom: 1;
 
}
 
.clearfix:before,
 
.clearfix:after {
 
  display: table;
 
  content: "";
 
  line-height: 0;
 
}
 
.clearfix:after {
 
  clear: both;
 
}
 
html {
 
  font-size: 100%;
 
  -webkit-text-size-adjust: 100%;
 
  -ms-text-size-adjust: 100%;
 
}
 
a:focus {
 
  outline: thin dotted #333;
 
  outline: 5px auto -webkit-focus-ring-color;
 
  outline-offset: -2px;
 
}
 
a:hover,
 
a:active {
 
  outline: 0;
 
}
 
button,
 
input,
 
select,
 
textarea {
 
  margin: 0;
 
  font-size: 100%;
 
  vertical-align: middle;
 
}
 
button,
 
input {
 
  *overflow: visible;
 
  line-height: normal;
 
}
 
button::-moz-focus-inner,
 
input::-moz-focus-inner {
 
  padding: 0;
 
  border: 0;
 
}
 
body {
 
  margin: 0;
 
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
 
  font-size: 14px;
 
  line-height: 20px;
 
  color: #333;
 
  background-color: #fff;
 
}
 
a {
 
  color: #08c;
 
  text-decoration: none;
 
}
 
a:hover {
 
  color: #005580;
 
  text-decoration: underline;
 
}
 
.row {
 
  margin-left: -20px;
 
  *zoom: 1;
 
}
 
.row:before,
 
.row:after {
 
  display: table;
 
  content: "";
 
  line-height: 0;
 
}
 
.row:after {
 
  clear: both;
 
}
 
[class*="span"] {
 
  float: left;
 
  min-height: 1px;
 
  margin-left: 20px;
 
}
 
.container,
 
.navbar-static-top .container,
 
.navbar-fixed-top .container,
 
.navbar-fixed-bottom .container {
 
  width: 940px;
 
}
 
.span12 {
 
  width: 940px;
 
}
 
.span11 {
 
  width: 860px;
 
}
 
.span10 {
 
  width: 780px;
 
}
 
.span9 {
 
  width: 700px;
 
}
 
.span8 {
 
  width: 620px;
 
}
 
.span7 {
 
  width: 540px;
 
}
 
.span6 {
 
  width: 460px;
 
}
 
.span5 {
 
  width: 380px;
 
}
 
.span4 {
 
  width: 300px;
 
}
 
.span3 {
 
  width: 220px;
 
}
 
.span2 {
 
  width: 140px;
 
}
 
.span1 {
 
  width: 60px;
 
}
 
[class*="span"].pull-right,
 
.row-fluid [class*="span"].pull-right {
 
  float: right;
 
}
 
.container {
 
  margin-right: auto;
 
  margin-left: auto;
 
  *zoom: 1;
 
}
 
.container:before,
 
.container:after {
 
  display: table;
 
  content: "";
 
  line-height: 0;
 
}
 
.container:after {
 
  clear: both;
 
}
 
p {
 
  margin: 0 0 10px;
 
}
 
.lead {
 
  margin-bottom: 20px;
 
  font-size: 21px;
 
  font-weight: 200;
 
  line-height: 30px;
 
}
 
small {
 
  font-size: 85%;
 
}
 
h1 {
 
  margin: 10px 0;
 
  font-family: inherit;
 
  font-weight: bold;
 
  line-height: 20px;
 
  color: inherit;
 
  text-rendering: optimizelegibility;
 
}
 
h1 small {
 
  font-weight: normal;
 
  line-height: 1;
 
  color: #999;
 
}
 
h1 {
 
  line-height: 40px;
 
}
 
h1 {
 
  font-size: 38.5px;
 
}
 
h1 small {
 
  font-size: 24.5px;
 
}
 
body {
 
  margin-top: 90px;
 
}
 
.header {
 
  position: fixed;
 
  top: 0;
 
  left: 50%;
 
  margin-left: -480px;
 
  background-color: #fff;
 
  border-bottom: 1px solid #ddd;
 
  padding-top: 10px;
 
  z-index: 10;
 
}
 
.footer {
 
  color: #ddd;
 
  font-size: 12px;
 
  text-align: center;
 
  margin-top: 20px;
 
}
 
.footer a {
 
  color: #ccc;
 
  text-decoration: underline;
 
}
 
.the-icons {
 
  font-size: 14px;
 
  line-height: 24px;
 
}
 
.switch {
 
  position: absolute;
 
  right: 0;
 
  bottom: 10px;
 
  color: #666;
 
}
 
.switch input {
 
  margin-right: 0.3em;
 
}
 
.codesOn .i-name {
 
  display: none;
 
}
 
.codesOn .i-code {
 
  display: inline;
 
}
 
.i-code {
 
  display: none;
 
}
 
@font-face {
 
      font-family: 'kallithea';
 
      src: url('./font/kallithea.eot?61441093');
 
      src: url('./font/kallithea.eot?61441093#iefix') format('embedded-opentype'),
 
           url('./font/kallithea.woff?61441093') format('woff'),
 
           url('./font/kallithea.ttf?61441093') format('truetype'),
 
           url('./font/kallithea.svg?61441093#kallithea') format('svg');
 
      font-weight: normal;
 
      font-style: normal;
 
    }
 
 
 
    .demo-icon
 
    {
 
      font-family: "kallithea";
 
      font-style: normal;
 
      font-weight: normal;
 
      speak: none;
 
 
      display: inline-block;
 
      text-decoration: inherit;
 
      width: 1em;
 
      margin-right: .2em;
 
      text-align: center;
 
      /* opacity: .8; */
 
 
      /* For safety - reset parent styles, that can break glyph codes*/
 
      font-variant: normal;
 
      text-transform: none;
 
 
      /* fix buttons height, for twitter bootstrap */
 
      line-height: 1em;
 
 
      /* Animation center compensation - margins should be symmetric */
 
      /* remove if not needed */
 
      margin-left: .2em;
 
 
      /* You can be more comfortable with increased icons size */
 
      /* font-size: 120%; */
 
 
      /* Font smoothing. That was taken from TWBS */
 
      -webkit-font-smoothing: antialiased;
 
      -moz-osx-font-smoothing: grayscale;
 
 
      /* Uncomment for 3D effect */
 
      /* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */
 
    }
 
     </style>
 
    <link rel="stylesheet" href="css/animation.css"><!--[if IE 7]><link rel="stylesheet" href="css/kallithea-ie7.css"><![endif]-->
 
    <script>
 
      function toggleCodes(on) {
 
        var obj = document.getElementById('icons');
 
 
        if (on) {
 
          obj.className += ' codesOn';
 
        } else {
 
          obj.className = obj.className.replace(' codesOn', '');
 
        }
 
      }
 
 
    </script>
 
  </head>
 
  <body>
 
    <div class="container header">
 
      <h1>
 
        kallithea
 
         <small>font demo</small>
 
      </h1>
 
      <label class="switch">
 
        <input type="checkbox" onclick="toggleCodes(this.checked)">show codes
 
      </label>
 
    </div>
 
    <div id="icons" class="container">
 
      <div class="row">
 
        <div title="Code: 0x2022" class="the-icons span3"><i class="demo-icon icon-circle">&#x2022;</i> <span class="i-name">icon-circle</span><span class="i-code">0x2022</span></div>
 
        <div title="Code: 0x2190" class="the-icons span3"><i class="demo-icon icon-right-open">&#x2190;</i> <span class="i-name">icon-right-open</span><span class="i-code">0x2190</span></div>
 
        <div title="Code: 0x2191" class="the-icons span3"><i class="demo-icon icon-up-open">&#x2191;</i> <span class="i-name">icon-up-open</span><span class="i-code">0x2191</span></div>
 
        <div title="Code: 0x2192" class="the-icons span3"><i class="demo-icon icon-left-open">&#x2192;</i> <span class="i-name">icon-left-open</span><span class="i-code">0x2192</span></div>
 
      </div>
 
      <div class="row">
 
        <div title="Code: 0x2193" class="the-icons span3"><i class="demo-icon icon-down-open">&#x2193;</i> <span class="i-name">icon-down-open</span><span class="i-code">0x2193</span></div>
 
        <div title="Code: 0x2194" class="the-icons span3"><i class="demo-icon icon-code">&#x2194;</i> <span class="i-name">icon-code</span><span class="i-code">0x2194</span></div>
 
        <div title="Code: 0x2195" class="the-icons span3"><i class="demo-icon icon-sort">&#x2195;</i> <span class="i-name">icon-sort</span><span class="i-code">0x2195</span></div>
 
        <div title="Code: 0x21c4" class="the-icons span3"><i class="demo-icon icon-exchange">&#x21c4;</i> <span class="i-name">icon-exchange</span><span class="i-code">0x21c4</span></div>
 
      </div>
 
      <div class="row">
 
        <div title="Code: 0x2295" class="the-icons span3"><i class="demo-icon icon-plus-circled">&#x2295;</i> <span class="i-name">icon-plus-circled</span><span class="i-code">0x2295</span></div>
 
        <div title="Code: 0x2296" class="the-icons span3"><i class="demo-icon icon-minus-circled">&#x2296;</i> <span class="i-name">icon-minus-circled</span><span class="i-code">0x2296</span></div>
 
        <div title="Code: 0x229e" class="the-icons span3"><i class="demo-icon icon-diff-added">&#x229e;</i> <span class="i-name">icon-diff-added</span><span class="i-code">0x229e</span></div>
 
        <div title="Code: 0x229f" class="the-icons span3"><i class="demo-icon icon-diff-removed">&#x229f;</i> <span class="i-name">icon-diff-removed</span><span class="i-code">0x229f</span></div>
 
      </div>
 
      <div class="row">
 
        <div title="Code: 0x22a1" class="the-icons span3"><i class="demo-icon icon-diff-modified">&#x22a1;</i> <span class="i-name">icon-diff-modified</span><span class="i-code">0x22a1</span></div>
 
        <div title="Code: 0x231a" class="the-icons span3"><i class="demo-icon icon-clock">&#x231a;</i> <span class="i-name">icon-clock</span><span class="i-code">0x231a</span></div>
 
        <div title="Code: 0x23f4" class="the-icons span3"><i class="demo-icon icon-triangle-left">&#x23f4;</i> <span class="i-name">icon-triangle-left</span><span class="i-code">0x23f4</span></div>
 
        <div title="Code: 0x23f5" class="the-icons span3"><i class="demo-icon icon-triangle-right">&#x23f5;</i> <span class="i-name">icon-triangle-right</span><span class="i-code">0x23f5</span></div>
 
      </div>
 
      <div class="row">
 
        <div title="Code: 0x23f6" class="the-icons span3"><i class="demo-icon icon-triangle-up">&#x23f6;</i> <span class="i-name">icon-triangle-up</span><span class="i-code">0x23f6</span></div>
 
        <div title="Code: 0x23f7" class="the-icons span3"><i class="demo-icon icon-triangle-down">&#x23f7;</i> <span class="i-name">icon-triangle-down</span><span class="i-code">0x23f7</span></div>
 
        <div title="Code: 0x25e6" class="the-icons span3"><i class="demo-icon icon-circle-empty">&#x25e6;</i> <span class="i-name">icon-circle-empty</span><span class="i-code">0x25e6</span></div>
 
        <div title="Code: 0x2661" class="the-icons span3"><i class="demo-icon icon-heart-empty">&#x2661;</i> <span class="i-name">icon-heart-empty</span><span class="i-code">0x2661</span></div>
 
      </div>
 
      <div class="row">
 
        <div title="Code: 0x2665" class="the-icons span3"><i class="demo-icon icon-heart">&#x2665;</i> <span class="i-name">icon-heart</span><span class="i-code">0x2665</span></div>
 
        <div title="Code: 0x2699" class="the-icons span3"><i class="demo-icon icon-cog-alt">&#x2699;</i> <span class="i-name">icon-cog-alt</span><span class="i-code">0x2699</span></div>
 
        <div title="Code: 0x26c3" class="the-icons span3"><i class="demo-icon icon-database">&#x26c3;</i> <span class="i-name">icon-database</span><span class="i-code">0x26c3</span></div>
 
        <div title="Code: 0x26ed" class="the-icons span3"><i class="demo-icon icon-gear">&#x26ed;</i> <span class="i-name">icon-gear</span><span class="i-code">0x26ed</span></div>
 
      </div>
 
      <div class="row">
 
        <div title="Code: 0x2795" class="the-icons span3"><i class="demo-icon icon-plus">&#x2795;</i> <span class="i-name">icon-plus</span><span class="i-code">0x2795</span></div>
 
        <div title="Code: 0x2796" class="the-icons span3"><i class="demo-icon icon-minus">&#x2796;</i> <span class="i-name">icon-minus</span><span class="i-code">0x2796</span></div>
 
        <div title="Code: 0x2b65" class="the-icons span3"><i class="demo-icon icon-resize-vertical">&#x2b65;</i> <span class="i-name">icon-resize-vertical</span><span class="i-code">0x2b65</span></div>
 
        <div title="Code: 0x2b71" class="the-icons span3"><i class="demo-icon icon-move-up">&#x2b71;</i> <span class="i-name">icon-move-up</span><span class="i-code">0x2b71</span></div>
 
      </div>
 
      <div class="row">
 
        <div title="Code: 0x2b73" class="the-icons span3"><i class="demo-icon icon-move-down">&#x2b73;</i> <span class="i-name">icon-move-down</span><span class="i-code">0x2b73</span></div>
 
        <div title="Code: 0xe801" class="the-icons span3"><i class="demo-icon icon-file-submodule">&#xe801;</i> <span class="i-name">icon-file-submodule</span><span class="i-code">0xe801</span></div>
 
        <div title="Code: 0xe802" class="the-icons span3"><i class="demo-icon icon-git-merge">&#xe802;</i> <span class="i-name">icon-git-merge</span><span class="i-code">0xe802</span></div>
 
        <div title="Code: 0xe811" class="the-icons span3"><i class="demo-icon icon-ruler">&#xe811;</i> <span class="i-name">icon-ruler</span><span class="i-code">0xe811</span></div>
 
      </div>
 
      <div class="row">
 
        <div title="Code: 0xe813" class="the-icons span3"><i class="demo-icon icon-download-cloud">&#xe813;</i> <span class="i-name">icon-download-cloud</span><span class="i-code">0xe813</span></div>
 
        <div title="Code: 0xe814" class="the-icons span3"><i class="demo-icon icon-upload-cloud">&#xe814;</i> <span class="i-name">icon-upload-cloud</span><span class="i-code">0xe814</span></div>
 
        <div title="Code: 0xe815" class="the-icons span3"><i class="demo-icon icon-graph">&#xe815;</i> <span class="i-name">icon-graph</span><span class="i-code">0xe815</span></div>
 
        <div title="Code: 0xe816" class="the-icons span3"><i class="demo-icon icon-file-zip">&#xe816;</i> <span class="i-name">icon-file-zip</span><span class="i-code">0xe816</span></div>
 
      </div>
 
      <div class="row">
 
        <div title="Code: 0xe81a" class="the-icons span3"><i class="demo-icon icon-file-code">&#xe81a;</i> <span class="i-name">icon-file-code</span><span class="i-code">0xe81a</span></div>
 
        <div title="Code: 0xe81c" class="the-icons span3"><i class="demo-icon icon-doc-text-inv">&#xe81c;</i> <span class="i-name">icon-doc-text-inv</span><span class="i-code">0xe81c</span></div>
 
        <div title="Code: 0xe81d" class="the-icons span3"><i class="demo-icon icon-diff">&#xe81d;</i> <span class="i-name">icon-diff</span><span class="i-code">0xe81d</span></div>
 
        <div title="Code: 0xe81e" class="the-icons span3"><i class="demo-icon icon-diff-ignored">&#xe81e;</i> <span class="i-name">icon-diff-ignored</span><span class="i-code">0xe81e</span></div>
 
      </div>
 
      <div class="row">
 
        <div title="Code: 0xe81f" class="the-icons span3"><i class="demo-icon icon-diff-renamed">&#xe81f;</i> <span class="i-name">icon-diff-renamed</span><span class="i-code">0xe81f</span></div>
 
        <div title="Code: 0xe820" class="the-icons span3"><i class="demo-icon icon-paste">&#xe820;</i> <span class="i-name">icon-paste</span><span class="i-code">0xe820</span></div>
 
        <div title="Code: 0xe823" class="the-icons span3"><i class="demo-icon icon-file-directory">&#xe823;</i> <span class="i-name">icon-file-directory</span><span class="i-code">0xe823</span></div>
 
        <div title="Code: 0xe824" class="the-icons span3"><i class="demo-icon icon-git-compare">&#xe824;</i> <span class="i-name">icon-git-compare</span><span class="i-code">0xe824</span></div>
 
      </div>
 
      <div class="row">
 
        <div title="Code: 0xe825" class="the-icons span3"><i class="demo-icon icon-git-pull-request">&#xe825;</i> <span class="i-name">icon-git-pull-request</span><span class="i-code">0xe825</span></div>
 
        <div title="Code: 0xe827" class="the-icons span3"><i class="demo-icon icon-repo-forked">&#xe827;</i> <span class="i-name">icon-repo-forked</span><span class="i-code">0xe827</span></div>
 
        <div title="Code: 0xe828" class="the-icons span3"><i class="demo-icon icon-fork">&#xe828;</i> <span class="i-name">icon-fork</span><span class="i-code">0xe828</span></div>
 
        <div title="Code: 0xe834" class="the-icons span3"><i class="demo-icon icon-docs">&#xe834;</i> <span class="i-name">icon-docs</span><span class="i-code">0xe834</span></div>
 
      </div>
 
      <div class="row">
 
        <div title="Code: 0xe836" class="the-icons span3"><i class="demo-icon icon-doc-inv">&#xe836;</i> <span class="i-name">icon-doc-inv</span><span class="i-code">0xe836</span></div>
 
        <div title="Code: 0xe837" class="the-icons span3"><i class="demo-icon icon-file-powerpoint">&#xe837;</i> <span class="i-name">icon-file-powerpoint</span><span class="i-code">0xe837</span></div>
 
        <div title="Code: 0xe83d" class="the-icons span3"><i class="demo-icon icon-tags">&#xe83d;</i> <span class="i-name">icon-tags</span><span class="i-code">0xe83d</span></div>
 
        <div title="Code: 0xe83f" class="the-icons span3"><i class="demo-icon icon-bookmark-empty">&#xe83f;</i> <span class="i-name">icon-bookmark-empty</span><span class="i-code">0xe83f</span></div>
 
      </div>
 
      <div class="row">
 
        <div title="Code: 0xe840" class="the-icons span3"><i class="demo-icon icon-bookmark">&#xe840;</i> <span class="i-name">icon-bookmark</span><span class="i-code">0xe840</span></div>
 
        <div title="Code: 0xe841" class="the-icons span3"><i class="demo-icon icon-align-left">&#xe841;</i> <span class="i-name">icon-align-left</span><span class="i-code">0xe841</span></div>
 
        <div title="Code: 0xe843" class="the-icons span3"><i class="demo-icon icon-sliders">&#xe843;</i> <span class="i-name">icon-sliders</span><span class="i-code">0xe843</span></div>
 
        <div title="Code: 0xe851" class="the-icons span3"><i class="demo-icon icon-eye-off">&#xe851;</i> <span class="i-name">icon-eye-off</span><span class="i-code">0xe851</span></div>
 
      </div>
 
      <div class="row">
 
        <div title="Code: 0xe855" class="the-icons span3"><i class="demo-icon icon-rss">&#xe855;</i> <span class="i-name">icon-rss</span><span class="i-code">0xe855</span></div>
 
        <div title="Code: 0xe856" class="the-icons span3"><i class="demo-icon icon-rss-squared">&#xe856;</i> <span class="i-name">icon-rss-squared</span><span class="i-code">0xe856</span></div>
 
        <div title="Code: 0xe859" class="the-icons span3"><i class="demo-icon icon-strike">&#xe859;</i> <span class="i-name">icon-strike</span><span class="i-code">0xe859</span></div>
 
        <div title="Code: 0xe85e" class="the-icons span3"><i class="demo-icon icon-box">&#xe85e;</i> <span class="i-name">icon-box</span><span class="i-code">0xe85e</span></div>
 
      </div>
 
      <div class="row">
 
        <div title="Code: 0xe85f" class="the-icons span3"><i class="demo-icon icon-right">&#xe85f;</i> <span class="i-name">icon-right</span><span class="i-code">0xe85f</span></div>
 
        <div title="Code: 0xe860" class="the-icons span3"><i class="demo-icon icon-left">&#xe860;</i> <span class="i-name">icon-left</span><span class="i-code">0xe860</span></div>
 
        <div title="Code: 0xe861" class="the-icons span3"><i class="demo-icon icon-left-circled">&#xe861;</i> <span class="i-name">icon-left-circled</span><span class="i-code">0xe861</span></div>
 
        <div title="Code: 0xe862" class="the-icons span3"><i class="demo-icon icon-right-circled">&#xe862;</i> <span class="i-name">icon-right-circled</span><span class="i-code">0xe862</span></div>
 
      </div>
 
      <div class="row">
 
        <div title="Code: 0xe863" class="the-icons span3"><i class="demo-icon icon-up-circled">&#xe863;</i> <span class="i-name">icon-up-circled</span><span class="i-code">0xe863</span></div>
 
        <div title="Code: 0xe864" class="the-icons span3"><i class="demo-icon icon-up">&#xe864;</i> <span class="i-name">icon-up</span><span class="i-code">0xe864</span></div>
 
        <div title="Code: 0xe865" class="the-icons span3"><i class="demo-icon icon-down">&#xe865;</i> <span class="i-name">icon-down</span><span class="i-code">0xe865</span></div>
 
        <div title="Code: 0xe866" class="the-icons span3"><i class="demo-icon icon-down-circled">&#xe866;</i> <span class="i-name">icon-down-circled</span><span class="i-code">0xe866</span></div>
 
      </div>
 
      <div class="row">
 
        <div title="Code: 0x1f30e" class="the-icons span3"><i class="demo-icon icon-globe">&#x1f30e;</i> <span class="i-name">icon-globe</span><span class="i-code">0x1f30e</span></div>
 
        <div title="Code: 0x1f441" class="the-icons span3"><i class="demo-icon icon-eye">&#x1f441;</i> <span class="i-name">icon-eye</span><span class="i-code">0x1f441</span></div>
 
        <div title="Code: 0x1f464" class="the-icons span3"><i class="demo-icon icon-user">&#x1f464;</i> <span class="i-name">icon-user</span><span class="i-code">0x1f464</span></div>
 
        <div title="Code: 0x1f465" class="the-icons span3"><i class="demo-icon icon-users">&#x1f465;</i> <span class="i-name">icon-users</span><span class="i-code">0x1f465</span></div>
 
      </div>
 
      <div class="row">
 
        <div title="Code: 0x1f4be" class="the-icons span3"><i class="demo-icon icon-floppy">&#x1f4be;</i> <span class="i-name">icon-floppy</span><span class="i-code">0x1f4be</span></div>
 
        <div title="Code: 0x1f4c1" class="the-icons span3"><i class="demo-icon icon-folder-empty">&#x1f4c1;</i> <span class="i-name">icon-folder-empty</span><span class="i-code">0x1f4c1</span></div>
 
        <div title="Code: 0x1f4c2" class="the-icons span3"><i class="demo-icon icon-folder-open-empty">&#x1f4c2;</i> <span class="i-name">icon-folder-open-empty</span><span class="i-code">0x1f4c2</span></div>
 
        <div title="Code: 0x1f4cb" class="the-icons span3"><i class="demo-icon icon-clippy">&#x1f4cb;</i> <span class="i-name">icon-clippy</span><span class="i-code">0x1f4cb</span></div>
 
      </div>
 
      <div class="row">
 
        <div title="Code: 0x1f4d2" class="the-icons span3"><i class="demo-icon icon-book">&#x1f4d2;</i> <span class="i-name">icon-book</span><span class="i-code">0x1f4d2</span></div>
 
        <div title="Code: 0x1f50d" class="the-icons span3"><i class="demo-icon icon-search">&#x1f50d;</i> <span class="i-name">icon-search</span><span class="i-code">0x1f50d</span></div>
 
        <div title="Code: 0x1f510" class="the-icons span3"><i class="demo-icon icon-keyhole-circled">&#x1f510;</i> <span class="i-name">icon-keyhole-circled</span><span class="i-code">0x1f510</span></div>
 
        <div title="Code: 0x1f511" class="the-icons span3"><i class="demo-icon icon-key">&#x1f511;</i> <span class="i-name">icon-key</span><span class="i-code">0x1f511</span></div>
 
      </div>
 
      <div class="row">
 
        <div title="Code: 0x1f512" class="the-icons span3"><i class="demo-icon icon-lock">&#x1f512;</i> <span class="i-name">icon-lock</span><span class="i-code">0x1f512</span></div>
 
        <div title="Code: 0x1f513" class="the-icons span3"><i class="demo-icon icon-lock-open-alt">&#x1f513;</i> <span class="i-name">icon-lock-open-alt</span><span class="i-code">0x1f513</span></div>
 
        <div title="Code: 0x1f516" class="the-icons span3"><i class="demo-icon icon-tag">&#x1f516;</i> <span class="i-name">icon-tag</span><span class="i-code">0x1f516</span></div>
 
        <div title="Code: 0x1f527" class="the-icons span3"><i class="demo-icon icon-wrench">&#x1f527;</i> <span class="i-name">icon-wrench</span><span class="i-code">0x1f527</span></div>
 
      </div>
 
      <div class="row">
 
        <div title="Code: 0x1f589" class="the-icons span3"><i class="demo-icon icon-pencil">&#x1f589;</i> <span class="i-name">icon-pencil</span><span class="i-code">0x1f589</span></div>
 
        <div title="Code: 0x1f58a" class="the-icons span3"><i class="demo-icon icon-pencil-squared">&#x1f58a;</i> <span class="i-name">icon-pencil-squared</span><span class="i-code">0x1f58a</span></div>
 
        <div title="Code: 0x1f58b" class="the-icons span3"><i class="demo-icon icon-edit">&#x1f58b;</i> <span class="i-name">icon-edit</span><span class="i-code">0x1f58b</span></div>
 
        <div title="Code: 0x1f5c0" class="the-icons span3"><i class="demo-icon icon-folder">&#x1f5c0;</i> <span class="i-name">icon-folder</span><span class="i-code">0x1f5c0</span></div>
 
      </div>
 
      <div class="row">
 
        <div title="Code: 0x1f5c1" class="the-icons span3"><i class="demo-icon icon-folder-open">&#x1f5c1;</i> <span class="i-name">icon-folder-open</span><span class="i-code">0x1f5c1</span></div>
 
        <div title="Code: 0x1f5c5" class="the-icons span3"><i class="demo-icon icon-doc">&#x1f5c5;</i> <span class="i-name">icon-doc</span><span class="i-code">0x1f5c5</span></div>
 
        <div title="Code: 0x1f5c8" class="the-icons span3"><i class="demo-icon icon-doc-text">&#x1f5c8;</i> <span class="i-name">icon-doc-text</span><span class="i-code">0x1f5c8</span></div>
 
        <div title="Code: 0x1f5d1" class="the-icons span3"><i class="demo-icon icon-trashcan">&#x1f5d1;</i> <span class="i-name">icon-trashcan</span><span class="i-code">0x1f5d1</span></div>
 
      </div>
 
      <div class="row">
 
        <div title="Code: 0x1f5d8" class="the-icons span3"><i class="demo-icon icon-arrows-cw">&#x1f5d8;</i> <span class="i-name">icon-arrows-cw</span><span class="i-code">0x1f5d8</span></div>
 
        <div title="Code: 0x1f5e9" class="the-icons span3"><i class="demo-icon icon-comment">&#x1f5e9;</i> <span class="i-name">icon-comment</span><span class="i-code">0x1f5e9</span></div>
 
        <div title="Code: 0x1f5ea" class="the-icons span3"><i class="demo-icon icon-comment-discussion">&#x1f5ea;</i> <span class="i-name">icon-comment-discussion</span><span class="i-code">0x1f5ea</span></div>
 
        <div title="Code: 0x1f5f4" class="the-icons span3"><i class="demo-icon icon-cancel">&#x1f5f4;</i> <span class="i-name">icon-cancel</span><span class="i-code">0x1f5f4</span></div>
 
      </div>
 
      <div class="row">
 
        <div title="Code: 0x1f5f5" class="the-icons span3"><i class="demo-icon icon-cancel-circled">&#x1f5f5;</i> <span class="i-name">icon-cancel-circled</span><span class="i-code">0x1f5f5</span></div>
 
        <div title="Code: 0x1f5f8" class="the-icons span3"><i class="demo-icon icon-ok">&#x1f5f8;</i> <span class="i-name">icon-ok</span><span class="i-code">0x1f5f8</span></div>
 
        <div title="Code: 0x1f5f9" class="the-icons span3"><i class="demo-icon icon-ok-circled">&#x1f5f9;</i> <span class="i-name">icon-ok-circled</span><span class="i-code">0x1f5f9</span></div>
 
        <div title="Code: 0x1f6ab" class="the-icons span3"><i class="demo-icon icon-block">&#x1f6ab;</i> <span class="i-name">icon-block</span><span class="i-code">0x1f6ab</span></div>
 
      </div>
 
      <div class="row">
 
        <div title="Code: 0x1f6e0" class="the-icons span3"><i class="demo-icon icon-tools">&#x1f6e0;</i> <span class="i-name">icon-tools</span><span class="i-code">0x1f6e0</span></div>
 
      </div>
 
    </div>
 
    <div class="container footer">Generated by <a href="http://fontello.com">fontello.com</a></div>
 
  </body>
 
</html>
 
\ No newline at end of file
0 comments (0 inline, 0 general)
This site is powered by Kallithea 0.7.0, which is © 2010–2025 by various authors & licensed under GPLv3.