Additional fixes to icon placement and paddings

WebDevStudios · Sep 30, 2024 · 5041779 · 5041779
1 parent d371129
commit 5041779
Showing 1 changed file with 20 additions and 0 deletions.
diff --git a/assets/scss/blocks/core/navigation.scss b/assets/scss/blocks/core/navigation.scss
@@ -192,6 +192,13 @@
 
 .wp-block-navigation__responsive-container {
 	&.is-menu-open {
+
+		.wp-block-navigation__responsive-container-close {
+			position: absolute;
+			right: var(--wp--preset--spacing--20);
+			top: var(--wp--preset--spacing--20);
+		}
+
 		.wp-block-navigation__responsive-container-content {
 			.wp-block-navigation-item,
 			.wp-block-navigation__container,
@@ -201,6 +208,10 @@
 				width: 100%;
 			}
 
+			.wp-block-navigation__container {
+				padding: var(--wp--preset--spacing--20);
+			}
+
 			.wp-block-navigation-item__content {
 				display: block;
 				padding: 0;
@@ -221,6 +232,9 @@
 
 					.wp-block-navigation-item__content {
 						color: var(--wp--custom--navigation--link);
+						margin-left: var(--wp--preset--spacing--20);
+						padding-left: 0;
+						width: calc(100% - var(--wp--preset--spacing--20));
 
 						&:hover::before,
 						&:hover::after {
@@ -244,6 +258,12 @@
 
 /* Mobile only menu */
 @include responsive-max(833px) {
+	.is-root-container .header-container,
+	.site-header .header-container {
+		padding-left: 0 !important; /* stylelint-disable-line declaration-no-important */
+		padding-right: 0 !important; /* stylelint-disable-line declaration-no-important */
+	}
+
 	.wp-block-navigation__container.is-responsive {
 		width: 100%;
 	}