Ghost/ghost/admin/docs/badges.html
2014-08-14 14:38:32 +01:00

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>