crop_7_5 Badges

Badges can notify you that there are new or unread messages or notifications. Add the new class to the badge to give it the background.

Collections

Alan1 Alan4 Alan Alan14 
	            	
<div class="collection">
	<a href="#!" class="collection-item">Alan<span class="badge">1</span></a>
	<a href="#!" class="collection-item">Alan<span class="new badge">4</span></a>
	<a href="#!" class="collection-item">Alan</a>
	<a href="#!" class="collection-item">Alan<span class="badge">14</span></a>
</div>

Badges in Dropdown

Dropdown 
								
<ul id="dropdown2" class="dropdown-content">
	<li><a href="#!">one<span class="badge">1</span></a></li>
	<li><a href="#!">two<span class="new badge">1</span></a></li>
	<li><a href="#!">three</a></li>
</ul>
<a class="btn dropdown-button" href="#!" data-activates="dropdown2">Dropdown<i class="mdi-navigation-arrow-drop-down right"></i></a>

Badges in Navbar

								
<nav>
	<div class="nav-wrapper">
		<a href="" class="brand-logo">Logo</a>
		<ul id="nav-mobile" class="right hide-on-med-and-down">
			<li><a href="">sass</a></li>
			<li><a href="">sass <span class="new badge">4</span></a></li>
			<li><a href="">sass</a></li>
		</ul>
	</div>
</nav>