43 lines
1.8 KiB
HTML
43 lines
1.8 KiB
HTML
---
|
|
layout: default
|
|
title: Ghost UI · Making publishing beautiful.
|
|
---
|
|
|
|
<header class="page-header">
|
|
<a class="menu-button" href="#"><span class="sr-only">Menu</span></a>
|
|
<h2>Home</h2>
|
|
</header>
|
|
|
|
<section class="page-content">
|
|
|
|
<h3>Badges</h3>
|
|
|
|
<div style="padding: 1rem; background: #333; overflow: hidden;">
|
|
<a class="nav-item content active" href="#">
|
|
<div class="nav-label"><i class="icon-content"></i> Content <span class="badge">42</span></div>
|
|
</a>
|
|
<a class="nav-item new-post" href="#">
|
|
<div class="nav-label"><i class="icon-add"></i> New Post <span class="badge badge-blue">4</span></div>
|
|
</a>
|
|
<a class="nav-item settings" href="#">
|
|
<div class="nav-label"><i class="icon-settings2"></i> Settings <span class="badge badge-red">1</span></div>
|
|
</a>
|
|
<a class="nav-item new-post" href="#">
|
|
<div class="nav-label"><i class="icon-question"></i> Lorem <span class="badge badge-green">2</span></div>
|
|
</a>
|
|
</div>
|
|
|
|
<hr>
|
|
<h3>Badges in Buttons</h3>
|
|
|
|
<button type="button" class="btn btn-blue">Blue <span class="badge">42</span></button>
|
|
<a href="#" type="button" class="btn btn-red">Red</a>
|
|
<a href="#" type="button" class="btn btn-green">Green <span class="badge">5</span></a>
|
|
|
|
<hr>
|
|
<h3>Badges in Text</h3>
|
|
|
|
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quam delectus deserunt <span class="badge">5</span> qui atque expedita aliquam error, repellat libero sint eveniet dolor, reiciendis ab quod iure accusamus. Quo assumenda <span class="badge badge-green">3</span> sunt quam nulla harum deserunt ducimus iusto dolorum praesentium laudantium aspernatur illum recusandae aliquid eligendi delectus, veritatis labore, nostrum, excepturi voluptatibus totam?</p>
|
|
|
|
|
|
</section> |