diff --git a/generator/templates/ApiTemplate.ts b/generator/templates/ApiTemplate.ts
index 3228f7fd..e35a7c81 100644
--- a/generator/templates/ApiTemplate.ts
+++ b/generator/templates/ApiTemplate.ts
@@ -1,7 +1,4 @@
 const template = `
-import {HeroPattern} from "@/components/HeroPattern"; import {Note} from "@/components/mdx";
-
-<HeroPattern />
 
 export const title = '<%- tag %>'
 
diff --git a/src/components/Layout.jsx b/src/components/Layout.jsx
index 69663c23..1cc1984d 100644
--- a/src/components/Layout.jsx
+++ b/src/components/Layout.jsx
@@ -102,10 +102,10 @@ function useTableOfContents(tableOfContents) {
     let headings = getHeadings(tableOfContents)
     function onScroll() {
       let top = window.scrollY
-      let current = headings[0].id
+      let current = headings[0]?.id
       for (let heading of headings) {
-        if (top >= heading.top) {
-          current = heading.id
+        if (top >= heading?.top) {
+          current = heading?.id
         } else {
           break
         }
@@ -147,8 +147,6 @@ export function Layout({ children, title, tableOfContents }) {
 
   return (
     <>
-      {/*<Header navigation={navigation} />*/}
-
       <HeroPattern/>
       <div className="relative mx-auto flex max-w-8xl justify-center sm:px-2 lg:px-8 xl:px-12 lg:ml-72 xl:ml-80">
         <motion.header
@@ -172,7 +170,7 @@ export function Layout({ children, title, tableOfContents }) {
           </main>
           <Footer />
         </div>
-        {!router.route.startsWith("/ipa/resources") && <div className="hidden xl:sticky xl:top-[4.5rem] xl:-mr-6 xl:block xl:h-[calc(100vh-4.5rem)] xl:flex-none xl:overflow-y-auto xl:py-16 xl:pr-6">
+        {!router.route.startsWith("/ipa/resources") && !router.route.includes("introductions") && <div className="hidden xl:sticky xl:top-[4.5rem] xl:-mr-6 xl:block xl:h-[calc(100vh-4.5rem)] xl:flex-none xl:overflow-y-auto xl:py-16 xl:pr-6">
           <nav aria-labelledby="on-this-page-title" className="w-56">
             {tableOfContents.length > 0 && (
               <>
diff --git a/src/pages/docs/about-netbird/faq.mdx b/src/pages/docs/about-netbird/faq.mdx
index 9ddac97e..71ac7004 100644
--- a/src/pages/docs/about-netbird/faq.mdx
+++ b/src/pages/docs/about-netbird/faq.mdx
@@ -1,6 +1,4 @@
-import {Note} from "@/components/mdx"; import {HeroPattern} from "@/components/HeroPattern";
-
-<HeroPattern />
+import {Note} from "@/components/mdx";
 
 export const title = 'FAQ'
 
diff --git a/src/pages/docs/about-netbird/how-netbird-works.mdx b/src/pages/docs/about-netbird/how-netbird-works.mdx
index 6f2ecbaf..fc59f647 100644
--- a/src/pages/docs/about-netbird/how-netbird-works.mdx
+++ b/src/pages/docs/about-netbird/how-netbird-works.mdx
@@ -1,6 +1,4 @@
-import {HeroPattern} from "@/components/HeroPattern"; import {Note} from "@/components/mdx";
-
-<HeroPattern />
+import {Note} from "@/components/mdx";
 
 export const title = 'How NetBird Works'
 
diff --git a/src/pages/docs/about-netbird/netbird-vs-traditional-vpn.mdx b/src/pages/docs/about-netbird/netbird-vs-traditional-vpn.mdx
index 67c885e5..300b0de0 100644
--- a/src/pages/docs/about-netbird/netbird-vs-traditional-vpn.mdx
+++ b/src/pages/docs/about-netbird/netbird-vs-traditional-vpn.mdx
@@ -1,6 +1,3 @@
-import {HeroPattern} from "@/components/HeroPattern";
-
-<HeroPattern />
 
 # NetBird vs. Traditional VPN
 
diff --git a/src/pages/docs/about-netbird/other.mdx b/src/pages/docs/about-netbird/other.mdx
index 9903abbf..269378e6 100644
--- a/src/pages/docs/about-netbird/other.mdx
+++ b/src/pages/docs/about-netbird/other.mdx
@@ -1,6 +1,4 @@
-import {Note} from "@/components/mdx"; import {HeroPattern} from "@/components/HeroPattern";
-
-<HeroPattern />
+import {Note} from "@/components/mdx";
 
 export const title = 'Other'
 
diff --git a/src/pages/docs/about-netbird/why-wireguard-with-netbird.mdx b/src/pages/docs/about-netbird/why-wireguard-with-netbird.mdx
index 1ae0851e..0fb833d6 100644
--- a/src/pages/docs/about-netbird/why-wireguard-with-netbird.mdx
+++ b/src/pages/docs/about-netbird/why-wireguard-with-netbird.mdx
@@ -1,6 +1,3 @@
-import {HeroPattern} from "@/components/HeroPattern";
-
-<HeroPattern />
 
 # Why Wireguard with NetBird?
 
diff --git a/src/pages/docs/how-to/access-control.mdx b/src/pages/docs/how-to/access-control.mdx
index 2c01be52..e8eedb7a 100644
--- a/src/pages/docs/how-to/access-control.mdx
+++ b/src/pages/docs/how-to/access-control.mdx
@@ -1,6 +1,3 @@
-import {HeroPattern} from "@/components/HeroPattern";
-
-<HeroPattern/>
 
 # Access Control
 NetBird allows administrators to restrict access to resources (peers) by creating access rules and
diff --git a/src/pages/docs/how-to/activity.mdx b/src/pages/docs/how-to/activity.mdx
index ad191108..65e26193 100644
--- a/src/pages/docs/how-to/activity.mdx
+++ b/src/pages/docs/how-to/activity.mdx
@@ -1,6 +1,3 @@
-import {HeroPattern} from "@/components/HeroPattern";
-
-<HeroPattern/>
 
 # Activity
 
diff --git a/src/pages/docs/how-to/cli.mdx b/src/pages/docs/how-to/cli.mdx
index 4e2286e2..7543661e 100644
--- a/src/pages/docs/how-to/cli.mdx
+++ b/src/pages/docs/how-to/cli.mdx
@@ -1,7 +1,3 @@
-import {HeroPattern} from "@/components/HeroPattern"; import {Note} from "@/components/mdx";
-
-<HeroPattern />
-
 
 # NetBird CLI
 
diff --git a/src/pages/docs/how-to/dns.mdx b/src/pages/docs/how-to/dns.mdx
index ac1ef081..2b2a73a2 100644
--- a/src/pages/docs/how-to/dns.mdx
+++ b/src/pages/docs/how-to/dns.mdx
@@ -1,6 +1,3 @@
-import {HeroPattern} from "@/components/HeroPattern";
-
-<HeroPattern/>
 
 # DNS
 
diff --git a/src/pages/docs/how-to/examples.mdx b/src/pages/docs/how-to/examples.mdx
index bd392ce3..6d186dc9 100644
--- a/src/pages/docs/how-to/examples.mdx
+++ b/src/pages/docs/how-to/examples.mdx
@@ -1,6 +1,3 @@
-import {HeroPattern} from "@/components/HeroPattern";
-
-<HeroPattern />
 
 export const title = 'Examples'
 
diff --git a/src/pages/docs/how-to/getting-started.mdx b/src/pages/docs/how-to/getting-started.mdx
index 3876a358..387defd1 100644
--- a/src/pages/docs/how-to/getting-started.mdx
+++ b/src/pages/docs/how-to/getting-started.mdx
@@ -1,6 +1,4 @@
-import {HeroPattern} from "@/components/HeroPattern"; import {Note} from "@/components/mdx";
-
-<HeroPattern />
+import {Note} from "@/components/mdx";
 
 export const title = 'Getting Started'
 
diff --git a/src/pages/docs/how-to/network-routes.mdx b/src/pages/docs/how-to/network-routes.mdx
index a2252ec1..a5830c33 100644
--- a/src/pages/docs/how-to/network-routes.mdx
+++ b/src/pages/docs/how-to/network-routes.mdx
@@ -1,6 +1,3 @@
-import {HeroPattern} from "@/components/HeroPattern";
-
-<HeroPattern/>
 
 # Network Routes
 
diff --git a/src/pages/docs/how-to/peers.mdx b/src/pages/docs/how-to/peers.mdx
index 6d5ab112..c697415c 100644
--- a/src/pages/docs/how-to/peers.mdx
+++ b/src/pages/docs/how-to/peers.mdx
@@ -1,6 +1,3 @@
-import {HeroPattern} from "@/components/HeroPattern";
-
-<HeroPattern/>
 
 # Peers
 
diff --git a/src/pages/docs/how-to/settings.mdx b/src/pages/docs/how-to/settings.mdx
index f0bcb444..ee62f67d 100644
--- a/src/pages/docs/how-to/settings.mdx
+++ b/src/pages/docs/how-to/settings.mdx
@@ -1,6 +1,3 @@
-import {HeroPattern} from "@/components/HeroPattern";
-
-<HeroPattern/>
 
 # Settings
 
diff --git a/src/pages/docs/how-to/setup-keys.mdx b/src/pages/docs/how-to/setup-keys.mdx
index e6467f15..97ce7bc5 100644
--- a/src/pages/docs/how-to/setup-keys.mdx
+++ b/src/pages/docs/how-to/setup-keys.mdx
@@ -1,6 +1,3 @@
-import {HeroPattern} from "@/components/HeroPattern";
-
-<HeroPattern/>
 
 # Setup Keys
 
diff --git a/src/pages/docs/how-to/users.mdx b/src/pages/docs/how-to/users.mdx
index 5da3be38..f5f094d2 100644
--- a/src/pages/docs/how-to/users.mdx
+++ b/src/pages/docs/how-to/users.mdx
@@ -1,6 +1,3 @@
-import {HeroPattern} from "@/components/HeroPattern";
-
-<HeroPattern/>
 
 # Users
 
diff --git a/src/pages/docs/introductions.mdx b/src/pages/docs/introductions.mdx
index ead5a292..3c5368d1 100644
--- a/src/pages/docs/introductions.mdx
+++ b/src/pages/docs/introductions.mdx
@@ -1,5 +1,3 @@
-import { HeroPattern } from '@/components/HeroPattern'
-
 import {Note} from "@/components/mdx"
 import {HowToGuides} from "@/components/How-To-Guides"
 import {HowNetbirdWorks} from "@/components/How-NetBird-Works"
@@ -7,8 +5,6 @@ import {HowNetbirdWorks} from "@/components/How-NetBird-Works"
 export const description =
   'Learn everything there is to know about NetBird.'
 
-<HeroPattern />
-
 # NetBird Docs
 
 NetBird is a simple and fast alternative to corporate VPNs built on top of [WireGuard®](https://www.wireguard.com/) making it easy to create secure private networks for your organization or home.
diff --git a/src/pages/docs/selfhosted/identity-providers.mdx b/src/pages/docs/selfhosted/identity-providers.mdx
index ae598a78..fe967317 100644
--- a/src/pages/docs/selfhosted/identity-providers.mdx
+++ b/src/pages/docs/selfhosted/identity-providers.mdx
@@ -1,6 +1,4 @@
-import {HeroPattern} from "@/components/HeroPattern"; import {Note} from "@/components/mdx";
-
-<HeroPattern />
+import {Note} from "@/components/mdx";
 
 # Identity Providers
 
diff --git a/src/pages/docs/selfhosted/selfhosted-guide.mdx b/src/pages/docs/selfhosted/selfhosted-guide.mdx
index 54ca8fb4..ad9ad9f6 100644
--- a/src/pages/docs/selfhosted/selfhosted-guide.mdx
+++ b/src/pages/docs/selfhosted/selfhosted-guide.mdx
@@ -1,6 +1,3 @@
-import {HeroPattern} from "@/components/HeroPattern";
-
-<HeroPattern/>
 
 # Self-hosting Guide
 
diff --git a/src/pages/ipa/guides/authentication.mdx b/src/pages/ipa/guides/authentication.mdx
index bbe077f2..69ffd113 100644
--- a/src/pages/ipa/guides/authentication.mdx
+++ b/src/pages/ipa/guides/authentication.mdx
@@ -1,9 +1,6 @@
-import {HeroPattern} from "@/components/HeroPattern";
 export const description =
   'In this guide, we’ll look at how authentication works. NetBird offers two ways to authenticate your API requests: OAuth2 and personal access tokens.'
 
-<HeroPattern/>
-
 # Authentication
 
 You'll need to authenticate your requests to access any of the endpoints in the NetBird API. In this guide, we'll look at how authentication works. Netbird offers two ways to authenticate your API requests: OAuth2 and personal access tokens (PAT). {{ className: 'lead' }}
diff --git a/src/pages/ipa/guides/errors.mdx b/src/pages/ipa/guides/errors.mdx
index 1fcf388f..6a21737c 100644
--- a/src/pages/ipa/guides/errors.mdx
+++ b/src/pages/ipa/guides/errors.mdx
@@ -1,9 +1,7 @@
-import {HeroPattern} from "@/components/HeroPattern"; import {Note} from "@/components/mdx";
+import {Note} from "@/components/mdx";
 export const description =
   'In this guide, we will talk about what happens when something goes wrong while you work with the API.'
 
-<HeroPattern/>
-
 # Errors
 
 When working with APIs, it's important to understand the different types of HTTP errors that you might encounter. These errors can help you diagnose issues with your API requests and determine how to resolve them. {{ className: 'lead' }}
diff --git a/src/pages/ipa/guides/quickstart.mdx b/src/pages/ipa/guides/quickstart.mdx
index c9954872..4f944dc6 100644
--- a/src/pages/ipa/guides/quickstart.mdx
+++ b/src/pages/ipa/guides/quickstart.mdx
@@ -1,8 +1,6 @@
-import {HeroPattern} from "@/components/HeroPattern";
 export const description =
   'This guide will get you all set up and ready to use the NetBird API. We’ll cover how to get started and how to make your first API request.'
 
-<HeroPattern/>
 
 # Quickstart
 
diff --git a/src/pages/ipa/introductions.mdx b/src/pages/ipa/introductions.mdx
index c561eb4f..175b8cf3 100644
--- a/src/pages/ipa/introductions.mdx
+++ b/src/pages/ipa/introductions.mdx
@@ -1,12 +1,9 @@
 import { Guides } from '@/components/Guides'
 import { Resources } from '@/components/Resources'
-import { HeroPattern } from '@/components/HeroPattern'
 
 export const description =
   'Learn everything there is to know about the NetBird Public API.'
 
-<HeroPattern />
-
 # NetBird REST API
 
 Use the NetBird Public API to manage users, peers, network rules and more from inside your application or scripts to automate the setup of your mesh network. {{ className: 'lead' }}
diff --git a/src/pages/ipa/resources/accounts.mdx b/src/pages/ipa/resources/accounts.mdx
index 49e35fc5..7accbe63 100644
--- a/src/pages/ipa/resources/accounts.mdx
+++ b/src/pages/ipa/resources/accounts.mdx
@@ -1,6 +1,3 @@
-import {HeroPattern} from "@/components/HeroPattern"; import {Note} from "@/components/mdx";
-
-<HeroPattern />
 
 export const title = 'Accounts'
 
diff --git a/src/pages/ipa/resources/dns.mdx b/src/pages/ipa/resources/dns.mdx
index e0fc6d2f..0976c5f8 100644
--- a/src/pages/ipa/resources/dns.mdx
+++ b/src/pages/ipa/resources/dns.mdx
@@ -1,6 +1,3 @@
-import {HeroPattern} from "@/components/HeroPattern"; import {Note} from "@/components/mdx";
-
-<HeroPattern />
 
 export const title = 'DNS'
 
diff --git a/src/pages/ipa/resources/events.mdx b/src/pages/ipa/resources/events.mdx
index 893ee99d..feb88055 100644
--- a/src/pages/ipa/resources/events.mdx
+++ b/src/pages/ipa/resources/events.mdx
@@ -1,6 +1,3 @@
-import {HeroPattern} from "@/components/HeroPattern"; import {Note} from "@/components/mdx";
-
-<HeroPattern />
 
 export const title = 'Events'
 
diff --git a/src/pages/ipa/resources/groups.mdx b/src/pages/ipa/resources/groups.mdx
index be6a0ec4..d4fa4902 100644
--- a/src/pages/ipa/resources/groups.mdx
+++ b/src/pages/ipa/resources/groups.mdx
@@ -1,6 +1,3 @@
-import {HeroPattern} from "@/components/HeroPattern"; import {Note} from "@/components/mdx";
-
-<HeroPattern />
 
 export const title = 'Groups'
 
diff --git a/src/pages/ipa/resources/peers.mdx b/src/pages/ipa/resources/peers.mdx
index e4032249..a48aa303 100644
--- a/src/pages/ipa/resources/peers.mdx
+++ b/src/pages/ipa/resources/peers.mdx
@@ -1,6 +1,3 @@
-import {HeroPattern} from "@/components/HeroPattern"; import {Note} from "@/components/mdx";
-
-<HeroPattern />
 
 export const title = 'Peers'
 
diff --git a/src/pages/ipa/resources/policies.mdx b/src/pages/ipa/resources/policies.mdx
index 3da2a581..24db1374 100644
--- a/src/pages/ipa/resources/policies.mdx
+++ b/src/pages/ipa/resources/policies.mdx
@@ -1,6 +1,3 @@
-import {HeroPattern} from "@/components/HeroPattern"; import {Note} from "@/components/mdx";
-
-<HeroPattern />
 
 export const title = 'Policies'
 
diff --git a/src/pages/ipa/resources/routes.mdx b/src/pages/ipa/resources/routes.mdx
index bb7a06f4..e032eb84 100644
--- a/src/pages/ipa/resources/routes.mdx
+++ b/src/pages/ipa/resources/routes.mdx
@@ -1,6 +1,3 @@
-import {HeroPattern} from "@/components/HeroPattern"; import {Note} from "@/components/mdx";
-
-<HeroPattern />
 
 export const title = 'Routes'
 
diff --git a/src/pages/ipa/resources/rules.mdx b/src/pages/ipa/resources/rules.mdx
index 516a25d0..b18b59cc 100644
--- a/src/pages/ipa/resources/rules.mdx
+++ b/src/pages/ipa/resources/rules.mdx
@@ -1,6 +1,3 @@
-import {HeroPattern} from "@/components/HeroPattern"; import {Note} from "@/components/mdx";
-
-<HeroPattern />
 
 export const title = 'Rules'
 
diff --git a/src/pages/ipa/resources/setup-keys.mdx b/src/pages/ipa/resources/setup-keys.mdx
index a31a522e..2f0b08ae 100644
--- a/src/pages/ipa/resources/setup-keys.mdx
+++ b/src/pages/ipa/resources/setup-keys.mdx
@@ -1,6 +1,3 @@
-import {HeroPattern} from "@/components/HeroPattern"; import {Note} from "@/components/mdx";
-
-<HeroPattern />
 
 export const title = 'Setup Keys'
 
diff --git a/src/pages/ipa/resources/tokens.mdx b/src/pages/ipa/resources/tokens.mdx
index 5aa1fa56..2b5b6ac4 100644
--- a/src/pages/ipa/resources/tokens.mdx
+++ b/src/pages/ipa/resources/tokens.mdx
@@ -1,6 +1,3 @@
-import {HeroPattern} from "@/components/HeroPattern"; import {Note} from "@/components/mdx";
-
-<HeroPattern />
 
 export const title = 'Tokens'
 
diff --git a/src/pages/ipa/resources/users.mdx b/src/pages/ipa/resources/users.mdx
index 1737ae3d..0f46d1b8 100644
--- a/src/pages/ipa/resources/users.mdx
+++ b/src/pages/ipa/resources/users.mdx
@@ -1,6 +1,3 @@
-import {HeroPattern} from "@/components/HeroPattern"; import {Note} from "@/components/mdx";
-
-<HeroPattern />
 
 export const title = 'Users'