diff --git a/frontend/src/routes/admin/links/+page.svelte b/frontend/src/routes/admin/links/+page.svelte index 971d2e4..04c1ecd 100644 --- a/frontend/src/routes/admin/links/+page.svelte +++ b/frontend/src/routes/admin/links/+page.svelte @@ -113,8 +113,22 @@ dropdownPosition = null; } else { activeDropdown = linkId; + + // Estimate dropdown height (~5 items at ~33px each + padding ≈ 200px) + const estimatedMenuHeight = 200; + const spaceBelow = window.innerHeight - rect.bottom; + + let top: number; + if (spaceBelow < estimatedMenuHeight && rect.top > estimatedMenuHeight) { + // Not enough space below, open upward + top = rect.top - estimatedMenuHeight - 4; + } else { + // Default: open below + top = rect.bottom + 4; + } + dropdownPosition = { - top: rect.bottom + 4, + top, right: window.innerWidth - rect.right }; } diff --git a/frontend/src/routes/admin/users/+page.svelte b/frontend/src/routes/admin/users/+page.svelte index d685d08..519c622 100644 --- a/frontend/src/routes/admin/users/+page.svelte +++ b/frontend/src/routes/admin/users/+page.svelte @@ -89,8 +89,22 @@ dropdownPosition = null; } else { activeDropdown = userId; + + // Estimate dropdown height (~5 items at ~33px each + padding ≈ 200px) + const estimatedMenuHeight = 200; + const spaceBelow = window.innerHeight - rect.bottom; + + let top: number; + if (spaceBelow < estimatedMenuHeight && rect.top > estimatedMenuHeight) { + // Not enough space below, open upward + top = rect.top - estimatedMenuHeight - 4; + } else { + // Default: open below + top = rect.bottom + 4; + } + dropdownPosition = { - top: rect.bottom + 4, + top, right: window.innerWidth - rect.right }; }