Fix: issue 2098, 2099 & 2192: Resolve text overflow issue (#2216)

This commit is contained in:
Shailesh Parmar 2022-01-14 19:46:42 +05:30 committed by GitHub
parent 60a28ffef6
commit 9a55d4efb5
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 22 additions and 6 deletions

View File

@ -249,7 +249,9 @@ const UserList: FunctionComponent<Props> = ({
className={`tw-group tw-text-grey-body tw-text-body tw-flex tw-justify-between ${getCurrentTeamClass( className={`tw-group tw-text-grey-body tw-text-body tw-flex tw-justify-between ${getCurrentTeamClass(
team.name team.name
)}`}> )}`}>
<p className="tw-text-center tag-category tw-self-center"> <p
className="tag-category tw-self-center tw-truncate tw-w-48"
title={team.displayName}>
{team.displayName} {team.displayName}
</p> </p>
</div> </div>

View File

@ -532,8 +532,9 @@ const ServicesPage = () => {
)}> )}>
<button> <button>
<h6 <h6
className="tw-text-base tw-text-grey-body tw-font-medium" className="tw-text-base tw-text-grey-body tw-font-medium tw-text-left tw-truncate tw-w-48"
data-testid={`service-name-${service.name}`}> data-testid={`service-name-${service.name}`}
title={service.name}>
{service.name} {service.name}
</h6> </h6>
</button> </button>

View File

@ -138,8 +138,21 @@ const UserCard = ({
<>{getDatasetTitle(item.name, item.description)}</> <>{getDatasetTitle(item.name, item.description)}</>
) : ( ) : (
<> <>
<p className="tw-font-normal">{item.description}</p> <p
<p>{isIconVisible ? item.name : capitalize(item.name)}</p> className={classNames(
'tw-font-normal',
isActionVisible ? 'tw-truncate tw-w-32' : null
)}
title={item.description}>
{item.description}
</p>
<p
className={classNames(
isActionVisible ? 'tw-truncate tw-w-32' : null
)}
title={isIconVisible ? item.name : capitalize(item.name)}>
{isIconVisible ? item.name : capitalize(item.name)}
</p>
</> </>
)} )}
</div> </div>

View File

@ -341,7 +341,7 @@ const TeamsPage = () => {
changeCurrentTeam(team.name); changeCurrentTeam(team.name);
}}> }}>
<p <p
className="tw-text-center tag-category label-category tw-self-center tw-truncate" className="tag-category label-category tw-self-center tw-truncate tw-w-52"
title={team.displayName}> title={team.displayName}>
{team.displayName} {team.displayName}
</p> </p>