Hide repost ribbon on category pages

ui/component/page/view.jsx

@@ -130,7 +130,7 @@ function Page(props: Props) {
           <main
             id={'main-content'}
             className={classnames(MAIN_CLASS, className, {
-              'main--full-width': fullWidthPage,
+              'main--full-width hide-ribbon': fullWidthPage,
               'main--auth-page': authPage,
               'main--file-page': filePage,
               'main--settings-page': settingsPage,

ui/page/home/view.jsx

@@ -15,6 +15,7 @@ import { GetLinksData } from 'util/buildHomepage';
 import { getLivestreamUris } from 'util/livestream';
 import ScheduledStreams from 'component/scheduledStreams';
 import { splitBySeparator } from 'util/lbryURI';
+import classnames from 'classnames';
 
 // @if TARGET='web'
 import Meme from 'web/component/meme';
@@ -102,7 +103,12 @@ function HomePage(props: Props) {
     );
 
     return (
-      <div key={title} className="claim-grid__wrapper">
+      <div
+        key={title}
+        className={classnames('claim-grid__wrapper', {
+          'show-ribbon': index === 0,
+        })}
+      >
         {/* category header */}
         {index !== 0 && title && typeof title === 'string' && (
           <SectionHeader title={__(title)} navigate={route || link} icon={icon} help={help} />

ui/scss/init/_gui.scss

@@ -601,6 +601,9 @@ img {
       fill: var(--color-header-background);
     }
   }
+  .show-ribbon {
+    background-color: #ff0000 !important;
+  }
 }
 
 // The following wrapper classes are temporary to fix page specific issues
@@ -949,6 +952,16 @@ img {
 .icon--ExternalLink {
   margin-top: -5px;
 }
+.hide-ribbon {
+  .claim-tile__repost-author {
+    display: none;
+  }
+}
+.show-ribbon {
+  .claim-tile__repost-author {
+    display: block;
+  }
+}
 
 // Fix Lightbox (Image viewer) modal backdrop bug
 // Context: transform, filter and perspective break "position: fixed" in child element