Add latest header design and adjust pages navigation

Author: reakaleek

.github/workflows/preview-build.yml

@@ -133,23 +133,21 @@ jobs:
       - name: Build documentation
         if: github.repository != 'elastic/docs-builder' && (steps.deployment.outputs.result || (steps.check-files.outputs.any_modified == 'true' && github.event_name == 'merge_group'))
         uses: elastic/docs-builder@main
-        id: docs-build
         continue-on-error: ${{ fromJSON(inputs.continue-on-error != '' && inputs.continue-on-error || 'false') }}
         with:
           prefix: ${{ env.PATH_PREFIX }}
           strict: ${{ fromJSON(inputs.strict != '' && inputs.strict || 'true') }}
 
       - name: 'Validate Inbound Links'
-        if: ${{ !cancelled() && steps.docs-build.outputs.skip != 'true' && (steps.deployment.outputs.result || (steps.check-files.outputs.any_modified == 'true' && github.event_name == 'merge_group')) }}
         uses: elastic/docs-builder/actions/validate-inbound-local@main
-        continue-on-error: true
+        if: ${{ !cancelled() && (steps.deployment.outputs.result || (steps.check-files.outputs.any_modified == 'true' && github.event_name == 'merge_group')) }}
 
       - uses: elastic/docs-builder/.github/actions/aws-auth@main
-        if: ${{ !cancelled() && steps.docs-build.outputs.skip != 'true' && steps.deployment.outputs.result }}
+        if: ${{ !cancelled() && steps.deployment.outputs.result }}
 
       - name: Upload to S3
         id: s3-upload
-        if: ${{ !cancelled() && steps.docs-build.outputs.skip != 'true' && steps.deployment.outputs.result }}
+        if: ${{ !cancelled() && steps.deployment.outputs.result }}
         run: |
           aws s3 sync .artifacts/docs/html "s3://elastic-docs-v3-website-preview${PATH_PREFIX}" --delete
           aws cloudfront create-invalidation \
@@ -160,10 +158,6 @@ jobs:
         if: github.event_name == 'push' && github.ref == 'refs/heads/main' && steps.s3-upload.outcome == 'success'
         uses: elastic/docs-builder/actions/update-link-index@main
 
-      - name: Update Reference Index
-        if: github.event_name == 'push' && github.ref == 'refs/heads/main' && steps.s3-upload.outcome == 'success'
-        uses: elastic/docs-builder/actions/update-reference-index@main
-
       - name: Update deployment status
         uses: actions/github-script@v7
         if: always() && steps.deployment.outputs.result
@@ -175,7 +169,7 @@ jobs:
               owner: context.repo.owner,
               repo: context.repo.repo,
               deployment_id: ${{ steps.deployment.outputs.result }},
-              state: "${{ steps.docs-build.outputs.skip == 'true' && 'inactive' || (steps.s3-upload.outcome == 'success' && 'success' || 'failure') }}",
+              state: "${{ steps.s3-upload.outcome == 'success' && 'success' || 'failure' }}",
               environment_url: `https://docs-v3-preview.elastic.dev${process.env.PATH_PREFIX}`,
               log_url: `https://github.com/${context.repo.owner}/${context.repo.repo}/actions/runs/${context.runId}`,
             })

.github/workflows/preview-cleanup.yml

@@ -51,6 +51,3 @@ jobs:
           PR_NUMBER: ${{ github.event.pull_request.number }}
         run: |
           aws s3 rm "s3://elastic-docs-v3-website-preview/${GITHUB_REPOSITORY}/pull/${PR_NUMBER}" --recursive
-
-      - name: 'Update Reference Index'
-        uses: elastic/docs-builder/actions/update-reference-index@main

action.yml

@@ -12,9 +12,6 @@ inputs:
   strict:
     description: 'Treat warnings as errors'
     required: false
-outputs:
-  skip:
-    description: "hint from the documentation tool to skip the docs build for this PR"
 
 runs:
   using: 'docker'

actions/generator/action.yml

@@ -0,0 +1,16 @@
+name: 'Documentation Generator'
+description: 'Generates a random yet deterministic documentation set'
+
+branding:
+  icon: 'filter'
+  color: 'red'
+
+inputs:
+  output:
+    description: 'Path to output the documentation'
+    required: false
+
+runs:
+  using: 'docker'
+  image: "docker://ghcr.io/elastic/docs-generator:edge"
+

actions/update-reference-index/action.yml

@@ -60,17 +60,6 @@ Project("{2150E333-8FDC-42A3-9474-1A3956D46DE8}") = "validate-inbound-local", "v
 		actions\validate-inbound-local\action.yml = actions\validate-inbound-local\action.yml
 	EndProjectSection
 EndProject
-Project("{2150E333-8FDC-42A3-9474-1A3956D46DE8}") = "update-link-index", "update-link-index", "{6554F917-73CE-4B3D-9101-F28EAA762C6B}"
-	ProjectSection(SolutionItems) = preProject
-		actions\update-link-index\action.yml = actions\update-link-index\action.yml
-		actions\update-link-index\README.md = actions\update-link-index\README.md
-	EndProjectSection
-EndProject
-Project("{2150E333-8FDC-42A3-9474-1A3956D46DE8}") = "update-reference-index", "update-reference-index", "{9FEC15F6-13F8-40B1-A66A-EB054E49E680}"
-	ProjectSection(SolutionItems) = preProject
-		actions\update-reference-index\action.yml = actions\update-reference-index\action.yml
-	EndProjectSection
-EndProject
 Global
 	GlobalSection(SolutionConfigurationPlatforms) = preSolution
 		Debug|Any CPU = Debug|Any CPU
@@ -130,7 +119,5 @@ Global
 		{CFEE9FAD-9E0C-4C0E-A0C2-B97D594C14B5} = {245023D2-D3CA-47B9-831D-DAB91A2FFDC7}
 		{4CCE599A-B9FE-4DF2-8763-34CF0A99D4AA} = {BE6011CC-1200-4957-B01F-FCCA10C5CF5A}
 		{6E2ED6CC-AFC1-4E58-965D-6AEC500EBB46} = {245023D2-D3CA-47B9-831D-DAB91A2FFDC7}
-		{6554F917-73CE-4B3D-9101-F28EAA762C6B} = {245023D2-D3CA-47B9-831D-DAB91A2FFDC7}
-		{9FEC15F6-13F8-40B1-A66A-EB054E49E680} = {245023D2-D3CA-47B9-831D-DAB91A2FFDC7}
 	EndGlobalSection
 EndGlobal

docs-builder.sln

@@ -9,6 +9,10 @@ subs:
   serverless-short: Serverless
   ece:   "Elastic Cloud Enterprise"
   eck:   "Elastic Cloud on Kubernetes"
+  
+#features:
+#  PrimaryNav: true
+
 toc:
   - file: index.md
   - hidden: developer-notes.md

docs/_docset.yml

@@ -15,9 +15,9 @@ function scrollCurrentNaviItemIntoView(nav: HTMLElement, delay: number) {
 	const currentNavItem = $('.current', nav);
 	expandAllParents(currentNavItem);
 	setTimeout(() => {
-
 		if (currentNavItem && !isElementInViewport(currentNavItem)) {
 			currentNavItem.scrollIntoView({ behavior: 'smooth', block: 'center' });
+			window.scrollTo(0, 0);
 		}
 	}, delay);
 }
@@ -36,7 +36,7 @@ export function initNav() {
 	if (!pagesNav) {
 		return;
 	}
-	const navItems = $$('a[href="' + window.location.pathname + '"]', pagesNav);
+	const navItems = $$('a[href="' + window.location.pathname + '"], a[href="' + window.location.pathname + '/"]', pagesNav);
 	navItems.forEach(el => {
 		el.classList.add('current');
 	});

src/Elastic.Markdown/Assets/pages-nav.ts

@@ -72,16 +72,19 @@
 
 	.sidebar {
 		.sidebar-nav {
-			@apply sticky top-22 z-30 overflow-y-auto;
+			@apply sticky top-21 z-30 overflow-y-auto;
 			max-height: calc(100vh - var(--spacing) * 22);
+			scrollbar-gutter: stable;
 		}
 
 		.sidebar-link {
 			@apply
 				text-ink-light
 				hover:text-black
 				text-sm
-			    leading-[1.2em]
+				text-wrap
+				inline-block
+			    leading-[1.3em]
 			    tracking-[-0.02em];
 		}
 	}

src/Elastic.Markdown/Assets/styles.css

@@ -2,9 +2,50 @@
 // Elasticsearch B.V licenses this file to you under the Apache 2.0 License.
 // See the LICENSE file in the project root for more information
 
+using System.Text;
+using Elastic.Markdown.IO.Configuration;
+
 namespace Elastic.Markdown.Helpers;
 
-public class Htmx
+public static class Htmx
 {
-	public static string GetHxSelectOob() => "#markdown-content,#toc-nav,#prev-next-nav,#breadcrumbs";
+	public static string GetHxSelectOob(ConfigurationFile configuration, string? pathPrefix, string currentUrl, string targetUrl)
+	{
+		HashSet<string> selectTargets =
+		[
+			"#primary-nav", "#secondary-nav", "#markdown-content", "#toc-nav", "#prev-next-nav", "#breadcrumbs"
+		];
+		if (!HasSameTopLevelGroup(pathPrefix, currentUrl, targetUrl) && configuration.Features.ContainsKey("PrimaryNav"))
+			_ = selectTargets.Add("#pages-nav");
+		return string.Join(',', selectTargets);
+	}
+
+	public static bool HasSameTopLevelGroup(string? pathPrefix, string currentUrl, string targetUrl)
+	{
+		var startIndex = pathPrefix?.Length ?? 0;
+		var currentSegments = GetSegments(currentUrl[startIndex..].Trim('/'));
+		var targetSegments = GetSegments(targetUrl[startIndex..].Trim('/'));
+		return currentSegments.Length >= 1 && targetSegments.Length >= 1 && currentSegments[0] == targetSegments[0];
+	}
+
+	public static string GetPreload() => "true";
+
+	public static string GetHxSwap() => "none";
+	public static string GetHxPushUrl() => "true";
+	public static string GetHxIndicator() => "#htmx-indicator";
+
+	private static string[] GetSegments(string url) => url.Split('/');
+
+	public static string GetHxAttributes(ConfigurationFile configuration, string? pathPrefix, string currentUrl, string targetUrl)
+	{
+
+		var attributes = new StringBuilder();
+		_ = attributes.Append($" hx-get={targetUrl}");
+		_ = attributes.Append($" hx-select-oob={GetHxSelectOob(configuration, pathPrefix, currentUrl, targetUrl)}");
+		_ = attributes.Append($" hx-swap={GetHxSwap()}");
+		_ = attributes.Append($" hx-push-url={GetHxPushUrl()}");
+		_ = attributes.Append($" hx-indicator={GetHxIndicator()}");
+		_ = attributes.Append($" preload={GetPreload()}");
+		return attributes.ToString();
+	}
 }