pl-fe: sort of improve dropdown menu styles

Signed-off-by: Nicole Mikołajczyk <git@mkljczk.pl>
This commit is contained in:
Nicole Mikołajczyk
2025-04-09 15:23:18 +02:00
parent af9759eea1
commit f8ccbce964
2 changed files with 3 additions and 3 deletions

View File

@ -120,7 +120,7 @@ const DropdownMenuItem = ({ index, item, onClick, autoFocus, onSetTab }: IDropdo
>
{item.icon && <Icon src={item.icon} className='mr-3 size-5 flex-none rtl:ml-3 rtl:mr-0' />}
<div className={clsx('text-xs', { 'mr-2': item.count || item.type === 'toggle' || item.items?.length })}>
<div className={clsx('overflow-hidden text-xs', { 'mr-2': item.count || item.type === 'toggle' || item.items?.length })}>
<div className='truncate text-base'>{item.text}</div>
<div className='mt-0.5'>{item.meta}</div>
</div>

View File

@ -125,7 +125,7 @@ const DropdownMenuContent: React.FC<IDropdownMenuContent> = ({ handleClose, item
};
const renderItems = (items: Menu | undefined) => (
<ul>
<ul className='overflow-hidden'>
{items?.map((item, idx) => (
<DropdownMenuItem
key={idx}
@ -147,7 +147,7 @@ const DropdownMenuContent: React.FC<IDropdownMenuContent> = ({ handleClose, item
{Component && <Component handleClose={handleClose} />}
{(items?.length || touchscreen) && renderItems(items)}
</div>
<div className={clsx({ 'w-full': touchscreen, 'fit-content': !touchscreen })}>
<div className={clsx({ 'w-full': touchscreen, 'fit-content mr-auto': !touchscreen })}>
{tab !== undefined && (
<>
<HStack className='mx-2 my-1 text-gray-700 dark:text-gray-300' space={3} alignItems='center'>