diff --git a/src/components/left/main/Archive.module.scss b/src/components/left/main/Archive.module.scss index 6e84ea2f4..a88a64e79 100644 --- a/src/components/left/main/Archive.module.scss +++ b/src/components/left/main/Archive.module.scss @@ -52,6 +52,10 @@ .info { transition: opacity 0.3s ease, transform var(--layer-transition); + + :global(body.animation-level-0) & { + transition: none; + } } .icon { diff --git a/src/components/left/main/Chat.scss b/src/components/left/main/Chat.scss index ef07cb933..d6212f3a2 100644 --- a/src/components/left/main/Chat.scss +++ b/src/components/left/main/Chat.scss @@ -156,6 +156,10 @@ transform: translateX(-0.375rem) scaleY(0.5); transition: transform var(--layer-transition); + body.animation-level-0 & { + transition: none; + } + background: var(--color-primary); z-index: 1; @@ -206,12 +210,20 @@ .Badge-transition { transition: opacity var(--layer-transition), transform var(--layer-transition); + + body.animation-level-0 & { + transition: none; + } } } .info { transition: opacity 300ms ease, transform var(--layer-transition); + body.animation-level-0 & { + transition: none; + } + .title .custom-emoji { color: var(--color-primary); } diff --git a/src/components/left/main/ForumPanel.module.scss b/src/components/left/main/ForumPanel.module.scss index fa9316f7e..3db5fc95f 100644 --- a/src/components/left/main/ForumPanel.module.scss +++ b/src/components/left/main/ForumPanel.module.scss @@ -25,6 +25,10 @@ transition: transform var(--layer-transition); transform: translate3d(100%, 0, 0); + &.no-animation { + transition: none; + } + :global(.chat-list) { position: relative; overflow-x: hidden; diff --git a/src/components/left/main/ForumPanel.tsx b/src/components/left/main/ForumPanel.tsx index fab7c1937..9391467b7 100644 --- a/src/components/left/main/ForumPanel.tsx +++ b/src/components/left/main/ForumPanel.tsx @@ -9,7 +9,7 @@ import { MAIN_THREAD_ID } from '../../../api/types'; import { GENERAL_TOPIC_ID, - TOPICS_SLICE, TOPIC_HEIGHT_PX, TOPIC_LIST_SENSITIVE_AREA, + TOPICS_SLICE, TOPIC_HEIGHT_PX, TOPIC_LIST_SENSITIVE_AREA, ANIMATION_LEVEL_MIN, } from '../../../config'; import { IS_TOUCH_ENV } from '../../../util/environment'; import { @@ -52,6 +52,7 @@ type StateProps = { chat?: ApiChat; currentTopicId?: number; lastSyncTime?: number; + animationLevel?: number; }; const INTERSECTION_THROTTLE = 200; @@ -64,6 +65,7 @@ const ForumPanel: FC = ({ lastSyncTime, onTopicSearch, onCloseAnimationEnd, + animationLevel, }) => { const { closeForumPanel, openChatWithInfo, loadTopics, @@ -91,6 +93,12 @@ const ForumPanel: FC = ({ closeForumPanel(); }, [closeForumPanel]); + useEffect(() => { + if (animationLevel === ANIMATION_LEVEL_MIN && !isOpen) { + onCloseAnimationEnd?.(); + } + }, [animationLevel, isOpen, onCloseAnimationEnd]); + const handleToggleChatInfo = useCallback(() => { if (!chat) return; openChatWithInfo({ id: chat.id, shouldReplaceHistory: true }); @@ -196,6 +204,7 @@ const ForumPanel: FC = ({ styles.root, isScrolled && styles.scrolled, lang.isRtl && styles.rtl, + animationLevel === ANIMATION_LEVEL_MIN && styles.noAnimation, )} onTransitionEnd={!isOpen ? onCloseAnimationEnd : undefined} > @@ -277,6 +286,7 @@ export default memo(withGlobal( chat, lastSyncTime: global.lastSyncTime, currentTopicId: chatId === currentChatId ? currentThreadId : undefined, + animationLevel: global.settings.byKey.animationLevel, }; }, )(ForumPanel)); diff --git a/src/styles/_common.scss b/src/styles/_common.scss index 0339c9083..de70b2e46 100644 --- a/src/styles/_common.scss +++ b/src/styles/_common.scss @@ -124,6 +124,10 @@ .Avatar { transition: transform var(--layer-transition); + + body.animation-level-0 & { + transition: none; + } } .ListItem {