Changed Horizontal Split to be vertical + Whitespace to linebreak descriptions.
This commit is contained in:
parent
02b82240dd
commit
542107db78
3 changed files with 15 additions and 10 deletions
|
@ -20,3 +20,7 @@
|
||||||
.vertical-split .asset-display {
|
.vertical-split .asset-display {
|
||||||
height: 90vh;
|
height: 90vh;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.asset-description {
|
||||||
|
white-space: pre-line;
|
||||||
|
}
|
||||||
|
|
|
@ -12,6 +12,13 @@ class AssetInfo extends React.Component {
|
||||||
const { asset: { shortId, claimData : { channelName, certificateId, description, name, claimId, fileExt, contentType, thumbnail, host } } } = this.props;
|
const { asset: { shortId, claimData : { channelName, certificateId, description, name, claimId, fileExt, contentType, thumbnail, host } } } = this.props;
|
||||||
return (
|
return (
|
||||||
<div>
|
<div>
|
||||||
|
|
||||||
|
{description && (
|
||||||
|
<Row>
|
||||||
|
<p class='asset-description'>{description}</p>
|
||||||
|
</Row>
|
||||||
|
)}
|
||||||
|
|
||||||
{channelName && (
|
{channelName && (
|
||||||
<Row>
|
<Row>
|
||||||
<RowLabeled
|
<RowLabeled
|
||||||
|
@ -104,12 +111,6 @@ class AssetInfo extends React.Component {
|
||||||
</SpaceBetween>
|
</SpaceBetween>
|
||||||
</Row>
|
</Row>
|
||||||
|
|
||||||
{description && (
|
|
||||||
<Row>
|
|
||||||
<p>{description}</p>
|
|
||||||
</Row>
|
|
||||||
)}
|
|
||||||
|
|
||||||
<Row>
|
<Row>
|
||||||
<p>
|
<p>
|
||||||
Hosted via the <a className={'link--primary'} href={'https://lbry.io/get'} target={'_blank'}>LBRY</a> blockchain
|
Hosted via the <a className={'link--primary'} href={'https://lbry.io/get'} target={'_blank'}>LBRY</a> blockchain
|
||||||
|
|
|
@ -1,7 +1,7 @@
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import PageLayout from '@components/PageLayout';
|
import PageLayout from '@components/PageLayout';
|
||||||
|
|
||||||
import HorizontalSplit from '@components/HorizontalSplit';
|
import VerticalSplit from '@components/VerticalSplit';
|
||||||
import AssetTitle from '@containers/AssetTitle';
|
import AssetTitle from '@containers/AssetTitle';
|
||||||
import AssetDisplay from '@containers/AssetDisplay';
|
import AssetDisplay from '@containers/AssetDisplay';
|
||||||
import AssetInfo from '@containers/AssetInfo';
|
import AssetInfo from '@containers/AssetInfo';
|
||||||
|
@ -18,9 +18,9 @@ class ShowAssetDetails extends React.Component {
|
||||||
asset={asset}
|
asset={asset}
|
||||||
>
|
>
|
||||||
<AssetTitle />
|
<AssetTitle />
|
||||||
<HorizontalSplit
|
<VerticalSplit
|
||||||
leftSide={<AssetDisplay />}
|
top={<AssetDisplay />}
|
||||||
rightSide={<AssetInfo />}
|
bottom={<AssetInfo />}
|
||||||
/>
|
/>
|
||||||
</PageLayout>
|
</PageLayout>
|
||||||
);
|
);
|
||||||
|
|
Loading…
Reference in a new issue