Skip to content

Conversation

@msoham123
Copy link
Member

@msoham123 msoham123 commented Jan 3, 2023

Fixes the name overflowing on the longer named team card. Also fixes a react warning being thrown due to the absence of an unique key for each team member in the list.

</div>
<div className="flex flex-col flex-none items-start">
<div className="-mt-8 text-2xl font-inter text-stone-600 dark:text-zinc-300 text-left">{name}</div>
<div className="-mt-8 text-2xl font-inter text-stone-600 dark:text-zinc-300 text-left overflow-hidden lg:text-xl">{name}</div>
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I was looking into trying to use ellipses when it overflowed but couldn't make it work, maybe you can?

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I tried, but using tailwind's native truncate property didn't seem to work fully. https://stackoverflow.com/questions/53497656/tailwind-text-overflow-ellipsis

image

It truncates fine, but I can't seem to get ellipses at all for some reason. If you'd like, I can commit this here without the ellipses?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants