Contents

/**
 * @copyright	Copyright 2010-2013, The Titon Project
 * @license		http://opensource.org/licenses/bsd-license.php
 * @link		http://titon.io
 */

@import "../common";

/**
 *	<span class="badge is-success">15</span>
 *	<span class="label is-error">Required</span>
 */

.badge,
.label {
	@include reset-inline-block;
	color: #fff;
	// Shorthand doesn't work in IE
	font-weight: bold;
	font-size: .6rem;
	line-height: 100%;
	background: #282a2e;
	padding: 3px 5px;
	text-transform: uppercase;
	border-radius: 2px;
	white-space: nowrap;
	top: -1px;

	&:empty { display: none; }
}

.label {
	letter-spacing: 1px;
}

.badge {
	border-radius: 10px;
}

//-------------------- Modifiers --------------------//

.label.label--left {
	border-top-left-radius: 1px;
	border-bottom-left-radius: 1px;
	padding-left: 2px;
	margin-left: 10px;

	&:after {
		top: 0;
		right: 100%;
		content: "";
		height: 0;
		width: 0;
		position: absolute;
		border: .85em solid transparent;
		border-right-color: #282a2e;
	}
}

.label.label--right {
	border-top-right-radius: 1px;
	border-bottom-right-radius: 1px;
	padding-right: 2px;
	margin-right: 10px;

	&:after {
		top: 0;
		left: 100%;
		content: "";
		height: 0;
		width: 0;
		position: absolute;
		border: .85em solid transparent;
		border-left-color: #282a2e;
	}
}

Version data entries

3 entries across 3 versions & 1 rubygems

Version	Path
titon-toolkit-0.9.4	src/scss/toolkit/ui/label-badge.scss
titon-toolkit-0.9.3	src/scss/toolkit/ui/label-badge.scss
titon-toolkit-0.9.2	src/scss/toolkit/ui/label-badge.scss