minor design changes

ui/js/component/icon/view.jsx

@@ -11,36 +11,29 @@ export default class Icon extends React.PureComponent {
     fixed: false,
   };
 
-  getIconInfo() {
+  getIconClass() {
-    if (this.props.icon.startsWith("icon-")) {
+    const { icon } = this.props;
-      // Old style where FA icon class is passed in directly
-      return { className: this.props.icon, title: "" };
-    }
 
+    return icon.startsWith("icon-") ? icon : "icon-" + icon;
+  }
+
+  getIconTitle() {
     switch (this.props.icon) {
       case icons.FEATURED:
-        return {
+        return __("Watch this and earn rewards.");
-          className: "icon-rocket",
-          title: "Watch content with this icon to earn weekly rewards.",
-        };
       case icons.LOCAL:
-        return {
+        return __("You have a copy of this file.");
-          className: "icon-folder",
-          title: "You have a copy of this file.",
-        };
       default:
-        throw new Error(`Unknown icon type "${this.props.icon}"`);
+        return "";
     }
   }
 
   render() {
-    const { className, title } = this.getIconInfo();
+    const className = this.getIconClass(),
+      title = this.getIconTitle();
 
     const spanClassName =
-      "icon " +
+      "icon " + className + (this.props.fixed ? " icon-fixed-width " : "");
-      ("lbry-icon-" + this.props.icon + " ") +
-      className +
-      (this.props.fixed ? " icon-fixed-width " : "");
 
     return <span className={spanClassName} title={title} />;
   }

ui/js/constants/icons.js

@@ -1,2 +1,2 @@
-export const FEATURED = "featured";
+export const FEATURED = "rocket";
-export const LOCAL = "local";
+export const LOCAL = "folder";

ui/scss/_icons.scss

@@ -23,14 +23,10 @@
   transform: translate(0, 0);
 }
 
-/* Custom styles for LBRY icons */
-
-.lbry-icon-featured {
-  color: orangered;
-}
 
 /* Adjustments for icon size and alignment */
 .icon-rocket {
+  color: orangered;
   font-size: 0.95em;
   position: relative;
   top: -0.04em;