fix: Prefix icon and logo paths with basePath for GitHub Pages

Author: AugustoL

app/layout.tsx

@@ -1,6 +1,8 @@
 import type { Metadata } from 'next'
 import './globals.css'
 
+const basePath = process.env.NEXT_PUBLIC_BASE_PATH || ''
+
 export const metadata: Metadata = {
   title: {
     default: 'Docs — OpenScan',
@@ -9,13 +11,13 @@ export const metadata: Metadata = {
   description: 'Official documentation for OpenScan. Learn how it works, self-host, compare features, and understand our privacy policy.',
   icons: {
     icon: [
-      { url: '/icon.svg', type: 'image/svg+xml' },
-      { url: '/icon.png', sizes: '512x512', type: 'image/png' },
+      { url: `${basePath}/icon.svg`, type: 'image/svg+xml' },
+      { url: `${basePath}/icon.png`, sizes: '512x512', type: 'image/png' },
     ],
     apple: [
-      { url: '/apple-icon.png', sizes: '180x180', type: 'image/png' },
+      { url: `${basePath}/apple-icon.png`, sizes: '180x180', type: 'image/png' },
     ],
-    shortcut: '/icon.svg',
+    shortcut: `${basePath}/icon.svg`,
   },
 }
 

components/docs-sidebar.tsx

@@ -176,7 +176,7 @@ export function DocsSidebar() {
       <div className="sticky top-0 flex h-full max-h-screen flex-col overflow-y-auto px-4 pb-8">
         <div className="flex h-14 items-center border-b border-border px-2">
           <Link href="/introduction" className="flex items-center gap-2">
-            <img src="/openscan-logo.svg" alt="OpenScan" className="h-5 w-5" />
+            <img src={`${process.env.NEXT_PUBLIC_BASE_PATH || ''}/openscan-logo.svg`} alt="OpenScan" className="h-5 w-5" />
             <span className="font-semibold text-foreground tracking-tight">
               OpenScan Docs
             </span>
@@ -195,7 +195,7 @@ export function MobileNav() {
     <div className="lg:hidden">
       <div className="flex h-14 items-center justify-between border-b border-border px-4">
         <Link href="/introduction" className="flex items-center gap-2">
-          <img src="/openscan-logo.svg" alt="OpenScan" className="h-5 w-5" />
+          <img src={`${process.env.NEXT_PUBLIC_BASE_PATH || ''}/openscan-logo.svg`} alt="OpenScan" className="h-5 w-5" />
           <span className="font-semibold text-foreground tracking-tight">
             OpenScan Docs
           </span>