CHG: Update Toasts styles and examples

5 files changed, 20 insertions, 22 deletions

diff --git a/src/buttons.less b/src/buttons.less
index a22f220..a21566b 100644
--- a/src/buttons.less
+++ b/src/buttons.less
@@ -112,6 +112,7 @@
     margin-left: .3rem;
     opacity: .45;
     padding: 0;
+    text-decoration: none;
 
     &:hover {
       opacity: .85;
diff --git a/src/navigation.less b/src/navigation.less
index 4918a7d..00bf86d 100644
--- a/src/navigation.less
+++ b/src/navigation.less
@@ -98,7 +98,7 @@
       border-radius: .3rem;
       display: inline-block;
       margin: 0 .1rem;
-      padding: .6rem 1.2rem;
+      padding: .6rem .8rem;
       text-decoration: none;
       &:focus,
       &:hover {
diff --git a/src/toasts.less b/src/toasts.less
index 2384b94..9f51cd9 100644
--- a/src/toasts.less
+++ b/src/toasts.less
@@ -1,11 +1,10 @@
 // Toasts
 .toast {
-  background: @core-border-color;
-  border: .1rem solid darken(@core-border-color, 2%);
+  border: .1rem solid @core-dark-color;
   border-radius: .3rem;
-  color: #666;
   display: block;
   padding: 1.4rem;
+  .toast-variant(@core-dark-color);
   width: 100%;
 
   &.toast-primary {
@@ -20,11 +19,18 @@
     .toast-variant(@control-color-danger);
   }
 
-  &.toast-primary,
-  &.toast-success,
-  &.toast-danger {
-    .btn-clear {
-      color: @core-light-color;
+  a {
+    color: @core-light-color;
+    text-decoration: underline;
+
+    &:hover,
+    &:focus,
+    &:active {
+      opacity: .75;
     }
   }
+
+  .btn-clear {
+    color: @core-light-color;
+  }
 }
diff --git a/src/tooltips.less b/src/tooltips.less
index 2ef0fc0..7eb25c0 100644
--- a/src/tooltips.less
+++ b/src/tooltips.less
@@ -2,7 +2,7 @@
 .tooltip {
   position: relative;
   &::after {
-    background: fade(#333, 90%);
+    background: fade(@core-dark-color, 90%);
     border-radius: .3rem;
     bottom: 100%;
     color: @core-light-color;
diff --git a/src/variables.less b/src/variables.less
index a983efd..3258162 100644
--- a/src/variables.less
+++ b/src/variables.less
@@ -15,6 +15,7 @@
 // Colors
 @core-color: #5764c6;
 @core-secondary-color: lighten(@core-color, 40%);
+@core-dark-color: #333;
 @core-light-color: #fff;
 @core-meta-color: #888;
 @core-link-color: #5764c6;
@@ -42,19 +43,9 @@
   }
 }
 .toast-variant(@color) {
-  background: @color;
-  border-color: darken(@color, 2%);
+  background: fade(@color, 90%);
+  border-color: @color;
   color: @core-light-color;
-
-  a {
-    color: @core-light-color;
-
-    &:hover,
-    &:focus,
-    &:active {
-      opacity: .75;
-    }
-  }
 }
 .label-base() {
   border-radius: .2rem;