chore: handle app name and options too long (#2283)

This commit is contained in:
Joel 2024-01-30 14:53:10 +08:00 committed by GitHub
parent 57565db531
commit f8f4b961a1
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 5 additions and 5 deletions

View File

@ -59,7 +59,7 @@ const ConfigSelect: FC<IConfigSelectProps> = ({
return item return item
})) }))
}} }}
className={`${s.input} w-full px-1.5 text-sm leading-9 text-gray-900 border-0 grow h-9 bg-transparent focus:outline-none cursor-pointer`} className={'w-full pl-1.5 pr-8 text-sm leading-9 text-gray-900 border-0 grow h-9 bg-transparent focus:outline-none cursor-pointer'}
/> />
<RemoveIcon <RemoveIcon
className={`${s.deleteBtn} absolute top-1/2 translate-y-[-50%] right-1.5 items-center justify-center w-6 h-6 rounded-md cursor-pointer hover:bg-[#FEE4E2]`} className={`${s.deleteBtn} absolute top-1/2 translate-y-[-50%] right-1.5 items-center justify-center w-6 h-6 rounded-md cursor-pointer hover:bg-[#FEE4E2]`}

View File

@ -125,7 +125,7 @@ const Select: FC<ISelectProps> = ({
> >
{({ /* active, */ selected }) => ( {({ /* active, */ selected }) => (
<> <>
<span className={classNames('block truncate', selected && 'font-normal')}>{item.name}</span> <span className={classNames('block', selected && 'font-normal')}>{item.name}</span>
{selected && ( {selected && (
<span <span
className={classNames( className={classNames(
@ -209,7 +209,7 @@ const SimpleSelect: FC<ISelectProps> = ({
> >
{({ /* active, */ selected }) => ( {({ /* active, */ selected }) => (
<> <>
<span className={classNames('block truncate', selected && 'font-normal')}>{item.name}</span> <span className={classNames('block', selected && 'font-normal')}>{item.name}</span>
{selected && ( {selected && (
<span <span
className={classNames( className={classNames(

View File

@ -55,7 +55,7 @@ export default function AppNavItem({
<> <>
<div className='flex items-center space-x-2 w-0 grow'> <div className='flex items-center space-x-2 w-0 grow'>
<AppIcon size='tiny' icon={icon} background={icon_background} /> <AppIcon size='tiny' icon={icon} background={icon_background} />
<div className='overflow-hidden text-ellipsis whitespace-nowrap'>{name}</div> <div className='overflow-hidden text-ellipsis whitespace-nowrap' title={name}>{name}</div>
</div> </div>
<div className='shrink-0 h-6' onClick={e => e.stopPropagation()}> <div className='shrink-0 h-6' onClick={e => e.stopPropagation()}>
<ItemOperation <ItemOperation