Extract Welcome Broadcast Styling Into Its Own Stylesheet (#8862) [deploy]

* Extract Welcome Broadcast styling into its own stylesheet
  - Adds a stylesheet, notifications-welcome-broadcast.scss, for broadcasts
  - Adds notifications-welcome-broadcast to minimal.scss
  - Removes .broadcast-content from notifications.scss
  - Adds TODOs for team-delightful to both stylesheets for future work

* Adjust TODO to be more team-specific for future greps

app/assets/stylesheets/minimal.scss

@@ -17,6 +17,7 @@
 @import 'comments';
 @import 'leaderboard';
 @import 'notifications';
+@import 'notifications-welcome-broadcast';
 @import 'syntax';
 @import 'signup-modal';
 @import 'tags';

app/assets/stylesheets/notifications-welcome-broadcast.scss

@@ -0,0 +1,20 @@
+// TODO: [@thepracticaldev/delightful]: Refactor nesting in this file
+// in addition to notifications.scss so that the nesting is
+// not as deep as it currently is
+.notifications-index {
+  .home {
+    .articles-list {
+      .single-article {
+        .content {
+          &.broadcast-content {
+            .opt-out {
+              padding-top: 24px;
+              font-size: 12px;
+              font-style: italic;
+            }
+          }
+        }
+      }
+    }
+  }
+}

app/assets/stylesheets/notifications.scss

@@ -28,6 +28,8 @@
           }
         }
       }
+      // TODO: [@thepracticaldev/delightful]: Remove .signup-cue-advanced and .sloan
+      // from stylesheet since it does not appear to be used anywhere
       .signup-cue-advanced {
         text-align: left;
         padding: 30px 25px;
@@ -55,13 +57,6 @@
               font-weight: 500;
             }
           }
-          &.broadcast-content {
-            .opt-out {
-              padding-top: 24px;
-              font-size: 12px;
-              font-style: italic;
-            }
-          }
           &.reaction-content {
             width: calc(100% - 145px);
           }