@ -152,7 +152,14 @@ const Item: React.FC<IItem> = ({
) ;
return (
< div className = { clsx ( 'media-gallery__item' , { standalone } ) } key = { attachment . id } style = { { position , float , left , top , right , bottom , height , width : ` ${ width } % ` } } >
< div
className = { clsx ( 'media-gallery__item' , {
standalone ,
'rounded-md' : total > 1 ,
} ) }
key = { attachment . id }
style = { { position , float , left , top , right , bottom , height , width : ` ${ width } % ` } }
>
< a className = 'media-gallery__item-thumbnail' href = { attachment . url } target = '_blank' style = { { cursor : 'pointer' } } >
< Blurhash hash = { attachment . blurhash } className = 'media-gallery__preview' / >
< span className = 'media-gallery__item__icons' > { attachmentIcon } < / span >
@ -245,7 +252,14 @@ const Item: React.FC<IItem> = ({
}
return (
< div className = { clsx ( 'media-gallery__item' , ` media-gallery__item-- ${ attachment . type } ` , { standalone } ) } key = { attachment . id } style = { { position , float , left , top , right , bottom , height , width : ` ${ width } % ` } } >
< div
className = { clsx ( 'media-gallery__item' , ` media-gallery__item-- ${ attachment . type } ` , {
standalone ,
'rounded-md' : total > 1 ,
} ) }
key = { attachment . id }
style = { { position , float , left , top , right , bottom , height , width : ` ${ width } % ` } }
>
{ last && total > ATTACHMENT_LIMIT && (
< div className = 'media-gallery__item-overflow' >
+ { total - ATTACHMENT_LIMIT + 1 }
@ -260,7 +274,7 @@ const Item: React.FC<IItem> = ({
) ;
} ;
interface IMediaGallery {
export interface IMediaGallery {
sensitive? : boolean
media : ImmutableList < Attachment >
height? : number
@ -270,13 +284,15 @@ interface IMediaGallery {
visible? : boolean
onToggleVisibility ? : ( ) = > void
displayMedia? : string
compact : boolean
compact? : boolean
className? : string
}
const MediaGallery : React.FC < IMediaGallery > = ( props ) = > {
const {
media ,
defaultWidth = 0 ,
className ,
onOpenMedia ,
cacheWidth ,
compact ,
@ -546,7 +562,11 @@ const MediaGallery: React.FC<IMediaGallery> = (props) => {
} , [ node . current ] ) ;
return (
< div className = { clsx ( 'media-gallery' , { 'media-gallery--compact' : compact } ) } style = { sizeData . style } ref = { node } >
< div
className = { clsx ( className , 'media-gallery' , { 'media-gallery--compact' : compact } ) }
style = { sizeData . style }
ref = { node }
>
{ children }
< / div >
) ;