From e88f19f6ac5b2ccea80ad3746e26399568a2a4ce Mon Sep 17 00:00:00 2001
From: Alexander Zinchuk <alx.zinchuk@gmail.com>
Date: Fri, 24 Sep 2021 15:16:01 +0300
Subject: [PATCH] Revert "Profile: Parallax scrolling (#1427)"

This reverts commit f3b474056ce868e04e1b8dfc730272bab315c4d2.
---
 src/components/common/ProfileInfo.scss               | 11 -----------
 src/components/left/settings/Settings.scss           |  1 -
 src/components/left/settings/SettingsMain.tsx        |  2 +-
 src/components/mediaViewer/helpers/ghostAnimation.ts | 10 +++-------
 src/components/right/Profile.scss                    |  2 --
 src/components/right/Profile.tsx                     |  2 +-
 src/modules/actions/ui/initial.ts                    |  7 +------
 src/styles/index.scss                                |  6 ------
 src/util/environment.ts                              |  1 -
 9 files changed, 6 insertions(+), 36 deletions(-)

diff --git a/src/components/common/ProfileInfo.scss b/src/components/common/ProfileInfo.scss
index 1c1a743ab..9ea2d8cb1 100644
--- a/src/components/common/ProfileInfo.scss
+++ b/src/components/common/ProfileInfo.scss
@@ -1,12 +1,6 @@
 .ProfileInfo {
   aspect-ratio: 1 / 1;
   position: relative;
-  overflow: hidden;
-
-  body.is-safari #Main & {
-    transform: translateZ(-1px) scale(2);
-    transform-origin: 0 0;
-  }
 
   @supports not (aspect-ratio: 1 / 1) {
     &::before {
@@ -29,11 +23,6 @@
     top: 0;
     bottom: 0;
 
-    body:not(.is-firefox):not(.is-safari) & {
-      transform: translateZ(-1px) scale(2);
-      transform-origin: 0 0;
-    }
-
     > .Transition {
       width: 100%;
       height: 100%;
diff --git a/src/components/left/settings/Settings.scss b/src/components/left/settings/Settings.scss
index 778052900..e00f2fc78 100644
--- a/src/components/left/settings/Settings.scss
+++ b/src/components/left/settings/Settings.scss
@@ -99,7 +99,6 @@
     margin: 0 -.5rem .625rem;
     box-shadow: inset 0 -.0625rem 0 0 var(--color-background-secondary-accent);
     border-bottom: .625rem solid var(--color-background-secondary);
-    background-color: var(--color-background);
 
     .ListItem.narrow {
       margin-bottom: .25rem;
diff --git a/src/components/left/settings/SettingsMain.tsx b/src/components/left/settings/SettingsMain.tsx
index 69a5b504c..4f1d1a6e1 100644
--- a/src/components/left/settings/SettingsMain.tsx
+++ b/src/components/left/settings/SettingsMain.tsx
@@ -47,7 +47,7 @@ const SettingsMain: FC<OwnProps & StateProps & DispatchProps> = ({
   useHistoryBack(isActive, onReset, onScreenSelect, SettingsScreens.Main);
 
   return (
-    <div className="settings-content custom-scroll parallax-scroll">
+    <div className="settings-content custom-scroll">
       <div className="settings-main-menu">
         {currentUser && (
           <ProfileInfo
diff --git a/src/components/mediaViewer/helpers/ghostAnimation.ts b/src/components/mediaViewer/helpers/ghostAnimation.ts
index 4cb8a5103..595a459f2 100644
--- a/src/components/mediaViewer/helpers/ghostAnimation.ts
+++ b/src/components/mediaViewer/helpers/ghostAnimation.ts
@@ -53,11 +53,6 @@ export function animateOpening(
     fromHeight = uncovered.height;
   }
 
-  if (origin === MediaViewerOrigin.ProfileAvatar || origin === MediaViewerOrigin.SettingsAvatar) {
-    fromWidth = fromImage.offsetWidth;
-    fromHeight = fromImage.offsetHeight;
-  }
-
   const fromTranslateX = (fromLeft + fromWidth / 2) - (toLeft + toWidth / 2);
   const fromTranslateY = (fromTop + fromHeight / 2) - (toTop + toHeight / 2);
   const fromScaleX = fromWidth / toWidth;
@@ -110,8 +105,9 @@ export function animateClosing(origin: MediaViewerOrigin, bestImageData: string,
   const {
     top: fromTop, left: fromLeft, width: fromWidth, height: fromHeight,
   } = fromImage.getBoundingClientRect();
-  const { top: targetTop, left: toLeft } = toImage.getBoundingClientRect();
-  const { offsetWidth: toWidth, offsetHeight: toHeight } = toImage;
+  const {
+    top: targetTop, left: toLeft, width: toWidth, height: toHeight,
+  } = toImage.getBoundingClientRect();
 
   let toTop = targetTop;
   if (!isElementInViewport(container)) {
diff --git a/src/components/right/Profile.scss b/src/components/right/Profile.scss
index 3497df9aa..f3f2ed93b 100644
--- a/src/components/right/Profile.scss
+++ b/src/components/right/Profile.scss
@@ -21,7 +21,6 @@
     padding: .875rem .5rem .5rem;
     box-shadow: inset 0 -.0625rem 0 0 var(--color-background-secondary-accent);
     border-bottom: .625rem solid var(--color-background-secondary);
-    background-color: var(--color-background);
 
     .narrow {
       margin-bottom: 0;
@@ -51,7 +50,6 @@
 .shared-media {
   display: flex;
   flex-direction: column-reverse;
-  background-color: var(--color-background);
 
   .TabList {
     background: var(--color-background);
diff --git a/src/components/right/Profile.tsx b/src/components/right/Profile.tsx
index 594e34a0c..9c5ad25b7 100644
--- a/src/components/right/Profile.tsx
+++ b/src/components/right/Profile.tsx
@@ -375,7 +375,7 @@ const Profile: FC<OwnProps & StateProps & DispatchProps> = ({
   return (
     <InfiniteScroll
       ref={containerRef}
-      className="Profile custom-scroll parallax-scroll"
+      className="Profile custom-scroll"
       itemSelector={buildInfiniteScrollItemSelector(resultType)}
       items={canRenderContents ? viewportIds : undefined}
       cacheBuster={cacheBuster}
diff --git a/src/modules/actions/ui/initial.ts b/src/modules/actions/ui/initial.ts
index f38a74b51..672ebccec 100644
--- a/src/modules/actions/ui/initial.ts
+++ b/src/modules/actions/ui/initial.ts
@@ -2,7 +2,7 @@ import { addReducer, getGlobal, setGlobal } from '../../../lib/teact/teactn';
 
 import { ANIMATION_LEVEL_MAX } from '../../../config';
 import {
-  IS_ANDROID, IS_FIREFOX, IS_IOS, IS_MAC_OS, IS_SAFARI, IS_TOUCH_ENV,
+  IS_ANDROID, IS_IOS, IS_MAC_OS, IS_TOUCH_ENV,
 } from '../../../util/environment';
 import { setLanguage } from '../../../util/langProvider';
 import switchTheme from '../../../util/switchTheme';
@@ -38,11 +38,6 @@ addReducer('init', (global) => {
   } else if (IS_MAC_OS) {
     document.body.classList.add('is-macos');
   }
-  if (IS_FIREFOX) {
-    document.body.classList.add('is-firefox');
-  } else if (IS_SAFARI) {
-    document.body.classList.add('is-safari');
-  }
 });
 
 addReducer('setIsUiReady', (global, actions, payload) => {
diff --git a/src/styles/index.scss b/src/styles/index.scss
index 024a46ba7..06cfa77ab 100644
--- a/src/styles/index.scss
+++ b/src/styles/index.scss
@@ -147,12 +147,6 @@ body:not(.is-ios) {
   }
 }
 
-body:not(.is-firefox) .parallax-scroll {
-  perspective: 1px;
-  perspective-origin: left top;
-  transform: translateZ(0px);
-}
-
 .emoji-small {
   background: no-repeat;
   background-size: 1.25rem;
diff --git a/src/util/environment.ts b/src/util/environment.ts
index e4b6f5ae0..48f0c8eae 100644
--- a/src/util/environment.ts
+++ b/src/util/environment.ts
@@ -39,7 +39,6 @@ export const IS_MAC_OS = PLATFORM_ENV === 'macOS';
 export const IS_IOS = PLATFORM_ENV === 'iOS';
 export const IS_ANDROID = PLATFORM_ENV === 'Android';
 export const IS_SAFARI = /^((?!chrome|android).)*safari/i.test(navigator.userAgent);
-export const IS_FIREFOX = /firefox|iceweasel/i.test(navigator.userAgent);
 export const IS_PWA = window.matchMedia('(display-mode: standalone)').matches
 || (window.navigator as any).standalone
 || document.referrer.includes('android-app://');