fix: improve ProfileCard layout responsiveness by adding flex-wrap and adjusting container constraints
This commit is contained in:
@@ -89,8 +89,8 @@ export function ProfileCard({
|
||||
return (
|
||||
<div className="bg-white rounded-[20px] pt-0 px-4 pb-4 lg:pt-0 lg:px-5 lg:pb-5">
|
||||
{/* Name and Actions Row */}
|
||||
<div className="flex flex-col lg:flex-row lg:items-start lg:justify-between gap-4 mb-4">
|
||||
<div className="text-center lg:text-left">
|
||||
<div className="flex flex-col lg:flex-row lg:items-start lg:justify-between lg:flex-wrap gap-4 mb-4">
|
||||
<div className="text-center lg:text-left min-w-0 flex-1">
|
||||
<div className="flex items-center justify-center lg:justify-start gap-2 mb-1">
|
||||
<h1 className="text-[18px] text-[#00293d] font-serif">
|
||||
<span className="font-semibold">{firstName}</span>{' '}
|
||||
@@ -157,7 +157,7 @@ export function ProfileCard({
|
||||
</div>
|
||||
|
||||
{/* Action Buttons */}
|
||||
<div className="flex items-center justify-center lg:justify-start gap-3">
|
||||
<div className="flex flex-wrap items-center justify-center lg:justify-start gap-3 flex-shrink-0">
|
||||
{/* Message button - only enabled when connected */}
|
||||
{(showEditButton || connectionStatus === 'ACCEPTED') && (
|
||||
messageHref ? (
|
||||
|
||||
Reference in New Issue
Block a user