add icons
They're awesome! and really tiny too!
This commit is contained in:
parent
369e8ece3d
commit
e54a9e865c
2 changed files with 127 additions and 101 deletions
219
beta.html
219
beta.html
|
@ -1,101 +1,118 @@
|
|||
<!DOCTYPE html>
|
||||
<!--[if !IE]><html><![endif]--><!--[if lte IE 7]><html class="ie"><![endif]-->
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>min</title>
|
||||
<link type="text/css" rel="stylesheet/less" href="min.less"/>
|
||||
<script src="less.js" type="text/javascript"></script>
|
||||
</head>
|
||||
<body>
|
||||
<h1 class="title">min</h1>
|
||||
<h3>the tiny framework</h3>
|
||||
|
||||
<hr class="mediumwidth">
|
||||
|
||||
<div class="buttons">
|
||||
<a href="http://github.com/owenversteeg/min"><button class="smooth btn-a">btn-a</button></a>
|
||||
<a href="http://minfwk.com"><button class="smooth btn-b">btn-b</button></a>
|
||||
<a href="http://minframework.com"><button class="smooth btn-c">btn-c</button></a>
|
||||
<br><br>
|
||||
<a href="http://minframework.com"><button class="smooth btn-b btn-small">btn-small</button></a>
|
||||
</div>
|
||||
<hr class="mediumwidth">
|
||||
|
||||
<h1 class="title">h1 title</h1>
|
||||
<h1>h1</h1>
|
||||
<h2>h2</h2>
|
||||
<h3>h3</h3>
|
||||
<h4>h4</h4>
|
||||
<h5>h5</h5>
|
||||
<h6>h6</h6>
|
||||
|
||||
<hr class="mediumwidth">
|
||||
|
||||
<input type="text" class="smooth" placeholder="input type="text"">
|
||||
<br><br>
|
||||
<textarea rows="3" class="smooth" placeholder="textarea"></textarea>
|
||||
<br><br>
|
||||
<span class="addon-front">$</span><input type="text" class="smooth" placeholder="span class="addon-front"">
|
||||
|
||||
<hr class="mediumwidth">
|
||||
|
||||
<div class="mediumwidth">
|
||||
<div class="navbar">
|
||||
<a class="pagename" href="#">Min Framework</a>
|
||||
<a class="navbar-link" href="#">One</a>
|
||||
<a class="navbar-link" href="#">Two</a>
|
||||
<a class="navbar-link" href="#">Three</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<hr class="mediumwidth">
|
||||
|
||||
<div class="mediumwidth">
|
||||
<table class="table table-striped">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>#</th>
|
||||
<th>Widgets Sold</th>
|
||||
<th>Revenue (£)</th>
|
||||
<th>Profit (£)</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>1</td>
|
||||
<td>5</td>
|
||||
<td>10</td>
|
||||
<td>2</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>2</td>
|
||||
<td>10</td>
|
||||
<td>20</td>
|
||||
<td>4</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>3</td>
|
||||
<td>500</td>
|
||||
<td>1000</td>
|
||||
<td>200</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<hr class="mediumwidth">
|
||||
|
||||
<div class="mediumwidth">
|
||||
<message class="warning"><strong>Watch out!</strong> You don't have H9RBS.js installed.</message>
|
||||
|
||||
<br>
|
||||
|
||||
<message class="great"><strong>Great!</strong> You successfully frobjugated the minlingator's snorbdralob.</message>
|
||||
|
||||
<br>
|
||||
|
||||
<message><strong>Hey!</strong> You've got four thousand new grabjalognibs!</message>
|
||||
</div>
|
||||
<br><br>
|
||||
</body>
|
||||
</html>
|
||||
<!DOCTYPE html>
|
||||
<!--[if !IE]><html><![endif]--><!--[if lte IE 7]><html class="ie"><![endif]-->
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>min</title>
|
||||
<link type="text/css" rel="stylesheet/less" href="min.less"/>
|
||||
<script src="less.js" type="text/javascript"></script>
|
||||
</head>
|
||||
<body>
|
||||
<h1 class="title">min</h1>
|
||||
<h3>the tiny framework</h3>
|
||||
|
||||
<hr class="mediumwidth">
|
||||
|
||||
<div class="buttons">
|
||||
<a href="http://github.com/owenversteeg/min"><button class="smooth btn-a">btn-a</button></a>
|
||||
<a href="http://minfwk.com"><button class="smooth btn-b">btn-b</button></a>
|
||||
<a href="http://minframework.com"><button class="smooth btn-c">btn-c</button></a>
|
||||
<br><br>
|
||||
<a href="http://minframework.com"><button class="smooth btn-b btn-small">btn-small</button></a>
|
||||
</div>
|
||||
<hr class="mediumwidth">
|
||||
|
||||
<h1 class="title">h1 title</h1>
|
||||
<h1>h1</h1>
|
||||
<h2>h2</h2>
|
||||
<h3>h3</h3>
|
||||
<h4>h4</h4>
|
||||
<h5>h5</h5>
|
||||
<h6>h6</h6>
|
||||
|
||||
<hr class="mediumwidth">
|
||||
|
||||
<input type="text" class="smooth" placeholder="input type="text"">
|
||||
<br><br>
|
||||
<textarea rows="3" class="smooth" placeholder="textarea"></textarea>
|
||||
<br><br>
|
||||
<span class="addon-front">$</span><input type="text" class="smooth" placeholder="span class="addon-front"">
|
||||
|
||||
<hr class="mediumwidth">
|
||||
|
||||
<div class="mediumwidth">
|
||||
<div class="navbar">
|
||||
<a class="pagename" href="#">Min Framework</a>
|
||||
<a class="navbar-link" href="#">One</a>
|
||||
<a class="navbar-link" href="#">Two</a>
|
||||
<a class="navbar-link" href="#">Three</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<hr class="mediumwidth">
|
||||
|
||||
<div class="mediumwidth">
|
||||
<table class="table table-striped">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>#</th>
|
||||
<th>Widgets Sold</th>
|
||||
<th>Revenue (£)</th>
|
||||
<th>Profit (£)</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>1</td>
|
||||
<td>5</td>
|
||||
<td>10</td>
|
||||
<td>2</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>2</td>
|
||||
<td>10</td>
|
||||
<td>20</td>
|
||||
<td>4</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>3</td>
|
||||
<td>500</td>
|
||||
<td>1000</td>
|
||||
<td>200</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<hr class="mediumwidth">
|
||||
|
||||
<div class="mediumwidth">
|
||||
<message class="warning"><strong>Watch out!</strong> You don't have H9RBS.js installed.</message>
|
||||
|
||||
<br>
|
||||
|
||||
<message class="great"><strong>Great!</strong> You successfully frobjugated the minlingator's snorbdralob.</message>
|
||||
|
||||
<br>
|
||||
|
||||
<message><strong>Hey!</strong> You've got four thousand new grabjalognibs!</message>
|
||||
</div>
|
||||
|
||||
<hr class="mediumwidth">
|
||||
|
||||
<div class="icons">
|
||||
<ico>✉ ✰ ☁ ⌚ ⌘ ☎ ✈ ☑ ☒</ico>
|
||||
<br><br>
|
||||
<ico>♂ ♀ ⌛ ☀ ☮ ☢ ☠ ☣ ⌨</ico>
|
||||
<br><br>
|
||||
<ico>ⓧ © § ® ⌂ ℗ ☺ ☻ ☼</ico>
|
||||
<br><br>
|
||||
<ico>⇦ ⇧ ⇨ ⇩ ∡ ∿ ⊝ ⊘ ⌂</ico>
|
||||
<br><br>
|
||||
<ico>♠ ♣ ♥ ♦ ♪ ♫ ♭ ♮ ♯</ico>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<br>
|
||||
</body>
|
||||
</html>
|
||||
|
|
9
min.less
9
min.less
|
@ -230,6 +230,15 @@ message {
|
|||
}
|
||||
}
|
||||
|
||||
/*
|
||||
Icons
|
||||
*/
|
||||
|
||||
ico {
|
||||
font-size: 1.9375em;
|
||||
font-family: Lucida Sans Unicode, Lucida Grande, sans-serif; /* If you have to fall back to sans-serif you're screwed */
|
||||
}
|
||||
|
||||
/*
|
||||
IE hacks
|
||||
*/
|
||||
|
|
Loading…
Add table
Reference in a new issue