From ec6f4c171565cdc72c75d4ce21ed7915609e66df Mon Sep 17 00:00:00 2001
From: Ben Wheeler <wheeler.benjamin@gmail.com>
Date: Thu, 9 May 2019 15:08:54 -0400
Subject: [PATCH] for admins, handle markedbyfilter comments differently, color
 them yellow

---
 src/views/preview/comment/comment.jsx  |  6 +++++-
 src/views/preview/comment/comment.scss | 13 +++++++++++++
 2 files changed, 18 insertions(+), 1 deletion(-)

diff --git a/src/views/preview/comment/comment.jsx b/src/views/preview/comment/comment.jsx
index 4b498ac72..cbdeb7642 100644
--- a/src/views/preview/comment/comment.jsx
+++ b/src/views/preview/comment/comment.jsx
@@ -111,7 +111,10 @@ class Comment extends React.Component {
             visibility
         } = this.props;
 
-        const visible = visibility === 'visible';
+        // we allow comments that are fully visible, or markedByFilter (flagged by
+        // our bad words filter, but not at the critical level of offensiveness)
+        const markedByFilter = visibility === 'markedbyfilter';
+        const visible = markedByFilter || visibility === 'visible';
 
         let commentText = content;
         if (replyUsername) {
@@ -182,6 +185,7 @@ class Comment extends React.Component {
                     <div
                         className={classNames({
                             'comment-bubble': true,
+                            'comment-bubble-markedbyfilter': markedByFilter,
                             'comment-bubble-reported': !visible
                         })}
                     >
diff --git a/src/views/preview/comment/comment.scss b/src/views/preview/comment/comment.scss
index 34f913435..c78905e74 100644
--- a/src/views/preview/comment/comment.scss
+++ b/src/views/preview/comment/comment.scss
@@ -197,6 +197,19 @@
                     background: $reported-background;
                 }
             }
+
+            &.comment-bubble-markedbyfilter {
+                $markedbyfilter-outline:  $ui-yellow;
+                $markedbyfilter-background: rgb(255, 254, 210);
+
+                border-color: $markedbyfilter-outline;
+                background-color: $markedbyfilter-background;
+
+                &:before {
+                    border-color: $markedbyfilter-outline transparent $markedbyfilter-outline $markedbyfilter-outline;
+                    background: $markedbyfilter-background;
+                }
+            }
         }
 
         .comment-content {