Playing with colors for notices

src/_drafts/swiftui.md

@@ -179,15 +179,33 @@ $(document).ready(function() {
 }
 ```
 
-<p>notice</p>{: .notice}
+notice
-<p>primary</p>{: .notice--primary}
+{: .notice}
-<p>info</p>{: .notice--info}
+
-<p>warning</p>{: .notice--warning}
+primary
-<p>success</p>{: .notice--success}
+{: .notice--primary}
-<p>danger</p>{: .notice--danger}
+
+info
+{: .notice--info}
+
+warning
+{: .notice--warning}
+
+success
+{: .notice--success}
+
+danger
+{: .notice--danger}
+
+TIP: Unless you are wed to the theme, don't try porting it. Really. Headaches await. 🤯
+{: .notice--warning}
+
+**success**
+{: .notice--success}
+
 
 <div class="notice--success" markdown="1">
-  # Headline for the Notice
+  <h3> Headline for the Notice</h3>
   <br>
   Text for the notice
 </div>

src/assets/css/my-vars.scss

@@ -17,9 +17,9 @@ $code-background-color-dark: mix(rgb(59, 54, 54), $background-color, 20%) !defau
 
 /* Notices */
 
-$success-color: #3fa63f !default;
+$success-color: #02d702 !default;
 $warning-color: #d67f05 !default;
-$danger-color: #ff0000 !default;
+$danger-color: #d90404 !default;
 $info-color: #3b9cba !default;
 
 // section not needed under 11ty

src/assets/css/override-notices.scss

@@ -17,7 +17,7 @@
   font-family: $global-font-family;
   font-size: $type-size-6 !important;
   text-indent: initial; /* override*/
-  background-color: mix(#fff, $notice-color, 55%); //original percentage was 90
+  background-color: mix(#fff, $notice-color, 65%); //original percentage was 90
   border-radius: $border-radius;
   box-shadow: 0 1px 1px rgba($notice-color, 0.25);