Flatten threads: make quote component less prominent

The height has been reduced and a gradient has been added to improve the
clipping of the text when the quote is collapsed.

Bug: twpowertools:156
Change-Id: Ic418158f20e25a51ee546616b480fa3fadd6403d
diff --git a/src/contentScripts/communityConsole/flattenThreads/components/index.js b/src/contentScripts/communityConsole/flattenThreads/components/index.js
index 8060a07..13b4dba 100644
--- a/src/contentScripts/communityConsole/flattenThreads/components/index.js
+++ b/src/contentScripts/communityConsole/flattenThreads/components/index.js
@@ -38,8 +38,10 @@
     }
 
     .quote-container:not(.quote-container--expanded) .payload-container {
-      max-height: 4rem;
+      max-height: 2.8rem;
       overflow: hidden;
+      mask-image: linear-gradient(rgb(0, 0, 0) 76%, transparent);
+      -webkit-mask-image: linear-gradient(rgb(0, 0, 0) 76%, transparent);
     }
 
     .payload-container twpt-flatten-thread-quote-author {