From 6d7bbecaf88df8fe172d091a60c88d235be48abe Mon Sep 17 00:00:00 2001
From: James Koster <james@jameskoster.co.uk>
Date: Fri, 5 Apr 2024 13:31:14 +0100
Subject: [PATCH 1/3] Update site hub spacing

---
 .../src/components/layout/style.scss          |  2 +-
 .../src/components/site-hub/index.js          | 39 ++++++++++---------
 .../src/components/site-hub/style.scss        |  1 -
 3 files changed, 22 insertions(+), 20 deletions(-)

diff --git a/packages/edit-site/src/components/layout/style.scss b/packages/edit-site/src/components/layout/style.scss
index 05dbf1647fd2f6..63fc992e06c234 100644
--- a/packages/edit-site/src/components/layout/style.scss
+++ b/packages/edit-site/src/components/layout/style.scss
@@ -15,7 +15,7 @@
 	z-index: z-index(".edit-site-layout__hub");
 
 	@include break-medium {
-		width: calc(#{$nav-sidebar-width} - #{$grid-unit-30});
+		width: calc(#{$nav-sidebar-width} - #{$grid-unit-15});
 	}
 
 	.edit-site-layout.is-full-canvas & {
diff --git a/packages/edit-site/src/components/site-hub/index.js b/packages/edit-site/src/components/site-hub/index.js
index b7d40ee2a06f65..01488f5b9a0809 100644
--- a/packages/edit-site/src/components/site-hub/index.js
+++ b/packages/edit-site/src/components/site-hub/index.js
@@ -156,25 +156,28 @@ const SiteHub = memo( ( { isTransparent, className } ) => {
 							<div className="edit-site-site-hub__title">
 								{ decodeEntities( siteTitle ) }
 							</div>
+							<HStack spacing={ 0 } expanded={ false }>
+								<Button
+									href={ homeUrl }
+									target="_blank"
+									label={ __(
+										'View site (opens in a new tab)'
+									) }
+									aria-label={ __(
+										'View site (opens in a new tab)'
+									) }
+									icon={ external }
+									className="edit-site-site-hub__site-view-link"
+								/>
 
-							<Button
-								href={ homeUrl }
-								target="_blank"
-								label={ __( 'View site (opens in a new tab)' ) }
-								aria-label={ __(
-									'View site (opens in a new tab)'
-								) }
-								icon={ external }
-								className="edit-site-site-hub__site-view-link"
-							/>
-
-							<Button
-								className="edit-site-site-hub_toggle-command-center"
-								icon={ search }
-								onClick={ () => openCommandCenter() }
-								label={ __( 'Open command palette' ) }
-								shortcut={ displayShortcut.primary( 'k' ) }
-							/>
+								<Button
+									className="edit-site-site-hub_toggle-command-center"
+									icon={ search }
+									onClick={ () => openCommandCenter() }
+									label={ __( 'Open command palette' ) }
+									shortcut={ displayShortcut.primary( 'k' ) }
+								/>
+							</HStack>
 						</HStack>
 					) }
 				</AnimatePresence>
diff --git a/packages/edit-site/src/components/site-hub/style.scss b/packages/edit-site/src/components/site-hub/style.scss
index 97b659cfcc82b8..a64eae4b07b812 100644
--- a/packages/edit-site/src/components/site-hub/style.scss
+++ b/packages/edit-site/src/components/site-hub/style.scss
@@ -3,7 +3,6 @@
 	align-items: center;
 	justify-content: space-between;
 	gap: $grid-unit-10;
-	overflow: hidden;
 }
 
 .edit-site-site-hub__view-mode-toggle-container {

From a138602b5319b80df9dd769bbb896be4d41577dd Mon Sep 17 00:00:00 2001
From: James Koster <james@jameskoster.co.uk>
Date: Fri, 5 Apr 2024 14:01:52 +0100
Subject: [PATCH 2/3] Fix long titles

---
 packages/edit-site/src/components/site-hub/index.js   | 6 +++++-
 packages/edit-site/src/components/site-hub/style.scss | 1 -
 2 files changed, 5 insertions(+), 2 deletions(-)

diff --git a/packages/edit-site/src/components/site-hub/index.js b/packages/edit-site/src/components/site-hub/index.js
index 01488f5b9a0809..c68fff839b71af 100644
--- a/packages/edit-site/src/components/site-hub/index.js
+++ b/packages/edit-site/src/components/site-hub/index.js
@@ -156,7 +156,11 @@ const SiteHub = memo( ( { isTransparent, className } ) => {
 							<div className="edit-site-site-hub__title">
 								{ decodeEntities( siteTitle ) }
 							</div>
-							<HStack spacing={ 0 } expanded={ false }>
+							<HStack
+								spacing={ 0 }
+								expanded={ false }
+								style={ { flexShrink: '0' } }
+							>
 								<Button
 									href={ homeUrl }
 									target="_blank"
diff --git a/packages/edit-site/src/components/site-hub/style.scss b/packages/edit-site/src/components/site-hub/style.scss
index a64eae4b07b812..401ac5bc007614 100644
--- a/packages/edit-site/src/components/site-hub/style.scss
+++ b/packages/edit-site/src/components/site-hub/style.scss
@@ -28,7 +28,6 @@
 }
 
 .edit-site-site-hub__site-view-link {
-	flex-grow: 0;
 	margin-right: var(--wp-admin-border-width-focus);
 	svg {
 		fill: $gray-200;

From d31fa3947874c0b490f2b3309532e67b1cbfeb02 Mon Sep 17 00:00:00 2001
From: James Koster <james@jameskoster.co.uk>
Date: Fri, 5 Apr 2024 14:31:43 +0100
Subject: [PATCH 3/3] Add class

---
 packages/edit-site/src/components/site-hub/index.js   | 2 +-
 packages/edit-site/src/components/site-hub/style.scss | 4 ++++
 2 files changed, 5 insertions(+), 1 deletion(-)

diff --git a/packages/edit-site/src/components/site-hub/index.js b/packages/edit-site/src/components/site-hub/index.js
index c68fff839b71af..cc1ce651082c8e 100644
--- a/packages/edit-site/src/components/site-hub/index.js
+++ b/packages/edit-site/src/components/site-hub/index.js
@@ -159,7 +159,7 @@ const SiteHub = memo( ( { isTransparent, className } ) => {
 							<HStack
 								spacing={ 0 }
 								expanded={ false }
-								style={ { flexShrink: '0' } }
+								className="edit-site-site-hub__actions"
 							>
 								<Button
 									href={ homeUrl }
diff --git a/packages/edit-site/src/components/site-hub/style.scss b/packages/edit-site/src/components/site-hub/style.scss
index 401ac5bc007614..9cb62bbe056411 100644
--- a/packages/edit-site/src/components/site-hub/style.scss
+++ b/packages/edit-site/src/components/site-hub/style.scss
@@ -5,6 +5,10 @@
 	gap: $grid-unit-10;
 }
 
+.edit-site-site-hub__actions {
+	flex-shrink: 0;
+}
+
 .edit-site-site-hub__view-mode-toggle-container {
 	height: $header-height;
 	width: $header-height;