fix: issue sidebar label overflow (#3788)

This commit is contained in:
Anmol Singh Bhatia 2024-02-25 22:36:33 +05:30 committed by GitHub
parent 395098417c
commit 31ebecba52
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

View File

@ -35,7 +35,7 @@ export const LabelListItem: FC<TLabelListItem> = (props) => {
return ( return (
<div <div
key={labelId} key={labelId}
className={`transition-all relative flex items-center gap-1 border border-custom-border-100 rounded-full text-xs p-0.5 px-1 group ${ className={`transition-all relative flex items-center gap-1 truncate border border-custom-border-100 rounded-full text-xs p-0.5 px-1 group ${
!disabled ? "cursor-pointer hover:border-red-500/50 hover:bg-red-500/20" : "cursor-not-allowed" !disabled ? "cursor-pointer hover:border-red-500/50 hover:bg-red-500/20" : "cursor-not-allowed"
} `} } `}
onClick={handleLabel} onClick={handleLabel}
@ -46,7 +46,7 @@ export const LabelListItem: FC<TLabelListItem> = (props) => {
backgroundColor: label.color ?? "#000000", backgroundColor: label.color ?? "#000000",
}} }}
/> />
<div className="flex-shrink-0">{label.name}</div> <div className="truncate">{label.name}</div>
{!disabled && ( {!disabled && (
<div className="flex-shrink-0"> <div className="flex-shrink-0">
<X className="transition-all h-2.5 w-2.5 group-hover:text-red-500" /> <X className="transition-all h-2.5 w-2.5 group-hover:text-red-500" />