Merge pull request #22 from RadiusNetworks/3167-change-alert-styles

Apply our gentler color theming to Alert stylings
RadiusNetworks · Mar 23, 2021 · 2a94f43 · 2a94f43
2 parents cb0e45c + cef75b4
commit 2a94f43
Show file tree

Hide file tree

Showing 3 changed files with 37 additions and 2 deletions.
diff --git a/app/assets/stylesheets/radius-theme/app/alerts.scss b/app/assets/stylesheets/radius-theme/app/alerts.scss
@@ -9,6 +9,23 @@ $alerts-position:                               60px;
 $alerts-z-index:                                9090;
 $alerts-width:                                  350px;
 
+// Color overrides
+.alert-success, .flash.notice {
+  @include alert-variant($alert-flash-notice-bg, $alert-flash-notice-border, $alert-flash-notice-color);
+}
+
+.alert-info, .flash.info {
+  @include alert-variant($alert-flash-info-bg, $alert-flash-info-border, $alert-flash-info-color);
+}
+
+.alert-warning, .flash.warning {
+  @include alert-variant($alert-flash-warning-bg, $alert-flash-warning-border, $alert-flash-warning-color);
+}
+
+.alert-danger, .flash.error {
+  @include alert-variant($alert-flash-error-bg, $alert-flash-error-border, $alert-flash-error-color);
+}
+
 // Message container for positioning
 
 .alerts {

diff --git a/app/assets/stylesheets/radius-theme/app/variables.scss b/app/assets/stylesheets/radius-theme/app/variables.scss
@@ -652,8 +652,26 @@ $modal-sm:                    300px;
 
 //== Alerts
 //
-//## Define alert colors, border radius, and padding.
 
+//## Alert Colors defined using FlashHash keys -- Used in for alerts, form errors, and flashhashes
+$alert-flash-notice-color:  #468847;
+$alert-flash-notice-bg:     #dff0d8;
+$alert-flash-notice-border: #d6e9c6;
+
+$alert-flash-info-color:    #3a87ad;
+$alert-flash-info-bg:       #d9edf7;
+$alert-flash-info-border:   #bce8f1;
+
+$alert-flash-warning-color: #c09853;
+$alert-flash-warning-bg:    #fcf8e3;
+$alert-flash-warning-border:#fbeed5;
+
+$alert-flash-error-color:   #b94a48;
+$alert-flash-error-bg:      #f2dede;
+$alert-flash-error-border:  #eed3d7;
+
+//## Define alert colors, border radius, and padding.
+//## These are legacy definitions, preserved in case they are used elsewhere
 $alert-padding:               8px;
 $alert-border-radius:         $border-radius-small;
 $alert-link-font-weight:      bold;

diff --git a/lib/radius/rails/version.rb b/lib/radius/rails/version.rb
@@ -1,5 +1,5 @@
 module Radius
   module Rails
-    VERSION = "2.1.0"
+    VERSION = "2.1.1"
   end
 end