Browse Source

Actually adding badges... always forget.

pull/231/head
connors 11 years ago
parent
commit
80e63f4bac
  1. 73
      lib/sass/badges.scss

73
lib/sass/badges.scss

@ -0,0 +1,73 @@
//
// Badges
// --------------------------------------------------
[class*="badge"] {
display: inline-block;
color: $default-color;
&.badge-filled {
padding: 2px 9px;
color: #fff;
font-size: 13px;
line-height: 1;
background-color: $default-color;
border-radius: 100px;
}
}
// Badge modifiers
// --------------------------------------------------
// Main badge
.badge-primary {
color: $primary-color;
&.badge-filled {
background-color: $primary-color;
}
}
// Positive badge
.badge-positive {
color: $positive-color;
&.badge-filled {
background-color: $positive-color;
}
}
// Negative badge
.badge-negative {
color: $negative-color;
&.badge-filled {
background-color: $negative-color;
}
}
// Counts in buttons
// --------------------------------------------------
// Generic styles for all counts within default buttons
[class*="button"] [class*="badge"] {
font-size: 12px;
padding-top: 2px;
padding-bottom: 2px;
margin: -2px -4px -2px 4px;
}
// Styles for filled counts within filled buttons
.button-filled .badge-filled,
[class*="button"]:active .badge-filled {
background-color: rgba(0,0,0,.2);
}
// Position counts within block level buttons
// Note: These are absolutely positioned so that text of button isn't "pushed" by badge and always
// stays at true center of button
.button-block [class*="badge"] {
position: absolute;
right: 0;
margin-right: 10px;
}
Loading…
Cancel
Save