forked from nutomic/lemmy
Only show it if it has a title.
This commit is contained in:
parent
2e38f934fe
commit
97fccb5615
1 changed files with 48 additions and 46 deletions
94
ui/src/components/iframely-card.tsx
vendored
94
ui/src/components/iframely-card.tsx
vendored
|
@ -27,60 +27,62 @@ export class IFramelyCard extends Component<
|
|||
let iframely = this.props.iframely;
|
||||
return (
|
||||
<>
|
||||
<div class="card my-2">
|
||||
<div class="row no-gutters">
|
||||
{iframely.thumbnail_url && (
|
||||
<div class="col-sm-3">
|
||||
{iframely.html ? (
|
||||
<span
|
||||
class="pointer"
|
||||
onClick={linkEvent(this, this.handleIframeExpand)}
|
||||
>
|
||||
<img class="card-img" src={iframely.thumbnail_url} />
|
||||
</span>
|
||||
) : (
|
||||
<img
|
||||
class="img-fluid card-img"
|
||||
src={iframely.thumbnail_url}
|
||||
/>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
<div class="col-sm-9">
|
||||
<div class="card-body">
|
||||
<h5 class="card-title d-inline">
|
||||
<span>
|
||||
<a class="text-body" target="_blank" href={iframely.url}>
|
||||
{iframely.title}
|
||||
</a>
|
||||
</span>
|
||||
</h5>
|
||||
<span class="d-inline-block ml-2 mb-2 small text-muted">
|
||||
<a class="text-muted" target="_blank" href={iframely.url}>
|
||||
{new URL(iframely.url).hostname}
|
||||
<svg class="ml-1 icon">
|
||||
<use xlinkHref="#icon-external-link"></use>
|
||||
</svg>
|
||||
</a>
|
||||
{iframely.html && (
|
||||
{iframely.title && (
|
||||
<div class="card my-2">
|
||||
<div class="row no-gutters">
|
||||
{iframely.thumbnail_url && (
|
||||
<div class="col-sm-3">
|
||||
{iframely.html ? (
|
||||
<span
|
||||
class="ml-2 pointer"
|
||||
class="pointer"
|
||||
onClick={linkEvent(this, this.handleIframeExpand)}
|
||||
>
|
||||
{this.state.expanded ? '[-]' : '[+]'}
|
||||
<img class="card-img" src={iframely.thumbnail_url} />
|
||||
</span>
|
||||
) : (
|
||||
<img
|
||||
class="img-fluid card-img"
|
||||
src={iframely.thumbnail_url}
|
||||
/>
|
||||
)}
|
||||
</span>
|
||||
{iframely.description && (
|
||||
<div
|
||||
className="card-text small text-muted md-div"
|
||||
dangerouslySetInnerHTML={mdToHtml(iframely.description)}
|
||||
/>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
<div class="col-sm-9">
|
||||
<div class="card-body">
|
||||
<h5 class="card-title d-inline">
|
||||
<span>
|
||||
<a class="text-body" target="_blank" href={iframely.url}>
|
||||
{iframely.title}
|
||||
</a>
|
||||
</span>
|
||||
</h5>
|
||||
<span class="d-inline-block ml-2 mb-2 small text-muted">
|
||||
<a class="text-muted" target="_blank" href={iframely.url}>
|
||||
{new URL(iframely.url).hostname}
|
||||
<svg class="ml-1 icon">
|
||||
<use xlinkHref="#icon-external-link"></use>
|
||||
</svg>
|
||||
</a>
|
||||
{iframely.html && (
|
||||
<span
|
||||
class="ml-2 pointer"
|
||||
onClick={linkEvent(this, this.handleIframeExpand)}
|
||||
>
|
||||
{this.state.expanded ? '[-]' : '[+]'}
|
||||
</span>
|
||||
)}
|
||||
</span>
|
||||
{iframely.description && (
|
||||
<div
|
||||
className="card-text small text-muted md-div"
|
||||
dangerouslySetInnerHTML={mdToHtml(iframely.description)}
|
||||
/>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
{this.state.expanded && (
|
||||
<div class="my-2 embed-responsive embed-responsive-16by9">
|
||||
<div
|
||||
|
|
Loading…
Reference in a new issue