fix(buttons): fix link state override

techfromsage · Oct 6, 2020 · 1e38bb9 · 1e38bb9
1 parent fd006ec
commit 1e38bb9
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 7 deletions.
diff --git a/assets/stylesheets/bootstrap/mixins/_alerts.scss b/assets/stylesheets/bootstrap/mixins/_alerts.scss
@@ -12,15 +12,20 @@
     color: $text-color;
   }
 
-  a {
+  a:not(.btn) {
     color: $text-color;
   }
 
-  .btn-alert {
+  a.btn-alert,
+  a.btn-alert--primary {
     text-decoration: none;
+  }
+
+  a.btn-alert.btn-alert:hover {
+    color: $black;
+  }
 
-    &:hover {
-      color: currentColor !important;
-    }
+  a.btn-alert--primary.btn-alert--primary:hover {
+    color: $white;
   }
 }
diff --git a/index.html b/index.html
@@ -673,8 +673,9 @@ <h2>Dropdowns</h2>
       <div class="col-xs-12">
         <h2>Alerts</h2>
         <!-- Basic -->
-        <div class="alert alert-info">
-          <span>Something has happened. Yup.</span> <button class="btn btn-alert">Click me</button> <button class="btn btn-alert--primary">Click me</button>
+        <div class="alert alert-info" id="alert">
+          <span>Something has happened. Yup.</span> <a href="#alert" class="btn btn-alert">Click me</a> <a href="#alert" class="btn btn-alert--primary">Click me</a>
+          <button class="btn btn-alert">Click me</button> <button class="btn btn-alert--primary">Click me</button>
         </div>
 
         <!-- Success -->