diff --git a/src/renderer/component/fileListSearch/view.jsx b/src/renderer/component/fileListSearch/view.jsx index 48324f763..f9f0ecb6c 100644 --- a/src/renderer/component/fileListSearch/view.jsx +++ b/src/renderer/component/fileListSearch/view.jsx @@ -59,7 +59,7 @@ class FileListSearch extends React.PureComponent { query && (
-
{__('Files')}
+
{__('Content')}
{!isSearching && (fileResults.length ? ( fileResults.map(uri => ) diff --git a/src/renderer/component/fileTile/view.jsx b/src/renderer/component/fileTile/view.jsx index e68cc886b..f12d03aac 100644 --- a/src/renderer/component/fileTile/view.jsx +++ b/src/renderer/component/fileTile/view.jsx @@ -1,12 +1,13 @@ // @flow import * as React from 'react'; import * as icons from 'constants/icons'; -import { normalizeURI, isURIClaimable, parseURI } from 'lbry-redux'; +import { normalizeURI, parseURI } from 'lbry-redux'; import CardMedia from 'component/cardMedia'; import TruncatedText from 'component/common/truncated-text'; import Icon from 'component/common/icon'; import Button from 'component/button'; import classnames from 'classnames'; +import FilePrice from 'component/filePrice'; type Props = { fullWidth: boolean, // removes the max-width css @@ -21,11 +22,14 @@ type Props = { channel_name: string, claim_id: string, }, - metadata: {}, + metadata: ?{ + title: ?string, + thumbnail: ?string, + }, resolveUri: string => void, navigate: (string, ?{}) => void, clearPublish: () => void, - updatePublishForm: () => void, + updatePublishForm: ({}) => void, }; class FileTile extends React.PureComponent { @@ -98,6 +102,9 @@ class FileTile extends React.PureComponent { {showUri ? uri : channel || __('Anonymous')} {isRewardContent && } {showLocal && isDownloaded && } +
+ +
{!name && ( diff --git a/src/renderer/scss/_vars.scss b/src/renderer/scss/_vars.scss index 149242b63..cdfe3ddcf 100644 --- a/src/renderer/scss/_vars.scss +++ b/src/renderer/scss/_vars.scss @@ -146,7 +146,8 @@ $large-breakpoint: 1760px; --success-msg-bg: var(--color-green-light); /* File Tile Card */ - --file-tile--media-size: 60px; + --file-tile--media-height: 60px; + --file-tile--media-width: 94px; // 60 * (1 + 9/16) /* Modal */ --modal-width: 440px; diff --git a/src/renderer/scss/component/_card.scss b/src/renderer/scss/component/_card.scss index 8bd63a98d..84e74d3e2 100644 --- a/src/renderer/scss/component/_card.scss +++ b/src/renderer/scss/component/_card.scss @@ -131,6 +131,10 @@ } } +.card__subtitle-price { + padding-top: $spacing-vertical * 1/3; +} + .card__subtitle--file-info { display: flex; align-items: center; diff --git a/src/renderer/scss/component/_file-list.scss b/src/renderer/scss/component/_file-list.scss index a35ac115b..72cee988f 100644 --- a/src/renderer/scss/component/_file-list.scss +++ b/src/renderer/scss/component/_file-list.scss @@ -20,10 +20,10 @@ display: flex; margin-top: $spacing-vertical; max-width: 260px; - height: var(--file-tile--media-size); .card__media { - flex: 0 0 var(--file-tile--media-size); + height: var(--file-tile--media-height); + flex: 0 0 var(--file-tile--media-width); } .card__subtitle {