Refactor modal components: update styling in ConnectionModal and TopUpModal for improved responsiveness, including adjustments to padding and margins for better compatibility with safe area insets on mobile devices.

This commit is contained in:
PEDZEO
2026-01-20 03:36:42 +03:00
parent 2d8a0bd63a
commit 1a642bb7d4
2 changed files with 13 additions and 13 deletions

View File

@@ -166,15 +166,15 @@ export default function TopUpModal({ method, onClose, initialAmountRubles }: Top
return (
<div
className="fixed inset-0 bg-black/70 z-[60] flex items-start sm:items-center justify-center p-4 overflow-y-auto"
style={{
paddingTop: 'calc(2rem + env(safe-area-inset-top, 0px))',
paddingBottom: 'calc(6rem + env(safe-area-inset-bottom, 0px))',
}}
className="fixed inset-0 bg-black/70 z-[60] flex items-center justify-center"
onClick={onClose}
>
<div
className="relative w-full max-w-sm bg-dark-900 rounded-2xl border border-dark-700/50 shadow-2xl overflow-hidden animate-scale-in"
className="w-[calc(100%-2rem)] max-w-sm bg-dark-900 rounded-2xl border border-dark-700/50 shadow-2xl overflow-hidden animate-scale-in"
style={{
marginTop: 'env(safe-area-inset-top, 0px)',
marginBottom: 'env(safe-area-inset-bottom, 0px)',
}}
onClick={(e) => e.stopPropagation()}
>
{/* Header */}