Update files
This commit is contained in:
parent
10d909711d
commit
e4d76ba705
|
|
@ -159,14 +159,39 @@ export default function PostMenu({ post, currentUser, onClose, onDelete, onUpdat
|
|||
)
|
||||
}
|
||||
|
||||
const menuStyle = buttonPosition ? {
|
||||
position: 'fixed',
|
||||
top: `${buttonPosition.bottom + 4}px`,
|
||||
left: `${buttonPosition.left + (buttonPosition.right - buttonPosition.left) / 2}px`,
|
||||
transform: 'translateX(-50%)',
|
||||
width: 'auto',
|
||||
minWidth: '140px'
|
||||
} : {}
|
||||
const getMenuStyle = () => {
|
||||
if (!buttonPosition) return {}
|
||||
|
||||
const menuWidth = 160 // Примерная ширина меню
|
||||
const padding = 8 // Отступ от края экрана
|
||||
const buttonCenterX = buttonPosition.left + (buttonPosition.right - buttonPosition.left) / 2
|
||||
const windowWidth = window.innerWidth
|
||||
|
||||
let left = buttonCenterX
|
||||
let transform = 'translateX(-50%)'
|
||||
|
||||
// Проверка правого края
|
||||
if (buttonCenterX + menuWidth / 2 > windowWidth - padding) {
|
||||
left = windowWidth - padding - menuWidth / 2
|
||||
transform = 'translateX(-50%)'
|
||||
}
|
||||
|
||||
// Проверка левого края
|
||||
if (buttonCenterX - menuWidth / 2 < padding) {
|
||||
left = padding + menuWidth / 2
|
||||
transform = 'translateX(-50%)'
|
||||
}
|
||||
|
||||
return {
|
||||
position: 'fixed',
|
||||
top: `${buttonPosition.bottom + 4}px`,
|
||||
left: `${left}px`,
|
||||
transform: transform,
|
||||
width: 'auto',
|
||||
minWidth: '140px',
|
||||
maxWidth: `${windowWidth - padding * 2}px`
|
||||
}
|
||||
}
|
||||
|
||||
return createPortal(
|
||||
<div
|
||||
|
|
@ -175,20 +200,23 @@ export default function PostMenu({ post, currentUser, onClose, onDelete, onUpdat
|
|||
onTouchStart={(e) => e.stopPropagation()}
|
||||
onClick={handleOverlayClick}
|
||||
>
|
||||
<div className="menu-content" style={menuStyle} onClick={(e) => e.stopPropagation()}>
|
||||
<div className="menu-content" style={getMenuStyle()} onClick={(e) => e.stopPropagation()}>
|
||||
<div className="menu-items" onClick={(e) => e.stopPropagation()}>
|
||||
{isOwnPost || isModerator ? (
|
||||
{(isOwnPost || isModerator) && (
|
||||
<>
|
||||
<button className="menu-item" onClick={() => setShowEditModal(true)}>
|
||||
<Edit2 size={18} />
|
||||
<span>Редактировать</span>
|
||||
</button>
|
||||
{isOwnPost && (
|
||||
<button className="menu-item" onClick={() => setShowEditModal(true)}>
|
||||
<Edit2 size={18} />
|
||||
<span>Редактировать</span>
|
||||
</button>
|
||||
)}
|
||||
<button className="menu-item danger" onClick={onDelete}>
|
||||
<Trash2 size={18} />
|
||||
<span>Удалить</span>
|
||||
</button>
|
||||
</>
|
||||
) : (
|
||||
)}
|
||||
{!isOwnPost && (
|
||||
<button className="menu-item" onClick={() => setShowReportModal(true)}>
|
||||
<Flag size={18} />
|
||||
<span>Пожаловаться</span>
|
||||
|
|
|
|||
Loading…
Reference in New Issue