fixed small screen breaking (#1075)
* fixed small screen breaking * fixed lint err
This commit is contained in:
		
							parent
							
								
									ed4587b3af
								
							
						
					
					
						commit
						5291dade42
					
				
					 1 changed files with 40 additions and 33 deletions
				
			
		| 
						 | 
				
			
			@ -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>
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
		Loading…
	
		Reference in a new issue