fix(settings/profile): anchor share dropdowns to their trigger buttons
Reverted fixed viewport positioning back to absolute — the parent cards no longer have overflow-hidden so absolute works correctly now. Both dropdowns (profile share and per-product share) appear directly below/above their trigger button instead of floating at a random screen corner. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
parent
f806e4d3bd
commit
94b80fd862
1 changed files with 2 additions and 2 deletions
|
|
@ -221,7 +221,7 @@ export default function ProfileSettingsPage() {
|
||||||
{profileShareOpen && (
|
{profileShareOpen && (
|
||||||
<>
|
<>
|
||||||
<div className="fixed inset-0 z-30" onClick={() => setProfileShareOpen(false)} />
|
<div className="fixed inset-0 z-30" onClick={() => setProfileShareOpen(false)} />
|
||||||
<div className="fixed right-4 z-40 bg-white dark:bg-gray-800 rounded-2xl shadow-xl border border-gray-100 dark:border-gray-700 p-3 w-52 space-y-1" style={{ top: "auto" }}>
|
<div className="absolute right-0 top-10 z-40 bg-white dark:bg-gray-800 rounded-2xl shadow-xl border border-gray-100 dark:border-gray-700 p-3 w-52 space-y-1">
|
||||||
<p className="text-xs text-gray-400 px-2 pb-1">Share your profile page</p>
|
<p className="text-xs text-gray-400 px-2 pb-1">Share your profile page</p>
|
||||||
<button onClick={() => { copyLink(profileUrl); setProfileShareOpen(false); }}
|
<button onClick={() => { copyLink(profileUrl); setProfileShareOpen(false); }}
|
||||||
className="w-full flex items-center gap-3 px-3 py-2.5 rounded-xl hover:bg-gray-50 dark:hover:bg-gray-700 text-sm text-gray-700 dark:text-gray-200">
|
className="w-full flex items-center gap-3 px-3 py-2.5 rounded-xl hover:bg-gray-50 dark:hover:bg-gray-700 text-sm text-gray-700 dark:text-gray-200">
|
||||||
|
|
@ -391,7 +391,7 @@ export default function ProfileSettingsPage() {
|
||||||
{shareProductId === p.id && (
|
{shareProductId === p.id && (
|
||||||
<>
|
<>
|
||||||
<div className="fixed inset-0 z-30" onClick={() => setShareProductId(null)} />
|
<div className="fixed inset-0 z-30" onClick={() => setShareProductId(null)} />
|
||||||
<div className="fixed right-4 bottom-28 z-40 bg-white dark:bg-gray-800 rounded-2xl shadow-xl border border-gray-100 dark:border-gray-700 p-3 w-52 space-y-1">
|
<div className="absolute right-0 bottom-8 z-40 bg-white dark:bg-gray-800 rounded-2xl shadow-xl border border-gray-100 dark:border-gray-700 p-3 w-52 space-y-1">
|
||||||
<p className="text-xs text-gray-400 px-2 pb-1 truncate">{p.title}</p>
|
<p className="text-xs text-gray-400 px-2 pb-1 truncate">{p.title}</p>
|
||||||
<button onClick={() => { copyLink(p.url); setShareProductId(null); }}
|
<button onClick={() => { copyLink(p.url); setShareProductId(null); }}
|
||||||
className="w-full flex items-center gap-3 px-3 py-2.5 rounded-xl hover:bg-gray-50 dark:hover:bg-gray-700 text-sm text-gray-700 dark:text-gray-200">
|
className="w-full flex items-center gap-3 px-3 py-2.5 rounded-xl hover:bg-gray-50 dark:hover:bg-gray-700 text-sm text-gray-700 dark:text-gray-200">
|
||||||
|
|
|
||||||
Loading…
Add table
Reference in a new issue