mirror of
https://github.com/andrewgioia/keyrune.git
synced 2024-11-05 08:34:45 +00:00
Update to the example (index.html) layout/content.
This commit is contained in:
jordanbrauer
parent
0eef150a51
commit
09790f2442
176
index.html
176
index.html
@ -4,10 +4,10 @@
|
||||
<meta charset="utf-8" />
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
||||
<title>Keyrune</title>
|
||||
<!-- <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/foundation/6.2.3/foundation.min.css" /> -->
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/foundation/6.2.3/foundation.css" />
|
||||
<link rel="stylesheet" href="css/keyrune.min.css" />
|
||||
<!-- <link rel="stylesheet" href="css/keyrune.css" /> -->
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<style type="text/css">
|
||||
body {
|
||||
background: #fff;
|
||||
@ -20,6 +20,9 @@
|
||||
margin: 0;
|
||||
padding: 0 100px;
|
||||
}
|
||||
h1 > small > code { /* i know this is lazy solution lol, but its a quick fix for now. */
|
||||
font-size: 14px;
|
||||
}
|
||||
h3 {
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
@ -36,39 +39,154 @@
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<h1>Keyrune</h1>
|
||||
<h2>Set Symbol Demos</h2>
|
||||
<p>
|
||||
<!-- header -->
|
||||
<div class="row column">
|
||||
<header>
|
||||
<h1>Keyrune <small><code>ver 1.7.2_sass</code></small></h1>
|
||||
<h2 class="subheader">Set Symbol Demos</h2>
|
||||
<p>
|
||||
This HTML file is for demo purposes and is not necessary for Keyrune installation or use.
|
||||
You can view a few of the set symbol font icons and the available examples below
|
||||
(some may only be available for specific browsers).
|
||||
</p>
|
||||
</p>
|
||||
</header>
|
||||
</div> <!-- /.row -->
|
||||
|
||||
<!-- common examples -->
|
||||
<div class="row text-center">
|
||||
<div class="columns small-12 medium-12 large-6">
|
||||
<h3>Default Setsymbol, Common <small>(w/out gradient)</small></h3>
|
||||
<p>
|
||||
<i class="ss ss-default ss-common ss-6x"></i>
|
||||
<i class="ss ss-default ss-common ss-5x"></i>
|
||||
<i class="ss ss-default ss-common ss-4x"></i>
|
||||
<i class="ss ss-default ss-common ss-3x"></i>
|
||||
<i class="ss ss-default ss-common ss-2x"></i>
|
||||
<i class="ss ss-default ss-common ss-1x"></i>
|
||||
</p>
|
||||
</div>
|
||||
<h3>Default Setsymbol, Common <small>(w/ gradient)</small></h3>
|
||||
<p>
|
||||
<i class="ss ss-leg ss-3x ss-common"></i>
|
||||
<i class="ss ss-leg ss-2x ss-common"></i>
|
||||
<i class="ss ss-leg ss-common"></i>
|
||||
Common (Legends)
|
||||
</p>
|
||||
<p>
|
||||
<i class="ss ss-ons ss-3x ss-uncommon ss-grad"></i>
|
||||
<i class="ss ss-ons ss-2x ss-uncommon"></i>
|
||||
<i class="ss ss-ons ss-uncommon"></i>
|
||||
Uncommon (Onslaught)
|
||||
</p>
|
||||
<p>
|
||||
<i class="ss ss-fut ss-3x ss-rare ss-grad"></i>
|
||||
<i class="ss ss-fut ss-2x ss-rare"></i>
|
||||
<i class="ss ss-fut ss-rare"></i>
|
||||
Rare (Future Sight)
|
||||
</p>
|
||||
<p>
|
||||
<i class="ss ss-wwk ss-3x ss-mythic ss-grad"></i>
|
||||
<i class="ss ss-wwk ss-2x ss-mythic"></i>
|
||||
<i class="ss ss-wwk ss-mythic"></i>
|
||||
Mythic Rare (Worldwake)
|
||||
<i class="ss ss-default ss-common ss-grad ss-6x"></i>
|
||||
<i class="ss ss-default ss-common ss-grad ss-5x"></i>
|
||||
<i class="ss ss-default ss-common ss-grad ss-4x"></i>
|
||||
<i class="ss ss-default ss-common ss-grad ss-3x"></i>
|
||||
<i class="ss ss-default ss-common ss-grad ss-2x"></i>
|
||||
<i class="ss ss-default ss-common ss-grad ss-1x"></i>
|
||||
</p>
|
||||
</div> <!-- /.row -->
|
||||
|
||||
<!-- uncommon examples -->
|
||||
<div class="row text-center">
|
||||
<div class="columns small-12 medium-12 large-6">
|
||||
<h3>Default Setsymbol, Uncommon <small>(w/out gradient)</small></h3>
|
||||
<p>
|
||||
<i class="ss ss-default ss-uncommon ss-6x"></i>
|
||||
<i class="ss ss-default ss-uncommon ss-5x"></i>
|
||||
<i class="ss ss-default ss-uncommon ss-4x"></i>
|
||||
<i class="ss ss-default ss-uncommon ss-3x"></i>
|
||||
<i class="ss ss-default ss-uncommon ss-2x"></i>
|
||||
<i class="ss ss-default ss-uncommon ss-1x"></i>
|
||||
</p>
|
||||
</div>
|
||||
<div class="columns small-12 medium-12 large-6">
|
||||
<h3>Default Setsymbol, Uncommon <small>(w/ gradient)</small></h3>
|
||||
<p>
|
||||
<i class="ss ss-default ss-uncommon ss-grad ss-6x"></i>
|
||||
<i class="ss ss-default ss-uncommon ss-grad ss-5x"></i>
|
||||
<i class="ss ss-default ss-uncommon ss-grad ss-4x"></i>
|
||||
<i class="ss ss-default ss-uncommon ss-grad ss-3x"></i>
|
||||
<i class="ss ss-default ss-uncommon ss-grad ss-2x"></i>
|
||||
<i class="ss ss-default ss-uncommon ss-grad ss-1x"></i>
|
||||
</p>
|
||||
</div>
|
||||
</div> <!-- /.row -->
|
||||
|
||||
<!-- rare examples -->
|
||||
<div class="row text-center">
|
||||
<div class="columns small-12 medium-12 large-6">
|
||||
<h3>Default Setsymbol, Rare <small>(w/out gradient)</small></h3>
|
||||
<p>
|
||||
<i class="ss ss-default ss-rare ss-6x"></i>
|
||||
<i class="ss ss-default ss-rare ss-5x"></i>
|
||||
<i class="ss ss-default ss-rare ss-4x"></i>
|
||||
<i class="ss ss-default ss-rare ss-3x"></i>
|
||||
<i class="ss ss-default ss-rare ss-2x"></i>
|
||||
<i class="ss ss-default ss-rare ss-1x"></i>
|
||||
</p>
|
||||
</div>
|
||||
<div class="columns small-12 medium-12 large-6">
|
||||
<h3>Default Setsymbol, Rare <small>(w/ gradient)</small></h3>
|
||||
<p>
|
||||
<i class="ss ss-default ss-rare ss-grad ss-6x"></i>
|
||||
<i class="ss ss-default ss-rare ss-grad ss-5x"></i>
|
||||
<i class="ss ss-default ss-rare ss-grad ss-4x"></i>
|
||||
<i class="ss ss-default ss-rare ss-grad ss-3x"></i>
|
||||
<i class="ss ss-default ss-rare ss-grad ss-2x"></i>
|
||||
<i class="ss ss-default ss-rare ss-grad ss-1x"></i>
|
||||
</p>
|
||||
</div>
|
||||
</div> <!-- /.row -->
|
||||
|
||||
<!-- mythic examples -->
|
||||
<div class="row text-center">
|
||||
<div class="columns small-12 medium-12 large-6">
|
||||
<h3>Default Setsymbol, Mythic <small>(w/out gradient)</small></h3>
|
||||
<p>
|
||||
<i class="ss ss-default ss-mythic ss-6x"></i>
|
||||
<i class="ss ss-default ss-mythic ss-5x"></i>
|
||||
<i class="ss ss-default ss-mythic ss-4x"></i>
|
||||
<i class="ss ss-default ss-mythic ss-3x"></i>
|
||||
<i class="ss ss-default ss-mythic ss-2x"></i>
|
||||
<i class="ss ss-default ss-mythic ss-1x"></i>
|
||||
</p>
|
||||
</div>
|
||||
<div class="columns small-12 medium-12 large-6">
|
||||
<h3>Default Setsymbol, Mythic <small>(w/ gradient)</small></h3>
|
||||
<p>
|
||||
<i class="ss ss-default ss-mythic ss-grad ss-6x"></i>
|
||||
<i class="ss ss-default ss-mythic ss-grad ss-5x"></i>
|
||||
<i class="ss ss-default ss-mythic ss-grad ss-4x"></i>
|
||||
<i class="ss ss-default ss-mythic ss-grad ss-3x"></i>
|
||||
<i class="ss ss-default ss-mythic ss-grad ss-2x"></i>
|
||||
<i class="ss ss-default ss-mythic ss-grad ss-1x"></i>
|
||||
</p>
|
||||
</div>
|
||||
</div> <!-- /.row -->
|
||||
|
||||
<!-- old set symbol examples -->
|
||||
<!--
|
||||
<p>
|
||||
<i class="ss ss-leg ss-3x ss-common"></i>
|
||||
<i class="ss ss-leg ss-2x ss-common"></i>
|
||||
<i class="ss ss-leg ss-common"></i>
|
||||
Common (Legends)
|
||||
</p>
|
||||
<p>
|
||||
<i class="ss ss-ons ss-3x ss-uncommon ss-grad"></i>
|
||||
<i class="ss ss-ons ss-2x ss-uncommon"></i>
|
||||
<i class="ss ss-ons ss-uncommon"></i>
|
||||
Uncommon (Onslaught)
|
||||
</p>
|
||||
<p>
|
||||
<i class="ss ss-fut ss-3x ss-rare ss-grad"></i>
|
||||
<i class="ss ss-fut ss-2x ss-rare"></i>
|
||||
<i class="ss ss-fut ss-rare"></i>
|
||||
Rare (Future Sight)
|
||||
</p>
|
||||
<p>
|
||||
<i class="ss ss-wwk ss-3x ss-mythic ss-grad"></i>
|
||||
<i class="ss ss-wwk ss-2x ss-mythic"></i>
|
||||
<i class="ss ss-wwk ss-mythic"></i>
|
||||
Mythic Rare (Worldwake)
|
||||
</p>
|
||||
-->
|
||||
|
||||
<!-- footer -->
|
||||
<div class="row column">
|
||||
<footer>
|
||||
Made with ♥ by <a href="http://andrewgioia.com">Andrew Gioia</a>
|
||||
Made with ♥ by <a href="http://andrewgioia.com">Andrew Gioia</a>
|
||||
</footer>
|
||||
</div> <!-- /.row -->
|
||||
</body>
|
||||
</html>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user