update file layout and more fixes :)
This commit is contained in:
parent
3c31ad69ea
commit
2039ab7f21
4 changed files with 34 additions and 35 deletions
|
@ -80,7 +80,7 @@ class Video extends React.PureComponent {
|
||||||
loadStatusMessage = __("Downloading stream... not long left now!");
|
loadStatusMessage = __("Downloading stream... not long left now!");
|
||||||
}
|
}
|
||||||
|
|
||||||
let klasses = ["card"];
|
let klasses = [];
|
||||||
klasses.push(obscureNsfw ? "video--obscured " : "");
|
klasses.push(obscureNsfw ? "video--obscured " : "");
|
||||||
if (isLoading || isDownloading) klasses.push("video-embedded", "video");
|
if (isLoading || isDownloading) klasses.push("video-embedded", "video");
|
||||||
if (mediaType === "video") {
|
if (mediaType === "video") {
|
||||||
|
|
|
@ -63,44 +63,42 @@ class FilePage extends React.PureComponent {
|
||||||
mediaType === "audio";
|
mediaType === "audio";
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div>
|
<section className={"card " + (obscureNsfw ? "card--obscured " : "")}>
|
||||||
<section className="show-page-media">
|
<div className="show-page-media">
|
||||||
{isPlayable
|
{isPlayable
|
||||||
? <Video className="video-embedded" uri={uri} />
|
? <Video className="video-embedded" uri={uri} />
|
||||||
: metadata && metadata.thumbnail
|
: metadata && metadata.thumbnail
|
||||||
? <Thumbnail src={metadata.thumbnail} />
|
? <Thumbnail src={metadata.thumbnail} />
|
||||||
: <Thumbnail />}
|
: <Thumbnail />}
|
||||||
</section>
|
</div>
|
||||||
<section className={"card " + (obscureNsfw ? "card--obscured " : "")}>
|
<div className="card__inner">
|
||||||
<div className="card__inner">
|
{(!tab || tab === "details") &&
|
||||||
{(!tab || tab === "details") &&
|
<div>
|
||||||
<div>
|
{" "} {" "}
|
||||||
{" "} {" "}
|
<div className="card__title-identity">
|
||||||
<div className="card__title-identity">
|
{!fileInfo || fileInfo.written_bytes <= 0
|
||||||
{!fileInfo || fileInfo.written_bytes <= 0
|
? <span style={{ float: "right" }}>
|
||||||
? <span style={{ float: "right" }}>
|
<FilePrice uri={lbryuri.normalize(uri)} />
|
||||||
<FilePrice uri={lbryuri.normalize(uri)} />
|
{isRewardContent &&
|
||||||
{isRewardContent &&
|
<span>{" "}<Icon icon={icons.FEATURED} /></span>}
|
||||||
<span>{" "}<Icon icon={icons.FEATURED} /></span>}
|
|
||||||
</span>
|
|
||||||
: null}
|
|
||||||
<h1>{title}</h1>
|
|
||||||
<div className="card__subtitle">
|
|
||||||
<UriIndicator uri={uri} link={true} />
|
|
||||||
<span className="divider__vertical">•</span>
|
|
||||||
<span>
|
|
||||||
Published on{" "}
|
|
||||||
<DateTime block={height} show={DateTime.SHOW_DATE} />
|
|
||||||
</span>
|
</span>
|
||||||
</div>
|
: null}
|
||||||
|
<h1>{title}</h1>
|
||||||
|
<div className="card__subtitle">
|
||||||
|
<UriIndicator uri={uri} link={true} />
|
||||||
|
<span className="divider__vertical">•</span>
|
||||||
|
<span>
|
||||||
|
Published on{" "}
|
||||||
|
<DateTime block={height} show={DateTime.SHOW_DATE} />
|
||||||
|
</span>
|
||||||
</div>
|
</div>
|
||||||
<FileDetails uri={uri} />
|
</div>
|
||||||
</div>}
|
<FileDetails uri={uri} />
|
||||||
{tab === "tip" &&
|
</div>}
|
||||||
<WalletSendTip claim_id={claim.claim_id} uri={uri} />}
|
{tab === "tip" &&
|
||||||
</div>
|
<WalletSendTip claim_id={claim.claim_id} uri={uri} />}
|
||||||
</section>
|
</div>
|
||||||
</div>
|
</section>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -44,7 +44,7 @@
|
||||||
text-overflow: ellipsis;
|
text-overflow: ellipsis;
|
||||||
}
|
}
|
||||||
.card__title-identity {
|
.card__title-identity {
|
||||||
margin: $spacing-vertical * 1/2 0;
|
margin: 16px 0;
|
||||||
}
|
}
|
||||||
.card__actions {
|
.card__actions {
|
||||||
margin-top: var(--card-margin);
|
margin-top: var(--card-margin);
|
||||||
|
|
|
@ -1,6 +1,7 @@
|
||||||
.show-page-media {
|
.show-page-media {
|
||||||
text-align: center;
|
text-align: center;
|
||||||
margin-bottom: $spacing-vertical;
|
margin-bottom: 16px;
|
||||||
|
overflow: auto;
|
||||||
img {
|
img {
|
||||||
max-width: 100%;
|
max-width: 100%;
|
||||||
}
|
}
|
||||||
|
@ -9,4 +10,4 @@
|
||||||
width: 100%;
|
width: 100%;
|
||||||
min-height: 500px;
|
min-height: 500px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in a new issue