studio - changes all specific ss-icon-based selectors to use Font…

studio - changes all specific ss-icon-based selectors to use Font Awesome/generic icon- class name in notifications/prompts/alerts Sass

cms/static/sass/elements/_system-feedback.scss

@@ -204,7 +204,7 @@
   // types of prompts - error
   .prompt.error {
 
-    .icon-error {
+    [class^="icon"] {
       color: $red-l1;
     }
 
@@ -216,7 +216,7 @@
   // types of prompts - confirmation
   .prompt.confirmation {
 
-    .icon-error {
+    [class^="icon"] {
       color: $green;
     }
 
@@ -228,7 +228,7 @@
   // types of prompts - error
   .prompt.warning {
 
-    .icon-warning {
+    [class^="icon"] {
       color: $orange;
     }
 
@@ -253,7 +253,7 @@
   &.wrapper-notification-warning {
     @include box-shadow(0 -1px 3px $shadow, inset 0 3px 1px $orange);
 
-    .icon-warning {
+    [class^="icon"] {
       color: $orange;
     }
   }
@@ -261,7 +261,7 @@
   &.wrapper-notification-error {
     @include box-shadow(0 -1px 3px $shadow, inset 0 3px 1px $red-l1);
 
-    .icon-error {
+    [class^="icon"] {
       color: $red-l1;
     }
   }
@@ -269,7 +269,7 @@
   &.wrapper-notification-confirmation {
     @include box-shadow(0 -1px 3px $shadow, inset 0 3px 1px $green);
 
-    .icon-confirmation {
+    [class^="icon"] {
       color: $green;
     }
   }
@@ -294,13 +294,13 @@
       max-width: none;
       min-width: none;
 
-      .icon, .copy {
+      [class^="icon"], .copy {
         float: none;
         display: inline-block;
         vertical-align: middle;
       }
 
-      .icon {
+      [class^="icon"] {
         width: $baseline;
         height: ($baseline*1.25);
         margin-right: ($baseline*0.75);
@@ -329,7 +329,7 @@
       max-width: none;
       min-width: none;
 
-      .icon-help {
+      [class^="icon"] {
         width: $baseline;
         margin-right: ($baseline*0.75);
       }
@@ -357,13 +357,13 @@
     font-weight: 700;
   }
 
-  .icon, .copy {
+  [class^="icon"], .copy {
     float: left;
     display: inline-block;
     vertical-align: middle;
   }
 
-  .icon {
+  [class^="icon"] {
     @include transition (color 0.5s ease-in-out);
     @include font-size(22);
     width: flex-grid(1, 12);
@@ -389,7 +389,7 @@
   // with actions
   &.has-actions {
 
-    .icon {
+    [class^="icon"] {
       width: flex-grid(1, 12);
     }
 
@@ -436,7 +436,7 @@
 
   &.saving {
 
-    .icon-saving {
+    [class^="icon"] {
       @include anim-rotateClockwise(3s, linear, infinite);
       width: 22px;
     }
@@ -472,7 +472,7 @@
   &.wrapper-alert-warning {
     @include box-shadow(0 1px 1px $white, inset 0 2px 2px $shadow-d1, inset 0 -4px 1px $orange);
 
-    .icon-warning {
+    [class^="icon"] {
       color: $orange;
     }
   }
@@ -480,7 +480,7 @@
   &.wrapper-alert-error {
     @include box-shadow(0 1px 1px $white, inset 0 2px 2px $shadow-d1, inset 0 -4px 1px $red-l1);
 
-    .icon-error {
+    [class^="icon"] {
       color: $red-l1;
     }
   }
@@ -488,7 +488,7 @@
   &.wrapper-alert-confirmation {
     @include box-shadow(0 1px 1px $white, inset 0 2px 2px $shadow-d1, inset 0 -4px 1px $green);
 
-    .icon-confirmation {
+    [class^="icon"] {
       color: $green;
     }
   }
@@ -496,7 +496,7 @@
   &.wrapper-alert-announcement {
     @include box-shadow(0 1px 1px $white, inset 0 2px 2px $shadow-d1, inset 0 -4px 1px $blue);
 
-    .icon-announcement {
+    [class^="icon"] {
       color: $blue;
     }
   }
@@ -504,7 +504,7 @@
   &.wrapper-alert-step-required {
     @include box-shadow(0 1px 1px $white, inset 0 2px 2px $shadow-d1, inset 0 -4px 1px $pink);
 
-    .icon-step-required {
+    [class^="icon"] {
       color: $pink;
     }
   }
@@ -524,11 +524,11 @@
     font-weight: 700;
   }
 
-  .icon, .copy {
+  [class^="icon"], .copy {
     float: left;
   }
 
-  .icon {
+  [class^="icon"] {
     @include transition (color 0.5s ease-in-out);
     @include font-size(22);
     width: flex-grid(1, 12);
@@ -550,7 +550,7 @@
   // with actions
   &.has-actions {
 
-    .icon {
+    [class^="icon"] {
       width: flex-grid(1, 12);
     }
 
@@ -600,7 +600,7 @@
       @extend .text-sr;
     }
 
-    .icon {
+    [class^="icon"] {
       @include font-size(14);
       color: $white;
       width: auto;