Differentiate content warning block if it is on lightbg

src/components/post_status_form/post_status_form.js

@@ -24,7 +24,8 @@ const PostStatusForm = {
     'replyTo',
     'repliedUser',
     'attentions',
-    'messageScope'
+    'messageScope',
+    'parentSpoilerText'
   ],
   components: {
     MediaUpload
@@ -50,7 +51,8 @@ const PostStatusForm = {
       newStatus: {
         status: statusText,
         files: [],
-        visibility: this.messageScope || 'public'
+        visibility: this.messageScope || 'public',
+        spoilerText: this.parentSpoilerText || null
       },
       caret: 0
     }

src/components/status/status.vue

@@ -105,7 +105,13 @@
       </div>
       <div class="container" v-if="replying">
         <div class="reply-left"/>
-        <post-status-form class="reply-body" :reply-to="status.id" :attentions="status.attentions" :repliedUser="status.user" :message-scope="status.visibility" v-on:posted="toggleReplying"/>
+        <post-status-form class="reply-body"
+          :reply-to="status.id"
+          :attentions="status.attentions" 
+          :repliedUser="status.user" 
+          :message-scope="status.visibility" 
+          :parentSpoilerText="status.summary"
+          v-on:posted="toggleReplying"/>
       </div>
     </template>
   </div>
@@ -500,9 +506,11 @@ a.unmute {
 .hiddenContent {
   margin: 8px;
   padding: 32px;
-    background: var(--lightBg, $fallback--lightBg);
-  color: #CCCCCC;
-    border-radius: var(--panelRadius, $fallback--panelRadius);
+  background: var(--lightBg, $fallback--lightBg);
+  border-radius: var(--panelRadius, $fallback--panelRadius);
+}
+.status-el_focused * .hiddenContent {
+  background: var(--bg, $fallback--bg);
 }
 .contentWarnedContent {
   margin: 8px;