bigbuffet/pleroma
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Toast: remove unnecessary outer div

Browse source
This commit is contained in:
Alex Gleason 2022-12-23 11:33:10 -06:00
parent 69328ade8b
commit 95f7761fb4
No known key found for this signature in database
GPG key ID: 7211D1F99744FBB7
1 changed files with 26 additions and 28 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

54
app/soapbox/components/ui/toast/toast.tsx
View file

@ -103,43 +103,41 @@ const Toast = (props: IToast) => {
data-testid='toast' data-testid='toast'
className={ className={
classNames({ classNames({
'pointer-events-auto w-full max-w-sm overflow-hidden rounded-lg bg-white dark:bg-gray-900 shadow-lg dark:ring-2 dark:ring-gray-800': true, 'p-4 pointer-events-auto w-full max-w-sm overflow-hidden rounded-lg bg-white dark:bg-gray-900 shadow-lg dark:ring-2 dark:ring-gray-800': true,
'animate-enter': t.visible, 'animate-enter': t.visible,
'animate-leave': !t.visible, 'animate-leave': !t.visible,
}) })
} }
> >
<div className='p-4'> <HStack space={4} alignItems='start'>
<HStack space={4} alignItems='start'> <HStack space={3} justifyContent='between' alignItems='start' className='w-0 flex-1'>
<HStack space={3} justifyContent='between' alignItems='start' className='w-0 flex-1'> <HStack space={3} alignItems='start' className='w-0 flex-1'>
<HStack space={3} alignItems='start' className='w-0 flex-1'> <div className='flex-shrink-0'>
<div className='flex-shrink-0'> {renderIcon()}
{renderIcon()} </div>
</div>
<p className='pt-0.5 text-sm text-gray-900 dark:text-gray-100' data-testid='toast-message'> <p className='pt-0.5 text-sm text-gray-900 dark:text-gray-100' data-testid='toast-message'>
{renderText(message)} {renderText(message)}
</p> </p>
</HStack>
{/* Action */}
{renderAction()}
</HStack> </HStack>
{/* Dismiss Button */} {/* Action */}
<div className='flex flex-shrink-0 pt-0.5'> {renderAction()}
<button
type='button'
className='inline-flex rounded-md text-gray-600 dark:text-gray-600 hover:text-gray-700 dark:hover:text-gray-500 focus:outline-none focus:ring-2 focus:ring-primary-500 focus:ring-offset-2'
onClick={dismissToast}
data-testid='toast-dismiss'
>
<span className='sr-only'>Close</span>
<Icon src={require('@tabler/icons/x.svg')} className='w-5 h-5' />
</button>
</div>
</HStack> </HStack>
</div>
{/* Dismiss Button */}
<div className='flex flex-shrink-0 pt-0.5'>
<button
type='button'
className='inline-flex rounded-md text-gray-600 dark:text-gray-600 hover:text-gray-700 dark:hover:text-gray-500 focus:outline-none focus:ring-2 focus:ring-primary-500 focus:ring-offset-2'
onClick={dismissToast}
data-testid='toast-dismiss'
>
<span className='sr-only'>Close</span>
<Icon src={require('@tabler/icons/x.svg')} className='w-5 h-5' />
</button>
</div>
</HStack>
</div> </div>
); );
}; };