Refactor alerts to have a base class, but no default class, thus requiring a modifier class at all times

2 files changed, 15 insertions, 19 deletions

diff --git a/less/alerts.less b/less/alerts.less
index 3ba463dba..be09d18d0 100644
--- a/less/alerts.less
+++ b/less/alerts.less
@@ -9,9 +9,7 @@
 .alert {
   padding: @alert-padding;
   margin-bottom: @line-height-computed;
-  color: @alert-text;
-  background-color: @alert-bg;
-  border: 1px solid @alert-border;
+  border: 1px solid transparent;
   border-radius: @alert-border-radius;
 
   // Headings for larger alerts
@@ -20,14 +18,9 @@
     // Specified for the h4 to prevent conflicts of changing @headingsColor
     color: inherit;
   }
-  // Match the hr to the border of the alert
-  hr {
-    border-top-color: darken(@alert-border, 5%);
-  }
   // Provide class for links that match alerts
   .alert-link {
     font-weight: @alert-link-font-weight;
-    color: darken(@alert-text, 10%);
   }
 
   // Improve alignment and spacing of inner content
@@ -63,9 +56,12 @@
 .alert-success {
   .alert-variant(@alert-success-bg; @alert-success-border; @alert-success-text);
 }
-.alert-danger {
-  .alert-variant(@alert-danger-bg; @alert-danger-border; @alert-danger-text);
-}
 .alert-info {
   .alert-variant(@alert-info-bg; @alert-info-border; @alert-info-text);
 }
+.alert-warning {
+  .alert-variant(@alert-warning-bg; @alert-warning-border; @alert-warning-text);
+}
+.alert-danger {
+  .alert-variant(@alert-danger-bg; @alert-danger-border; @alert-danger-text);
+}
diff --git a/less/variables.less b/less/variables.less
index 53aad251b..f2274b7f1 100644
--- a/less/variables.less
+++ b/less/variables.less
@@ -439,22 +439,22 @@
 @alert-border-radius:         @border-radius-base;
 @alert-link-font-weight:      bold;
 
-@alert-bg:                    @state-warning-bg;
-@alert-text:                  @state-warning-text;
-@alert-border:                @state-warning-border;
-
 @alert-success-bg:            @state-success-bg;
 @alert-success-text:          @state-success-text;
 @alert-success-border:        @state-success-border;
 
-@alert-danger-bg:             @state-danger-bg;
-@alert-danger-text:           @state-danger-text;
-@alert-danger-border:         @state-danger-border;
-
 @alert-info-bg:               @state-info-bg;
 @alert-info-text:             @state-info-text;
 @alert-info-border:           @state-info-border;
 
+@alert-warning-bg:            @state-warning-bg;
+@alert-warning-text:          @state-warning-text;
+@alert-warning-border:        @state-warning-border;
+
+@alert-danger-bg:             @state-danger-bg;
+@alert-danger-text:           @state-danger-text;
+@alert-danger-border:         @state-danger-border;
+
 
 // Progress bars
 // -------------------------