From ca3e7b0e60d78da8694b50692a736ca75ef02e5f Mon Sep 17 00:00:00 2001
From: Timidan <akinnusotutemitayodaniel@gmail.com>
Date: Thu, 10 Sep 2026 05:01:04 +0100
Subject: [PATCH] Link the documentation site from the app footer
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

The docs had no entry point from the product — users had to already
know the URL. The footer now carries a Documentation link.
---
 src/App.css | 17 ++++++++++++++---
 src/App.tsx | 10 +++++++++-
 2 files changed, 23 insertions(+), 4 deletions(-)

diff --git a/src/App.css b/src/App.css
index cffe479e..02a3f4e4 100644
--- a/src/App.css
+++ b/src/App.css
@@ -78,12 +78,23 @@ body {
   left: 0;
   z-index: 50;
   display: flex;
-  justify-content: flex-end;
+  justify-content: space-between;
   align-items: center;
   padding: 4px 12px;
   pointer-events: none;
 }
 
+.app-footer-docs {
+  font-size: 11px;
+  color: var(--text-secondary);
+  text-decoration: none;
+}
+
+.app-footer-docs:hover {
+  color: var(--text-primary);
+  text-decoration: underline;
+}
+
 .app-footer > * {
   pointer-events: auto;
 }
@@ -95,7 +106,7 @@ body {
   border: 1px solid hsl(var(--border) / 0.7);
   border-radius: 999px;
   background: hsl(var(--background) / 0.8);
-  color: hsl(var(--muted-foreground));
+  color: var(--text-secondary);
   padding: 4px 8px;
   font-size: 10px;
   line-height: 1;
@@ -105,7 +116,7 @@ body {
 
 .edb-status-indicator:hover,
 .edb-status-indicator:focus-visible {
-  color: hsl(var(--foreground));
+  color: var(--text-primary);
   border-color: hsl(var(--primary) / 0.45);
   background: hsl(var(--accent) / 0.55);
 }
diff --git a/src/App.tsx b/src/App.tsx
index 22732d3a..ed7ed05e 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -178,8 +178,16 @@ function App() {
                 </div>
               )}
 
-              {/* Global footer — EDB status at far right */}
+              {/* Global footer — docs at far left, EDB status at far right */}
               <footer className="app-footer">
+                <a
+                  className="app-footer-docs"
+                  href="https://hexdocs.thally.app"
+                  target="_blank"
+                  rel="noreferrer"
+                >
+                  Documentation
+                </a>
                 <EdbBridgeStatus />
               </footer>