moon
/
soapbox
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Fix "external-video" from preview-card

This commit is contained in:
danidfra 2024-11-12 20:22:40 -03:00
parent 5545a2432b
commit 2cc5994e61
1 changed files with 5 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
src/components/preview-card.tsx
View File

@ -96,7 +96,7 @@ const PreviewCard: React.FC<IPreviewCard> = ({
return ( return (
<div <div
ref={setRef} ref={setRef}
className='relative w-2/5 flex-none overflow-hidden' className='relative w-full flex-none overflow-hidden'
dangerouslySetInnerHTML={content} dangerouslySetInnerHTML={content}
style={{ height }} style={{ height }}
/> />
@ -113,7 +113,7 @@ const PreviewCard: React.FC<IPreviewCard> = ({
const interactive = card.type !== 'link'; const interactive = card.type !== 'link';
horizontal = typeof horizontal === 'boolean' ? horizontal : interactive || embedded; horizontal = typeof horizontal === 'boolean' ? horizontal : interactive || embedded;
const className = clsx('flex overflow-hidden rounded-lg border border-solid border-gray-200 text-sm text-gray-800 no-underline dark:border-gray-800 dark:text-gray-200', { horizontal, compact, interactive, 'flex flex-col md:flex-row': card.type === 'link' }); const className = clsx('flex overflow-hidden rounded-lg border border-solid border-gray-200 text-sm text-gray-800 no-underline dark:border-gray-800 dark:text-gray-200', { '!block': horizontal, 'border-gray-200 dark:border-gray-800': compact, interactive, 'flex flex-col md:flex-row': card.type === 'link' });
const ratio = getRatio(card); const ratio = getRatio(card);
const height = (compact && !embedded) ? (width / (16 / 9)) : (width / ratio); const height = (compact && !embedded) ? (width / (16 / 9)) : (width / ratio);
@ -182,7 +182,7 @@ const PreviewCard: React.FC<IPreviewCard> = ({
} }
embed = ( embed = (
<div className='relative w-2/5 flex-none overflow-hidden'> <div className='relative w-full flex-none overflow-hidden' style={{ flex: '0 0 40%' }}>
{canvas} {canvas}
{thumbnail} {thumbnail}
@ -192,7 +192,7 @@ const PreviewCard: React.FC<IPreviewCard> = ({
<button onClick={handleEmbedClick} className='appearance-none text-gray-700 hover:text-gray-900 dark:text-gray-500 dark:hover:text-gray-100'> <button onClick={handleEmbedClick} className='appearance-none text-gray-700 hover:text-gray-900 dark:text-gray-500 dark:hover:text-gray-100'>
<SvgIcon <SvgIcon
src={iconVariant} src={iconVariant}
className='absolute left-1/2 top-1/2 size-[30px] -translate-x-1/2 -translate-y-1/2 text-inherit' className=' size-6 text-inherit'
/> />
</button> </button>
@ -206,7 +206,7 @@ const PreviewCard: React.FC<IPreviewCard> = ({
> >
<SvgIcon <SvgIcon
src={externalLinkIcon} src={externalLinkIcon}
className='absolute left-1/2 top-1/2 size-[30px] -translate-x-1/2 -translate-y-1/2 text-inherit' className='size-6 text-inherit'
/> />
</a> </a>
)} )}