From 0fb3f60f324692052b0314f4c964b5ab2a4c7b5a Mon Sep 17 00:00:00 2001
From: Daniel Richards <daniel.richards@automattic.com>
Date: Thu, 25 May 2023 13:09:09 +0800
Subject: [PATCH] Revert "Browse Mode: Add snackbar notices (#50794)" (#50937)

This reverts commit a2d829595a8af90b4fc29283c2d59bbfa11af64d.
---
 packages/components/src/snackbar/list.tsx       |  1 +
 .../edit-site/src/components/editor/index.js    |  7 ++++++-
 .../edit-site/src/components/editor/style.scss  | 17 ++++++-----------
 .../edit-site/src/components/layout/index.js    | 12 +++---------
 4 files changed, 16 insertions(+), 21 deletions(-)

diff --git a/packages/components/src/snackbar/list.tsx b/packages/components/src/snackbar/list.tsx
index 5b3a82737dcd5..ebd1fca2518f5 100644
--- a/packages/components/src/snackbar/list.tsx
+++ b/packages/components/src/snackbar/list.tsx
@@ -73,6 +73,7 @@ export function SnackbarList( {
 
 					return (
 						<motion.div
+							layout={ ! isReducedMotion } // See https://www.framer.com/docs/animation/#layout-animations
 							initial={ 'init' }
 							animate={ 'open' }
 							exit={ 'exit' }
diff --git a/packages/edit-site/src/components/editor/index.js b/packages/edit-site/src/components/editor/index.js
index 72a8d41fb22f0..44b31c6945f57 100644
--- a/packages/edit-site/src/components/editor/index.js
+++ b/packages/edit-site/src/components/editor/index.js
@@ -180,7 +180,12 @@ export default function Editor( { isLoading } ) {
 									'is-loading': isLoading,
 								}
 							) }
-							notices={ <EditorSnackbars /> }
+							notices={
+								( isEditMode ||
+									window?.__experimentalEnableThemePreviews ) && (
+									<EditorSnackbars />
+								)
+							}
 							content={
 								<>
 									<GlobalStylesRenderer />
diff --git a/packages/edit-site/src/components/editor/style.scss b/packages/edit-site/src/components/editor/style.scss
index 70a12694cc3f7..b8795d9ba7cb3 100644
--- a/packages/edit-site/src/components/editor/style.scss
+++ b/packages/edit-site/src/components/editor/style.scss
@@ -19,16 +19,11 @@
 }
 
 // Adjust the position of the notices
-.edit-site {
-	.components-editor-notices__snackbar {
-		position: fixed;
-		right: 0;
-		bottom: 0;
-		padding: 16px;
-	}
-	.is-edit-mode .components-editor-notices__snackbar {
-		bottom: 24px;
-	}
+.edit-site .components-editor-notices__snackbar {
+	position: fixed;
+	right: 0;
+	bottom: 40px;
+	padding-left: 16px;
+	padding-right: 16px;
 }
-
 @include editor-left(".edit-site .components-editor-notices__snackbar")
diff --git a/packages/edit-site/src/components/layout/index.js b/packages/edit-site/src/components/layout/index.js
index 6b1430fdc66c5..83527bae6d7e3 100644
--- a/packages/edit-site/src/components/layout/index.js
+++ b/packages/edit-site/src/components/layout/index.js
@@ -215,7 +215,7 @@ export default function Layout() {
 									whileHover={
 										isEditorPage && canvasMode === 'view'
 											? {
-													scale: 1.006,
+													scale: 1.005,
 													transition: {
 														duration:
 															disableMotion ||
@@ -227,14 +227,8 @@ export default function Layout() {
 											  }
 											: {}
 									}
-									// Setting a transform property (in this case scale) on an element makes it act as a containing block for its descendants.
-									// This means that the snackbar notices inside this component are repositioned to be relative to this element.
-									// To avoid the snackbars jumping about we need to ensure that a transform property is always set.
-									// Setting a scale of 1 is interpred by framer as no change, so once the animation completes
-									// the transform property of this element is set to none, thus removing its role as a container block.
-									// Instead we set the initial scale of this element to 1.0001 so that there is always a transform property set.
-									// If we set the initial scale to less than 1.001 then JavaScript rounds it to 1 and the problem reoccurs.
-									initial={ { scale: 1.001 } }
+									initial={ false }
+									layout="position"
 									className="edit-site-layout__canvas"
 									transition={ {
 										type: 'tween',