// -------------------------
.alert-success {
- background-color: @alert-success-bg;
- border-color: @alert-success-border;
- color: @alert-success-text;
- hr {
- border-top-color: darken(@alert-success-border, 5%);
- }
- .alert-link {
- color: darken(@alert-success-text, 10%);
- }
+ .alert-variant(@alert-success-bg, @alert-success-border, @alert-success-text);
}
.alert-danger {
- background-color: @alert-danger-bg;
- border-color: @alert-danger-border;
- color: @alert-danger-text;
- hr {
- border-top-color: darken(@alert-danger-border, 5%);
- }
- .alert-link {
- color: darken(@alert-danger-text, 10%);
- }
+ .alert-variant(@alert-danger-bg, @alert-danger-border, @alert-danger-text);
}
.alert-info {
- background-color: @alert-info-bg;
- border-color: @alert-info-border;
- color: @alert-info-text;
- hr {
- border-top-color: darken(@alert-info-border, 5%);
- }
- .alert-link {
- color: darken(@alert-info-text, 10%);
- }
+ .alert-variant(@alert-info-bg, @alert-info-border, @alert-info-text);
}
// Block alerts
border-bottom: 1px solid @bottom;
}
+// Alerts
+// -------------------------
+.alert-variant(@background, @border, @text-color) {
+ background-color: @background;
+ border-color: @border;
+ color: @text-color;
+ hr {
+ border-top-color: darken(@border, 5%);
+ }
+ .alert-link {
+ color: darken(@text-color, 10%);
+ }
+}
+
// Button psuedo states
// -------------------------
// Easily pump out default styles, as well as :hover, :focus, :active,