fixed small screen breaking (#1075)

* fixed small screen breaking

* fixed lint err
This commit is contained in:
Syed Ali Shahbaz 2021-10-29 18:29:23 +05:30 committed by GitHub
parent ed4587b3af
commit 5291dade42
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23

View file

@ -23,6 +23,7 @@ export default function MemberListItem(props: {
member && (
<li className="divide-y">
<div className="flex justify-between my-4">
<div className="flex flex-col justify-between w-full sm:flex-row">
<div className="flex">
<Avatar
imageSrc={
@ -31,7 +32,7 @@ export default function MemberListItem(props: {
: "https://eu.ui-avatars.com/api/?background=fff&color=039be5&name=" +
encodeURIComponent(props.member.name || "")
}
displayName={props.member.name || ""}
alt={props.member.name || ""}
className="rounded-full w-9 h-9"
/>
<div className="inline-block ml-3">
@ -39,7 +40,7 @@ export default function MemberListItem(props: {
<span className="block -mt-1 text-xs text-gray-400">{props.member.email}</span>
</div>
</div>
<div className="flex">
<div>
{props.member.role === "INVITEE" && (
<>
<span className="self-center h-6 px-3 py-1 mr-2 text-xs text-yellow-700 capitalize rounded-md bg-yellow-50">
@ -60,6 +61,11 @@ export default function MemberListItem(props: {
{t("owner")}
</span>
)}
</div>
</div>
<div className="flex">
{/* <div className="flex flex-col-reverse"> */}
<Dropdown>
<DropdownMenuTrigger>
<DotsHorizontalIcon className="w-5 h-5" />
@ -89,6 +95,7 @@ export default function MemberListItem(props: {
</DropdownMenuItem>
</DropdownMenuContent>
</Dropdown>
{/* </div> */}
</div>
</div>
</li>