From 5cb19d9758ae0fd68c67010619f548a48bbafa76 Mon Sep 17 00:00:00 2001
From: Ruslan Magana Vsevolodovna <ruslan_mv@mail.ru>
Date: Tue, 16 Jun 2026 21:22:25 +0200
Subject: [PATCH] Account creation feature

---
 docs/index.html                     | 27 +++++++++++++++++----------
 frontend/components/AuthPage.jsx    |  6 ++++--
 frontend/components/LandingPage.jsx | 26 +++++++++++++++++++++-----
 frontend/components/auth.css        | 13 +++++++++++--
 frontend/components/landing.css     | 16 +++++++++++++---
 vercel.json                         |  2 +-
 6 files changed, 67 insertions(+), 23 deletions(-)

diff --git a/docs/index.html b/docs/index.html
index bd210b3..cdc259a 100644
--- a/docs/index.html
+++ b/docs/index.html
@@ -4,12 +4,12 @@
   <meta charset="utf-8" />
   <meta name="viewport" content="width=device-width, initial-scale=1" />
   <title>GitPilot — The first open-source multi-agent AI coding assistant.</title>
-  <meta name="description" content="GitPilot deploys four specialized AI agents (Explorer, Planner, Coder, Reviewer) that collaborate on every coding task. They read your repo, plan safe changes, write code, run tests, and wait for your approval. Open source, any LLM, free with Ollama." />
+  <meta name="description" content="GitPilot orchestrates specialized AI agents in configurable topologies (routing, ReAct + subagents, task pipelines). They read your repo, plan safe changes, write code, run tests, and wait for your approval. Open source, any LLM, free with Ollama." />
   <meta name="theme-color" content="#1C1C1F" />
 
   <!-- Open Graph -->
   <meta property="og:title" content="GitPilot — Multi-Agent AI Coding Assistant" />
-  <meta property="og:description" content="Four specialized AI agents collaborate on every task. Not a chatbot — a team. Open source, any LLM, you approve every change." />
+  <meta property="og:description" content="Specialized AI agents collaborate on every task in configurable topologies. Not a chatbot — a team. Open source, any LLM, you approve every change." />
   <meta property="og:type" content="website" />
   <meta property="og:url" content="https://ruslanmv.github.io/gitpilot/" />
   <meta property="og:image" content="./logo.svg" />
@@ -58,8 +58,8 @@ <h1 class="hero__title">
 
         <p class="hero__sub">
           Most AI coding tools are a single model guessing at your codebase.
-          GitPilot deploys <strong>four specialized agents</strong> &mdash; Explorer, Planner, Coder, Reviewer &mdash;
-          that collaborate on every task. They read your repo, draft a plan, write the code, run your tests, and
+          GitPilot orchestrates <strong>specialized agents</strong> &mdash; Explorer, Planner, Coder, Reviewer and more &mdash;
+          in configurable topologies that collaborate on every task. They read your repo, draft a plan, write the code, run your tests, and
           <strong>wait for your approval</strong> before touching a single file.
           Any LLM. Free and local with Ollama. Enterprise-ready.
         </p>
@@ -112,7 +112,7 @@ <h1 class="hero__title">
       <header class="section__head">
         <span class="eyebrow">Why multi-agent matters</span>
         <h2>A single chatbot guesses. A team of agents delivers.</h2>
-        <p class="section__sub">Four specialized AI agents share context, divide work, and check each other &mdash; the same pattern elite engineering teams use, automated at machine speed.</p>
+        <p class="section__sub">Specialized AI agents share context, divide work, and check each other &mdash; the same pattern elite engineering teams use, automated at machine speed.</p>
       </header>
 
       <ul class="features">
@@ -172,7 +172,7 @@ <h3>Local-first &amp; private</h3>
     <div class="container">
       <header class="section__head">
         <span class="eyebrow">The multi-agent pipeline</span>
-        <h2>Four agents. One mission. You stay in command.</h2>
+        <h2>A team of agents. One mission. You stay in command.</h2>
         <p class="section__sub">Each agent is a specialist. Together they do what no single model can: understand your repo deeply, plan safely, execute precisely, and catch their own mistakes.</p>
       </header>
 
@@ -212,15 +212,22 @@ <h2>Up and running in under a minute.</h2>
 
       <div class="tabs" data-tabs>
         <div class="tabs__list" role="tablist" aria-label="Install options">
-          <button class="tabs__tab is-active" role="tab" aria-selected="true" data-tab="pypi">Python / CLI</button>
+          <button class="tabs__tab is-active" role="tab" aria-selected="true" data-tab="web">Web</button>
+          <button class="tabs__tab" role="tab" aria-selected="false" data-tab="pypi">Python / CLI</button>
           <button class="tabs__tab" role="tab" aria-selected="false" data-tab="vscode">VS Code</button>
           <button class="tabs__tab" role="tab" aria-selected="false" data-tab="docker">Docker</button>
           <button class="tabs__tab" role="tab" aria-selected="false" data-tab="source">From source</button>
         </div>
 
         <div class="tabs__panels">
-          <div class="tabs__panel is-active" role="tabpanel" data-panel="pypi">
-            <p class="tabs__note">Fastest path. Python 3.11 or 3.12.</p>
+          <div class="tabs__panel is-active" role="tabpanel" data-panel="web">
+            <p class="tabs__note">Zero install &mdash; nothing to set up. Just open the hosted app.</p>
+            <p><a class="btn btn--primary" href="https://gitpilot.ruslanmv.com" rel="noopener">Open the web app &rarr;</a></p>
+            <p class="tabs__hint">Runs in your browser at <a href="https://gitpilot.ruslanmv.com" rel="noopener">gitpilot.ruslanmv.com</a> &mdash; same sessions, settings and approvals as the CLI and VS Code. Nothing to install.</p>
+          </div>
+
+          <div class="tabs__panel" role="tabpanel" data-panel="pypi" hidden>
+            <p class="tabs__note">Fastest local path. Python 3.11 or 3.12.</p>
             <div class="code" data-copy>
               <pre><code>pip install gitcopilot
 gitpilot serve</code></pre>
@@ -291,7 +298,7 @@ <h2>Bring your own model.</h2>
     <div class="container cta__inner">
       <div>
         <h2>Stop chatting with a chatbot. Start working with a team of agents.</h2>
-        <p>Open source. Apache 2.0. Four agents, any LLM, you approve every change. Your repo, your rules.</p>
+        <p>Open source. Apache 2.0. A team of agents, any LLM, you approve every change. Your repo, your rules.</p>
       </div>
       <div class="cta__actions">
         <a class="btn btn--primary" href="#quickstart">Install GitPilot</a>
diff --git a/frontend/components/AuthPage.jsx b/frontend/components/AuthPage.jsx
index a5f41ba..e066e55 100644
--- a/frontend/components/AuthPage.jsx
+++ b/frontend/components/AuthPage.jsx
@@ -221,9 +221,10 @@ export default function AuthPage({ onAuthenticated, backendReady = false }) {
   if (view === "github") {
     return (
       <div className="gp-auth">
+        <a className="gp-home" href="/">← Back to home</a>
         <div className="gp-auth-card">
           <button className="gp-back" onClick={goEmail}>← Back to sign in</button>
-          <div className="gp-auth-logo">GP</div>
+          <a className="gp-auth-logo" href="/" aria-label="Back to GitPilot home">GP</a>
 
           {ghPhase === "connecting" && (
             <>
@@ -271,11 +272,12 @@ export default function AuthPage({ onAuthenticated, backendReady = false }) {
   // ── Email / password card (sign in + create account share this shell) ──
   return (
     <div className="gp-auth">
+      <a className="gp-home" href="/">← Back to home</a>
       <form className="gp-auth-card" onSubmit={submit}>
         {mode === "signup" && (
           <button type="button" className="gp-back" onClick={() => { setMode("signin"); setNote(null); }}>← Back to sign in</button>
         )}
-        <div className="gp-auth-logo">GP</div>
+        <a className="gp-auth-logo" href="/" aria-label="Back to GitPilot home">GP</a>
         {mode === "signin" ? (
           <>
             <h2>GitPilot Enterprise</h2>
diff --git a/frontend/components/LandingPage.jsx b/frontend/components/LandingPage.jsx
index 57d798f..ec8bb4b 100644
--- a/frontend/components/LandingPage.jsx
+++ b/frontend/components/LandingPage.jsx
@@ -320,13 +320,25 @@ function PreviewCarousel() {
 }
 
 export default function LandingPage() {
+  // The app shell sets `body { overflow: hidden }` for the fixed workspace
+  // layout, which freezes mouse-wheel scrolling on this public page. Allow the
+  // page to scroll while the landing is mounted; restore on unmount.
+  useEffect(() => {
+    const prevBody = document.body.style.overflow;
+    const prevHtml = document.documentElement.style.overflow;
+    document.body.style.overflow = "auto";
+    document.documentElement.style.overflow = "auto";
+    return () => {
+      document.body.style.overflow = prevBody;
+      document.documentElement.style.overflow = prevHtml;
+    };
+  }, []);
+
   return (
     <div className="gp-landing">
-      <div className="gp-wrap">
-        {/* above-the-fold: navbar + hero + capabilities occupy one viewport */}
-        <div className="gp-fold">
-        {/* nav */}
-        <nav className="gp-nav">
+      {/* sticky top bar — keeps brand/home reachable from anywhere on the page */}
+      <header className="gp-topbar">
+        <nav className="gp-nav gp-wrap">
           <a className="gp-brand" href="/">
             <span className="gp-logo">GP</span>
             <span>
@@ -346,7 +358,11 @@ export default function LandingPage() {
             <a className="gp-btn gp-btn-primary" href="/auth?mode=signup">Get started</a>
           </div>
         </nav>
+      </header>
 
+      <div className="gp-wrap">
+        {/* above-the-fold: hero + capabilities occupy one viewport */}
+        <div className="gp-fold">
         {/* hero — vertically centered in the remaining fold space */}
         <div className="gp-fold-main">
         <header className="gp-hero">
diff --git a/frontend/components/auth.css b/frontend/components/auth.css
index 441b7e1..cbd1206 100644
--- a/frontend/components/auth.css
+++ b/frontend/components/auth.css
@@ -20,10 +20,19 @@
 }
 .gp-auth-logo {
   width: 64px; height: 64px; border-radius: 16px; margin: 0 auto 22px; display: grid; place-items: center;
-  font-weight: 800; font-size: 22px; color: var(--o);
+  font-weight: 800; font-size: 22px; color: var(--o); text-decoration: none;
   background: linear-gradient(150deg, rgba(255,90,43,.22), rgba(255,90,43,.08));
-  border: 1px solid rgba(255,90,43,.25);
+  border: 1px solid rgba(255,90,43,.25); transition: filter .15s, transform .15s;
 }
+a.gp-auth-logo:hover { filter: brightness(1.12); transform: translateY(-1px); }
+
+/* subtle "back to home" affordance on the dedicated auth page */
+.gp-home {
+  position: fixed; top: 18px; left: 20px; z-index: 5;
+  display: inline-flex; align-items: center; gap: 6px;
+  font-size: 13px; color: var(--mut); text-decoration: none; opacity: .72;
+}
+.gp-home:hover { opacity: 1; color: var(--tx); }
 .gp-auth h2 { font-size: 26px; font-weight: 750; margin: 0 0 12px; letter-spacing: -0.02em; }
 .gp-auth .lead { color: var(--mut); font-size: 14.5px; line-height: 1.5; margin: 0 0 26px; }
 
diff --git a/frontend/components/landing.css b/frontend/components/landing.css
index 7ecf979..17664f7 100644
--- a/frontend/components/landing.css
+++ b/frontend/components/landing.css
@@ -24,10 +24,19 @@
 .gp-landing * { box-sizing: border-box; }
 .gp-wrap { max-width: 1160px; margin: 0 auto; padding: 0 28px; }
 
+/* --- sticky top bar --- */
+.gp-topbar {
+  position: sticky; top: 0; z-index: 60;
+  background: rgba(10, 10, 12, 0.72);
+  backdrop-filter: saturate(150%) blur(12px);
+  -webkit-backdrop-filter: saturate(150%) blur(12px);
+  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
+}
+
 /* --- nav --- */
 .gp-nav {
   display: flex; align-items: center; justify-content: space-between;
-  height: 78px;
+  height: 72px;
 }
 .gp-brand { display: flex; align-items: center; gap: 12px; text-decoration: none; }
 .gp-logo {
@@ -81,8 +90,9 @@
 .gp-trust span { display: inline-flex; align-items: center; gap: 7px; font-size: 13px; color: var(--gp-faint); }
 .gp-trust svg { width: 15px; height: 15px; color: var(--gp-orange); }
 
-/* --- above-the-fold container: nav + hero + capabilities = one viewport --- */
-.gp-fold { min-height: 100vh; min-height: 100dvh; display: flex; flex-direction: column; }
+/* --- above-the-fold container: hero + capabilities fill the viewport
+   (minus the 72px sticky top bar) so the next section stays below the fold --- */
+.gp-fold { min-height: calc(100vh - 72px); min-height: calc(100dvh - 72px); display: flex; flex-direction: column; }
 .gp-fold-main { flex: 1 1 auto; display: flex; align-items: center; }
 .gp-fold-main .gp-hero { width: 100%; padding: 24px 0; }
 .gp-fold .gp-llm-sec { padding: 44px 0 46px; }
diff --git a/vercel.json b/vercel.json
index da33caf..8b92aa2 100644
--- a/vercel.json
+++ b/vercel.json
@@ -4,6 +4,6 @@
   "installCommand": "npm install",
   "framework": "vite",
   "rewrites": [
-    { "source": "/((?!assets/|favicon|robots|sitemap|og-image|site\\.webmanifest|api/).*)", "destination": "/index.html" }
+    { "source": "/(.*)", "destination": "/index.html" }
   ]
 }