From 16a3f09b0d69dc669cf25aa3ebfba64dbfad1814 Mon Sep 17 00:00:00 2001
From: Laura Griffee <laura@mailzone.com>
Date: Fri, 19 Jan 2024 08:54:09 -0700
Subject: [PATCH] Update back action button icon alignment below MD breakpoint

---
 .changeset/hot-news-mix.md                                   | 5 +++++
 .../src/components/Page/components/Header/Header.module.scss | 5 +++++
 2 files changed, 10 insertions(+)
 create mode 100644 .changeset/hot-news-mix.md

diff --git a/.changeset/hot-news-mix.md b/.changeset/hot-news-mix.md
new file mode 100644
index 00000000000..3ecd5247cf2
--- /dev/null
+++ b/.changeset/hot-news-mix.md
@@ -0,0 +1,5 @@
+---
+'@shopify/polaris': minor
+---
+
+[`Page`] Aligned `Page` back action button icon with title on small screens
diff --git a/polaris-react/src/components/Page/components/Header/Header.module.scss b/polaris-react/src/components/Page/components/Header/Header.module.scss
index c014372f545..70c5ecae502 100644
--- a/polaris-react/src/components/Page/components/Header/Header.module.scss
+++ b/polaris-react/src/components/Page/components/Header/Header.module.scss
@@ -15,6 +15,11 @@ $action-menu-rollup-computed-width: 40px;
 
 .BreadcrumbWrapper {
   grid-area: breadcrumbs;
+  margin-left: calc(-1 * var(--p-space-200));
+
+  @media (--p-breakpoints-md-up) {
+    margin-left: 0;
+  }
 
   a,
   button {