From f24f28635c24de59dcf1e79b02c3188e6d5474f4 Mon Sep 17 00:00:00 2001
From: Kelly Dwan <ryelle@users.noreply.github.com>
Date: Thu, 27 Jun 2024 12:07:33 -0400
Subject: [PATCH] Headers: Update site & page title in local navigation

See https://github.com/WordPress/wporg-mu-plugins/issues/535
---
 .../wporg-documentation-2022/parts/header-home.html    |  4 +---
 .../themes/wporg-documentation-2022/parts/header.html  | 10 +++++++++-
 .../wporg-documentation-2022/src/style/style.scss      | 10 ++++++++++
 3 files changed, 20 insertions(+), 4 deletions(-)

diff --git a/source/wp-content/themes/wporg-documentation-2022/parts/header-home.html b/source/wp-content/themes/wporg-documentation-2022/parts/header-home.html
index f1e4996..dbfa34d 100644
--- a/source/wp-content/themes/wporg-documentation-2022/parts/header-home.html
+++ b/source/wp-content/themes/wporg-documentation-2022/parts/header-home.html
@@ -2,9 +2,7 @@
 
 <!-- wp:wporg/local-navigation-bar {"backgroundColor":"charcoal-2","style":{"position":{"type":"sticky"},"elements":{"link":{"color":{"text":"var:preset|color|white"},":hover":{"color":{"text":"var:preset|color|white"}}}}},"textColor":"white","fontSize":"small"} -->
 
-	<!-- wp:html -->
-	<div style="height:calc(var(--wp--custom--body--small--typography--line-height) * var(--wp--preset--font-size--small));" aria-hidden="true"></div>
-	<!-- /wp:html -->
+	<!-- wp:site-title {"level":0,"fontSize":"small","className":"wporg-local-navigation-bar__show-on-scroll"} /-->
 
 	<!-- wp:navigation {"menuSlug":"documentation","icon":"menu","overlayBackgroundColor":"charcoal-2","overlayTextColor":"white","layout":{"type":"flex","orientation":"horizontal"},"fontSize":"small"} /-->
 
diff --git a/source/wp-content/themes/wporg-documentation-2022/parts/header.html b/source/wp-content/themes/wporg-documentation-2022/parts/header.html
index efe0cc6..acb9ad7 100644
--- a/source/wp-content/themes/wporg-documentation-2022/parts/header.html
+++ b/source/wp-content/themes/wporg-documentation-2022/parts/header.html
@@ -2,7 +2,15 @@
 
 <!-- wp:wporg/local-navigation-bar {"backgroundColor":"charcoal-2","style":{"position":{"type":"sticky"},"elements":{"link":{"color":{"text":"var:preset|color|white"},":hover":{"color":{"text":"var:preset|color|white"}}}}},"textColor":"white","fontSize":"small"} -->
 
-	<!-- wp:site-title {"level":0,"fontSize":"small"} /-->
+	<!-- wp:group {"style":{"spacing":{"blockGap":"0"}},"textColor":"light-grey-1","layout":{"type":"flex","flexWrap":"nowrap"}} -->
+	<div class="wp-block-group has-light-grey-1-color has-text-color">
+		<!-- wp:site-title {"level":0,"fontSize":"small","textColor":"white"} /-->
+
+		<!-- wp:query-title {"type":"filter","level":0,"fontSize":"small","fontFamily":"inter","className":"wporg-local-navigation-bar__fade-in-scroll"} /-->
+
+		<!-- wp:post-title {"level":0,"fontSize":"small","fontFamily":"inter","className":"wporg-local-navigation-bar__fade-in-scroll"} /-->
+	</div>
+	<!-- /wp:group -->
 
 	<!-- wp:navigation {"icon":"menu","overlayBackgroundColor":"charcoal-2","overlayTextColor":"white","layout":{"type":"flex","orientation":"horizontal"},"fontSize":"small","menuSlug":"documentation"} /-->
 
diff --git a/source/wp-content/themes/wporg-documentation-2022/src/style/style.scss b/source/wp-content/themes/wporg-documentation-2022/src/style/style.scss
index 8bdf33a..f0846fe 100644
--- a/source/wp-content/themes/wporg-documentation-2022/src/style/style.scss
+++ b/source/wp-content/themes/wporg-documentation-2022/src/style/style.scss
@@ -17,6 +17,16 @@ p.has-background {
 	padding: var(--wp--preset--spacing--20);
 }
 
+/* Both blocks are in the local header, but only one should be shown at any given time. */
+body.archive .wp-block-wporg-local-navigation-bar .wp-block-post-title {
+	display: none;
+}
+
+body.single .wp-block-wporg-local-navigation-bar .wp-block-query-title,
+body.page .wp-block-wporg-local-navigation-bar .wp-block-query-title {
+	display: none;
+}
+
 // Scale down very large headings so they fit on mid-sized screens.
 .wp-block-heading.has-heading-cta-font-size {
 	// Scales from 54px at 400 wide to 120px at 900 wide.