diff --git a/packages/ui/src/components/ui/MobileOverlayPanel.tsx b/packages/ui/src/components/ui/MobileOverlayPanel.tsx index 23ded84e..9a3b2044 100644 --- a/packages/ui/src/components/ui/MobileOverlayPanel.tsx +++ b/packages/ui/src/components/ui/MobileOverlayPanel.tsx @@ -70,14 +70,14 @@ export const MobileOverlayPanel: React.FC = ({ const content = (
= ({
); })()} - + {children} {footer ? ( diff --git a/packages/ui/src/styles/mobile.css b/packages/ui/src/styles/mobile.css index 8db31d1e..7b4daed9 100644 --- a/packages/ui/src/styles/mobile.css +++ b/packages/ui/src/styles/mobile.css @@ -419,17 +419,6 @@ top: calc(0.2rem + (var(--oc-safe-area-top, 0px) * 0.3)); } - /* iOS-only: the original PWA dialog was offset down to clear the - status bar / notch. Android centers fine on its own and the extra - `top` + translate combo pushed dialogs (and their action buttons) - below the visible viewport, so keep this scoped to iOS. */ - @supports (-webkit-touch-callout: none) { - .pwa-dialog-content { - top: calc(50% + (var(--oc-safe-area-top, 0px) * 0.22)); - --tw-translate-y: calc(-50% + (var(--oc-safe-area-top, 0px) * 0.6)); - } - } - .pwa-dialog-content .settings-page-body { max-width: 100%; padding: 0.75rem 1rem; @@ -449,8 +438,7 @@ } .pwa-overlay-panel { - margin-bottom: max(var(--oc-safe-area-bottom-visual, 0px), 12px); - padding-bottom: calc(var(--oc-safe-area-bottom-visual, 0px) * 0.4); + margin-bottom: 0; } .pwa-overlay-panel .pwa-overlay-scroll {