CHG: Update Toasts styles and examples

1 files changed, 20 insertions, 43 deletions

diff --git a/dist/spectre.css b/dist/spectre.css
index 937453b..d165cdd 100644
--- a/dist/spectre.css
+++ b/dist/spectre.css
@@ -648,6 +648,7 @@ pre code {
   margin-left: .3rem;
   opacity: .45;
   padding: 0;
+  text-decoration: none;
 }
 .btn.btn-clear:hover {
   opacity: .85;
@@ -1024,18 +1025,10 @@ textarea.form-input {
   white-space: nowrap;
 }
 .label.label-primary {
-  background: #5764c6;
-  border-color: #4f5dc3;
-  color: #fff;
-}
-.label.label-primary a {
+  background: rgba(87, 100, 198, .9);
+  border-color: #5764c6;
   color: #fff;
 }
-.label.label-primary a:hover,
-.label.label-primary a:focus,
-.label.label-primary a:active {
-  opacity: .75;
-}
 .img-responsive {
   display: block;
   height: auto;
@@ -1821,56 +1814,40 @@ textarea.form-input {
   white-space: nowrap;
 }
 .toast {
-  background: #efefef;
-  border: .1rem solid #eaeaea;
+  background: rgba(51, 51, 51, .9);
+  border: .1rem solid #333;
+  border-color: #333;
   border-radius: .3rem;
-  color: #666;
+  color: #fff;
   display: block;
   padding: 1.4rem;
   width: 100%;
 }
 .toast.toast-primary {
-  background: #5764c6;
-  border-color: #4f5dc3;
-  color: #fff;
-}
-.toast.toast-primary a {
+  background: rgba(87, 100, 198, .9);
+  border-color: #5764c6;
   color: #fff;
 }
-.toast.toast-primary a:hover,
-.toast.toast-primary a:focus,
-.toast.toast-primary a:active {
-  opacity: .75;
-}
 .toast.toast-success {
-  background: #32b643;
-  border-color: #30ae40;
-  color: #fff;
-}
-.toast.toast-success a {
+  background: rgba(50, 182, 67, .9);
+  border-color: #32b643;
   color: #fff;
 }
-.toast.toast-success a:hover,
-.toast.toast-success a:focus,
-.toast.toast-success a:active {
-  opacity: .75;
-}
 .toast.toast-danger {
-  background: #e85600;
-  border-color: #de5200;
+  background: rgba(232, 86, 0, .9);
+  border-color: #e85600;
   color: #fff;
 }
-.toast.toast-danger a {
+.toast a {
   color: #fff;
+  text-decoration: underline;
 }
-.toast.toast-danger a:hover,
-.toast.toast-danger a:focus,
-.toast.toast-danger a:active {
+.toast a:hover,
+.toast a:focus,
+.toast a:active {
   opacity: .75;
 }
-.toast.toast-primary .btn-clear,
-.toast.toast-success .btn-clear,
-.toast.toast-danger .btn-clear {
+.toast .btn-clear {
   color: #fff;
 }
 .menu {
@@ -2026,7 +2003,7 @@ textarea.form-input {
   border-radius: .3rem;
   display: inline-block;
   margin: 0 .1rem;
-  padding: .6rem 1.2rem;
+  padding: .6rem .8rem;
   text-decoration: none;
 }
 .pagination .page-item a:focus,