fix: исправлены проблемы с UI и скролинг
This commit is contained in:
parent
68aae28529
commit
5ace70d0dc
@ -7,7 +7,6 @@
|
|||||||
display: flex;
|
display: flex;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
touch-action: pan-y;
|
|
||||||
-webkit-touch-callout: none;
|
-webkit-touch-callout: none;
|
||||||
-webkit-user-select: none;
|
-webkit-user-select: none;
|
||||||
user-select: none;
|
user-select: none;
|
||||||
@ -19,6 +18,8 @@
|
|||||||
object-fit: cover;
|
object-fit: cover;
|
||||||
transition: opacity 0.3s ease;
|
transition: opacity 0.3s ease;
|
||||||
pointer-events: none;
|
pointer-events: none;
|
||||||
|
-webkit-user-drag: none;
|
||||||
|
user-drag: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
.hidden {
|
.hidden {
|
||||||
|
|||||||
@ -114,12 +114,6 @@ const ImageWithFallback: React.FC<ImageWithFallbackProps> = ({
|
|||||||
className={`${styles.container} ${className}`}
|
className={`${styles.container} ${className}`}
|
||||||
onClick={handleClick}
|
onClick={handleClick}
|
||||||
onContextMenu={onContextMenu}
|
onContextMenu={onContextMenu}
|
||||||
onTouchStart={(e) => {
|
|
||||||
// Предотвращаем стандартное поведение только если не в режиме удаления
|
|
||||||
if (!isDeleteMode && onContextMenu) {
|
|
||||||
e.preventDefault();
|
|
||||||
}
|
|
||||||
}}
|
|
||||||
>
|
>
|
||||||
{/* Показываем индикатор загрузки, если изображение загружается */}
|
{/* Показываем индикатор загрузки, если изображение загружается */}
|
||||||
{loading && (
|
{loading && (
|
||||||
|
|||||||
@ -20,6 +20,8 @@
|
|||||||
-webkit-overflow-scrolling: touch; /* Для плавного скролла на iOS */
|
-webkit-overflow-scrolling: touch; /* Для плавного скролла на iOS */
|
||||||
transform: translateY(var(--pull-distance, 0px));
|
transform: translateY(var(--pull-distance, 0px));
|
||||||
transition: transform 0.3s ease-out;
|
transition: transform 0.3s ease-out;
|
||||||
|
overscroll-behavior: contain;
|
||||||
|
will-change: transform;
|
||||||
}
|
}
|
||||||
|
|
||||||
.refreshIndicator {
|
.refreshIndicator {
|
||||||
|
|||||||
@ -226,7 +226,10 @@ const GalleryScreen: React.FC = () => {
|
|||||||
}, [pendingTasks.length]); // Зависимость от количества задач
|
}, [pendingTasks.length]); // Зависимость от количества задач
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className={styles.pullToRefreshContainer}>
|
<div
|
||||||
|
className={styles.pullToRefreshContainer}
|
||||||
|
onContextMenu={(e) => e.preventDefault()}
|
||||||
|
>
|
||||||
<div
|
<div
|
||||||
className={`${styles.refreshIndicator} ${refreshing ? styles.refreshing : ''}`}
|
className={`${styles.refreshIndicator} ${refreshing ? styles.refreshing : ''}`}
|
||||||
style={{ '--pull-distance': `${pullDistance}px` } as React.CSSProperties}
|
style={{ '--pull-distance': `${pullDistance}px` } as React.CSSProperties}
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user