Club: adding custom styles for navigation block (#6328)

* Club: implementing header template part

* Club: adding custom styles for navigation block

* Club: fix navigation menu open in mobile

* Club: removing not needed CSS targeting Navigation block annd replacing it with block configurarion

* Club: adding styles for navigation links interactive states

* Club: fixing typo

club/parts/header.html

@@ -8,6 +8,8 @@
 	<!-- /wp:group --></div>
 	<!-- /wp:group -->
 	
-	<!-- wp:navigation {"__unstableLocation":"primary","overlayBackgroundColor":"background","overlayTextColor":"foreground","layout":{"type":"flex","setCascadingProperties":true,"justifyContent":"right","orientation":"horizontal"},"style":{"spacing":{"margin":{"top":"0"}}}} /--></div>
+	<!-- wp:navigation {"__unstableLocation":"primary","overlayBackgroundColor":"background","overlayTextColor":"foreground","layout":{"type":"flex","setCascadingProperties":true,"justifyContent":"left","orientation":"horizontal"},"style":{"spacing":{"margin":{"top":"0"}}}} /--></div>
 	<!-- /wp:group --></div>
-	<!-- /wp:group -->
+	<!-- /wp:group -->
+
+	

club/style.css

@@ -196,6 +196,27 @@ a {
 	color: var(--wp--preset--color--background);
 }
 
+/*
+ * Navigation
+ */
+.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content .wp-block-navigation__container {
+	gap: 1rem;
+}
+
+.wp-block-navigation .wp-block-navigation__container .has-child .wp-block-navigation__submenu-container {
+	font-size: var(--wp--preset--font-size--medium);
+	border: 1px solid var(--wp--preset--color--foreground);
+}
+
+.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content {
+	font-size: var(--wp--preset--font-size--large);
+}
+
+.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content .has-child .wp-block-navigation__submenu-container {
+	padding: 0.5rem 1rem 0 1rem;
+	gap: 0.5rem;
+}
+
 /*
  * Alignment styles, borrowed from Twenty Twenty-Two.
  * These rules are temporary, and should not be relied on or

club/theme.json

@@ -292,7 +292,25 @@
             },
             "core/navigation": {
                 "typography": {
-                    "fontSize": "var(--wp--preset--font-size--large)"
+                    "fontSize": "var(--wp--preset--font-size--large)",
+                    "textDecoration": "none"
+                },
+                "elements": {
+                    "link": {
+                        "typography": {
+                            "textDecoration": "none"
+                        },
+                        ":hover": {
+                            "typography": {
+                                "textDecoration": "underline"
+                            }
+                        },
+                        ":active": {
+                            "typography": {
+                                "textDecoration": "underline dotted"
+                            }
+                        }
+                    }
                 }
             },
             "core/post-date": {