Merge pull request #14 from joeltg/matt-fix-sides

Fix sidebar widths, handle overflow
This commit is contained in:
Joel Gustafson
2021-12-19 22:17:25 -05:00
committed by GitHub
2 changed files with 4 additions and 3 deletions

View File

@@ -12,16 +12,17 @@ export const Directory: React.FC<DirectoryProps> = (props) => {
return (
<div className="p-4 bg-white rounded-lg flex flex-col gap-2">
{props.users.map((user) => (
<div key={user.publicKey} className="flex gap-2 items-center">
<div key={user.publicKey} className="flex gap-2 items-center w-full">
<UserIcon user={user} />
<a
className="mt-0.5 hover:underline flex-1"
className="mt-0.5 hover:underline flex-1 overflow-hidden overflow-ellipsis"
href={`https://twitter.com/${user.twitterHandle}`}
>
{user.twitterHandle}
</a>
<a
href={`https://twitter.com/${user.twitterHandle}/status/${user.verificationTweetId}`}
className="flex-none"
>
<img
width={16}

View File

@@ -8,7 +8,7 @@ export function UserIcon({ user }: UserIconProps) {
return (
<a
href={`https://twitter.com/${user.twitterHandle}`}
className="inline-block relative h-6 w-6 bg-gray-200 rounded-full text-center text-gray-400 overflow-hidden border border-gray-200"
className="inline-block relative h-6 w-6 bg-gray-200 rounded-full text-center text-gray-400 overflow-hidden border border-gray-200 flex-none"
>
<img
className="absolute w-full h-full top-0 left-0"