From 8feeb36592edb1961d71fcd14202e349ca8dc4e8 Mon Sep 17 00:00:00 2001
From: Eduardo San Martin Morote <posva13@gmail.com>
Date: Tue, 23 Jun 2026 10:34:49 +0200
Subject: [PATCH] feat(docs): add Vercel OSS lockup to the header

Override Docus' AppHeaderLeft to place the Vercel OSS wordmark (triangle
on narrow screens) and a slash separator before the nostics logo, matching
the vercel.com/oss lockup pattern.
---
 docs/app/components/app/AppHeaderLeft.vue | 59 +++++++++++++++++++++++
 1 file changed, 59 insertions(+)
 create mode 100644 docs/app/components/app/AppHeaderLeft.vue

diff --git a/docs/app/components/app/AppHeaderLeft.vue b/docs/app/components/app/AppHeaderLeft.vue
new file mode 100644
index 0000000..9129db3
--- /dev/null
+++ b/docs/app/components/app/AppHeaderLeft.vue
@@ -0,0 +1,59 @@
+<script setup lang="ts">
+const appConfig = useAppConfig()
+
+const ariaLabel = appConfig.header?.title || 'nostics'
+</script>
+
+<template>
+  <div class="flex shrink-0 items-center gap-2.5">
+    <ULink
+      to="https://vercel.com/oss"
+      aria-label="Vercel OSS"
+      target="_blank"
+      rel="noopener"
+      class="flex text-highlighted!"
+    >
+      <svg
+        aria-hidden="true"
+        class="sm:hidden"
+        fill="none"
+        height="20"
+        role="img"
+        viewBox="0 0 16 16"
+        width="20"
+        xmlns="http://www.w3.org/2000/svg"
+      >
+        <path clip-rule="evenodd" d="m8 1 8 14H0z" fill="currentColor" fill-rule="evenodd" />
+      </svg>
+      <svg
+        aria-hidden="true"
+        class="hidden sm:block"
+        fill="currentColor"
+        height="18"
+        role="img"
+        viewBox="0 0 232 65"
+        width="64.24615384615385"
+      >
+        <path
+          d="M73.4619 64.2783H0L36.7305 0L73.4619 64.2783ZM113.694 4.80566C129.268 4.80572 138.598 15.3104 138.598 32.1328C138.598 48.9555 129.268 59.3144 113.694 59.3145C98.1939 59.3145 88.8643 48.9555 88.8643 32.1328C88.8644 15.3103 98.1941 4.80566 113.694 4.80566ZM163.259 4.80566C175.747 4.80579 182.579 12.0784 183.754 22.1426L174.131 22.583C173.47 16.9266 169.723 13.0332 163.111 13.0332C157.602 13.0333 154.223 15.8249 154.223 19.8652C154.223 24.1259 156.647 25.7417 165.977 27.8721C180.008 30.884 184.709 36.0266 184.709 43.8135C184.709 53.3635 176.922 59.3145 165.095 59.3145C152.166 59.3144 144.232 52.0412 143.424 41.1689L153.121 40.5811C154.003 47.3395 158.043 51.0859 165.242 51.0859C171.413 51.0859 174.938 48.8091 174.938 44.3281C174.938 40.2878 172.882 37.8629 162.23 35.3652C149.301 32.4268 144.452 28.754 144.452 20.2324C144.452 11.1232 151.578 4.80566 163.259 4.80566ZM210.125 4.80566C222.613 4.80578 229.445 12.0784 230.62 22.1426L220.997 22.583C220.336 16.9266 216.589 13.0332 209.978 13.0332C204.468 13.0333 201.089 15.8249 201.089 19.8652C201.089 24.1259 203.513 25.7417 212.843 27.8721C226.874 30.884 231.575 36.0266 231.575 43.8135C231.575 53.3635 223.788 59.3145 211.961 59.3145C199.032 59.3143 191.098 52.0412 190.29 41.1689L199.987 40.5811C200.869 47.3395 204.909 51.0859 212.108 51.0859C218.279 51.0859 221.805 48.8091 221.805 44.3281C221.805 40.2878 219.748 37.8629 209.097 35.3652C196.167 32.4268 191.318 28.754 191.318 20.2324C191.318 11.1232 198.445 4.80566 210.125 4.80566ZM113.694 13.1064C104.365 13.1064 98.7081 20.2323 98.708 32.1328C98.708 44.0336 104.365 51.0127 113.694 51.0127C123.171 51.0126 128.754 44.0336 128.754 32.1328C128.754 20.2323 123.171 13.1065 113.694 13.1064Z"
+        />
+      </svg>
+    </ULink>
+
+    <div class="w-4 text-center text-lg text-neutral-300 dark:text-neutral-600">
+      <svg aria-hidden="true" fill="none" height="16" role="img" viewBox="0 0 16 16" width="16">
+        <title>Slash forward icon</title>
+        <path
+          clip-rule="evenodd"
+          d="m4.02 15.4.3-.7 6-14 .29-.68 1.37.59-.3.69-6 14-.29.68z"
+          fill="currentColor"
+          fill-rule="evenodd"
+        />
+      </svg>
+    </div>
+
+    <NuxtLink to="/" :aria-label="ariaLabel" class="text-highlighted!">
+      <AppHeaderLogo class="h-6 w-auto shrink-0" />
+    </NuxtLink>
+  </div>
+</template>