Osprey landing page and styling #632
2 changed files with 26 additions and 11 deletions
|
@ -9,3 +9,12 @@
|
|||
background-color: #ffffff;
|
||||
width: calc(100% - 12px - 12px - 2px);
|
||||
}
|
||||
|
||||
h6.list-title {
|
||||
margin: 0;
|
||||
text-overflow: ellipsis;
|
||||
word-wrap: break-word;
|
||||
overflow: hidden;
|
||||
line-height: 1em;
|
||||
max-height: 2em;
|
||||
}
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
import React from 'react';
|
||||
import { Link } from 'react-router-dom';
|
||||
|
||||
const AssetPreview = ({ defaultThumbnail, claimData: { name, claimId, fileExt, contentType, thumbnail } }) => {
|
||||
const AssetPreview = ({ defaultThumbnail, claimData: { name, claimId, fileExt, contentType, thumbnail, title } }) => {
|
||||
const embedUrl = `/${claimId}/${name}.${fileExt}`;
|
||||
const showUrl = `/${claimId}/${name}`;
|
||||
return (
|
||||
|
@ -13,19 +13,25 @@ const AssetPreview = ({ defaultThumbnail, claimData: { name, claimId, fileExt, c
|
|||
case 'image/png':
|
||||
case 'image/gif':
|
||||
return (
|
||||
<img
|
||||
className={'asset-preview-image'}
|
||||
src={embedUrl}
|
||||
alt={name}
|
||||
/>
|
||||
<div>
|
||||
<h6 class='list-title'>{title}</h6>
|
||||
<img
|
||||
className={'asset-preview-image'}
|
||||
src={embedUrl}
|
||||
alt={name}
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
case 'video/mp4':
|
||||
return (
|
||||
<img
|
||||
className={'asset-preview-video'}
|
||||
src={thumbnail || defaultThumbnail}
|
||||
alt={name}
|
||||
/>
|
||||
<div>
|
||||
<h6 class='list-title'>{title}</h6>
|
||||
<img
|
||||
className={'asset-preview-video'}
|
||||
src={thumbnail || defaultThumbnail}
|
||||
alt={name}
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
default:
|
||||
return (
|
||||
|
|
Loading…
Reference in a new issue