icon cleanup

static/app-strings.json

@@ -914,5 +914,6 @@
   "This will increase the overall bid amount for %title%, which will boost its ability to be discovered while active.": "This will increase the overall bid amount for %title%, which will boost its ability to be discovered while active.",
   "Support %amount% LBC": "Support %amount% LBC",
   "You deposited %amount% LBC as a support!": "You deposited %amount% LBC as a support!",
-  "LBRY Link": "LBRY Link"
-}
+  "LBRY Link": "LBRY Link",
+  "Publish to %uri%": "Publish to %uri%"
+}

ui/component/common/icon-custom.jsx

@@ -387,12 +387,9 @@ export const icons = {
   ),
   [ICONS.DOWNLOADABLE]: buildIcon(
     <g>
-      <rect x="2" y="2" width="20" height="20" rx="2" ry="2" />
-
-      <g transform="translate(0, 3)">
-        <polyline points="7 10 12 15 17 10" />
-        <line x1="12" y1="15" x2="12" y2="3" />
-      </g>
+      <path d="M19 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h11l5 5v11a2 2 0 0 1-2 2z" />
+      <polyline points="17 21 17 13 7 13 7 21" />
+      <polyline points="7 3 7 8 15 8" />
     </g>
   ),
 };

ui/component/fileProperties/view.jsx

@@ -21,11 +21,11 @@ export default function FileProperties(props: Props) {
 
   return (
     <div className={classnames('file-properties', { 'file-properties--small': small })}>
-      {isSubscribed && <Icon tooltip icon={icons.SUBSCRIBE} />}
-      {!claimIsMine && downloaded && <Icon tooltip icon={icons.DOWNLOAD} />}
       <FilePrice hideFree uri={uri} />
       <VideoDuration uri={uri} />
       <FileType uri={uri} />
+      {isSubscribed && <Icon tooltip icon={icons.SUBSCRIBE} />}
+      {!claimIsMine && downloaded && <Icon tooltip icon={icons.LIBRARY} />}
     </div>
   );
 }

ui/scss/component/_file-properties.scss

@@ -17,6 +17,11 @@
 
 .file-properties--small {
   font-size: var(--font-xsmall);
+  line-height: 1.2;
+
+  & > *:not(:last-child) {
+    margin-right: var(--spacing-miniscule);
+  }
 }
 
 .file-properties--large {