Fix text alignment in the Site Editor sidebar (#48959)

* Fix text alignment * Remove width width override
WordPress · Mar 9, 2023 · 1d724fa · 1d724fa
1 parent 8bd23b0
commit 1d724fa
Show file tree

Hide file tree

Showing 3 changed files with 10 additions and 4 deletions.
diff --git a/packages/edit-site/src/components/sidebar-navigation-item/style.scss b/packages/edit-site/src/components/sidebar-navigation-item/style.scss
@@ -1,13 +1,12 @@
 .edit-site-sidebar-navigation-item.components-item {
 	color: $gray-600;
-	border-width: $border-width-tab;
+	margin: 0 $grid-unit-05;
 
 	&:hover,
 	&:focus,
 	&[aria-current] {
 		color: $white;
 		background: $gray-800;
-		border-width: $border-width-tab;
 	}
 
 	&[aria-current] {
@@ -17,6 +16,5 @@
 
 .edit-site-sidebar-navigation-screen__content .block-editor-list-view-block-select-button {
 	cursor: grab;
-	width: calc(100% - #{ $border-width-focus });
 	padding: $grid-unit-10;
 }
diff --git a/packages/edit-site/src/components/site-hub/index.js b/packages/edit-site/src/components/site-hub/index.js
@@ -95,7 +95,11 @@ const SiteHub = forwardRef( ( props, ref ) => {
 					</Button>
 				</motion.div>
 
-				{ showLabels && <div>{ siteTitle }</div> }
+				{ showLabels && (
+					<div className="edit-site-site-hub__site-title">
+						{ siteTitle }
+					</div>
+				) }
 			</HStack>
 		</motion.div>
 	);

diff --git a/packages/edit-site/src/components/site-hub/style.scss b/packages/edit-site/src/components/site-hub/style.scss
@@ -26,3 +26,7 @@
 	white-space: nowrap;
 	overflow: hidden;
 }
+
+.edit-site-site-hub__site-title {
+	margin-left: $grid-unit-05;
+}