3dtours/travelplanning
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: cách các modals hiển thị trên browser điện thoại

Browse Source
This commit is contained in:
3dtours
2026-06-26 09:13:24 +07:00
parent 03ee337e28
commit 6d90a47c24
31 changed files with 789 additions and 532 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/components/CommentModal.tsx
+4 -4
View File
@@ -132,11 +132,11 @@ export const CommentModal: React.FC<CommentModalProps> = ({ isOpen, onClose, loc
if (!isOpen) return null;
return (
<div className="fixed inset-0 z-[5000] flex items-center justify-center p-4">
<div className="fixed inset-0 z-[5000] flex items-end sm:items-center justify-center p-0 sm:p-4">
<div className="absolute inset-0 bg-gray-900/60 backdrop-blur-sm animate-in fade-in duration-200" onClick={onClose} />
<div className="relative w-full max-w-md bg-[var(--surface)] rounded-[32px] shadow-2xl overflow-hidden flex flex-col max-h-[80vh] animate-in zoom-in-95 duration-200">
<div className="relative w-full h-full sm:max-w-md bg-[var(--surface)] rounded-t-2xl sm:rounded-[32px] shadow-2xl overflow-hidden flex flex-col sm:max-h-[85vh] animate-in zoom-in-95 duration-200">
{/* Header */}
<div className="p-6 border-b border-[var(--border)] flex justify-between items-center bg-[var(--surface)] sticky top-0 z-10">
<div className="p-6 border-b border-[var(--border)] flex justify-between items-center bg-[var(--surface)] sticky top-0 z-10 shrink-0">
<div>
<h3 className="text-xl font-black text-[var(--text-primary)] flex items-center gap-2">
<MessageSquare className="w-5 h-5 text-blue-600" />
@@ -186,7 +186,7 @@ export const CommentModal: React.FC<CommentModalProps> = ({ isOpen, onClose, loc
</div>
{/* Input Area */}
<div className="p-4 bg-[var(--surface)] border-t border-[var(--border)]">
<div className="p-4 bg-[var(--surface)] border-t border-[var(--border)] shrink-0">
<div className="relative flex items-center gap-2">
<input
type="text"