wip

_overrides/partials/header.html

@@ -7,12 +7,12 @@
 <!-- Header -->
 <header class="{{ class }}" data-md-component="header">
 
-	<nav class="md-tabs n8n-top-nav" aria-label="{{ lang.t('tabs') }}" data-md-component="tabs">
+	<nav id="n8n-top-nav-target" class="md-tabs n8n-top-nav n8n-visible" aria-label="Additional top nav to link to other n8n sites">
 		<div class="md-grid">
 		  <ul class="md-tabs__list n8n-top-nav-list" >
-			<li class="md-tabs__item"><a href="https://n8n.io/" class="md-tabs__link" target="_blank">n8n home</a></li>
-			<li class="md-tabs__item"><a href="https://community.n8n.io/" class="md-tabs__link" target="_blank">Forum</a></li>
-			<li class="md-tabs__item"><a href="https://blog.n8n.io/" class="md-tabs__link" target="_blank">Blog</a></li>
+			<li class="md-tabs__item"><a href="https://n8n.io/" class="n8n-top-nav-link" target="_blank">n8n home</a></li>
+			<li class="md-tabs__item"><a href="https://community.n8n.io/" class="n8n-top-nav-link" target="_blank">Forum</a></li>
+			<li class="md-tabs__item"><a href="https://blog.n8n.io/" class="n8n-top-nav-link" target="_blank">Blog</a></li>
 		  </ul>
 		</div>
 	  </nav>

docs/_extra/css/extra.css

@@ -249,6 +249,32 @@
 	border-bottom: 1px solid #707183;
 }
 
+.n8n-top-nav-link {
+	-webkit-backface-visibility: hidden;
+    backface-visibility: hidden;
+    display: flex;
+    font-size: .8rem;
+    margin-top: .8rem;
+    opacity: .7;
+    outline-color: var(--md-accent-fg-color);
+    outline-offset: .2rem;
+}
+
+.n8n-visible {
+	visibility: visible;
+	opacity: 1;
+	transition: opacity 0.5s linear;
+	pointer-events: auto;
+}
+
+.n8n-hidden {
+	height: 0px;
+	visibility: hidden;
+	opacity: 0;
+	pointer-events: none;
+}
+
+
 /* ensure headings don't disappear below top nav after adding extra top nav */
 @media screen and (min-width: 76.25em) {
 	.md-header--lifted~.md-container .md-typeset :target {

docs/_extra/javascript/extra.js

@@ -0,0 +1,12 @@
+
+var n8nTopNav = document.getElementById("n8n-top-nav-target");
+// Hide the n8n additional top nav on scroll
+window.addEventListener('scroll', function() {
+	if(scrollY != 0) {
+		n8nTopNav.classList.remove("n8n-visible");
+		n8nTopNav.classList.add("n8n-hidden");
+	} else {
+		n8nTopNav.classList.remove("n8n-hidden");
+		n8nTopNav.classList.add("n8n-visible");
+	}
+  });

mkdocs.yml

@@ -35,8 +35,6 @@ theme:
     - content.code.copy
     # https://squidfunk.github.io/mkdocs-material/reference/tooltips/#improved-tooltips
     - content.tooltips
-    # https://squidfunk.github.io/mkdocs-material/setup/setting-up-the-header/#automatic-hiding
-    - header.autohide
     # https://squidfunk.github.io/mkdocs-material/setup/setting-up-the-footer/?h=footer#navigation
     - navigation.footer
     # https://squidfunk.github.io/mkdocs-material/setup/setting-up-navigation/#section-index-pages
@@ -47,7 +45,6 @@ theme:
     - navigation.sections
     # https://squidfunk.github.io/mkdocs-material/setup/setting-up-navigation/?h=navigation+tabs#navigation-tabs
     - navigation.tabs
-    - navigation.tabs.sticky
     # https://squidfunk.github.io/mkdocs-material/setup/setting-up-navigation/#back-to-top-button
     - navigation.top
     # https://squidfunk.github.io/mkdocs-material/setup/setting-up-navigation/?h=navigation+tabs#anchor-tracking
@@ -296,6 +293,7 @@ nav:
         - Data pinning: data/data-pinning.md
         - Data editing: data/data-editing.md
         - Data filtering: data/data-filtering.md
+        - Data mocking: data/data-mocking.md
         - Binary data: data/binary-data.md
     - Manage n8n Cloud:
       - Overview: manage-cloud/overview.md