Header: Adjust layout styles for better responsiveness on mobile devices

yogeshbhutkar · Jan 6, 2025 · 758ddc2 · 758ddc2
1 parent 4b39807
commit 758ddc2
Showing 1 changed file with 7 additions and 1 deletion.
diff --git a/packages/editor/src/components/header/style.scss b/packages/editor/src/components/header/style.scss
@@ -101,11 +101,17 @@
 	.editor-header:has(> .editor-header__center) & {
 		grid-column: 4 / -1;
 	}
-	justify-self: end;
 	display: inline-flex;
 	align-items: center;
 	flex-wrap: nowrap;
 	padding-right: $grid-unit-05;
+	width: 100%;
+	justify-content: inherit;
+
+	@include break-mobile () {
+		justify-self: end;
+		width: min-content;
+	}
 
 	@include break-small () {
 		padding-right: $grid-unit-10;