Skip to content

Commit bcc926c

Browse files
author
StackMemory Bot (CLI)
committed
feat(site): add landing page with GitHub Pages deployment
Plain HTML + Tailwind CDN landing page at site/index.html with dark/light toggle, feature grid, quick start, and core concepts. Deploys automatically via GitHub Actions on changes to site/.
1 parent 4b17e5c commit bcc926c

File tree

3 files changed

+285
-0
lines changed

3 files changed

+285
-0
lines changed

.github/workflows/deploy-site.yml

Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
name: Deploy Landing Page
2+
3+
on:
4+
push:
5+
branches: [main]
6+
paths: ['site/**']
7+
8+
permissions:
9+
contents: read
10+
pages: write
11+
id-token: write
12+
13+
concurrency:
14+
group: pages
15+
cancel-in-progress: false
16+
17+
jobs:
18+
deploy:
19+
environment:
20+
name: github-pages
21+
url: ${{ steps.deployment.outputs.page_url }}
22+
runs-on: ubuntu-latest
23+
steps:
24+
- uses: actions/checkout@v4
25+
- uses: actions/upload-pages-artifact@v3
26+
with:
27+
path: site
28+
- uses: actions/deploy-pages@v4
29+
id: deployment

site/favicon.svg

Lines changed: 5 additions & 0 deletions
Loading

site/index.html

Lines changed: 251 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,251 @@
1+
<!DOCTYPE html>
2+
<html lang="en" class="dark">
3+
<head>
4+
<meta charset="UTF-8">
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6+
<title>StackMemory — Lossless memory for AI coding tools</title>
7+
<meta name="description" content="Lossless, project-scoped memory for AI coding tools. Durable context across sessions with MCP tools, FTS5 search, Linear sync, and automatic hooks.">
8+
<link rel="icon" href="favicon.svg" type="image/svg+xml">
9+
<script src="https://cdn.tailwindcss.com"></script>
10+
<script>
11+
tailwind.config = {
12+
darkMode: 'class',
13+
theme: {
14+
extend: {
15+
fontFamily: {
16+
mono: ['ui-monospace', 'SFMono-Regular', 'SF Mono', 'Menlo', 'Consolas', 'Liberation Mono', 'monospace'],
17+
}
18+
}
19+
}
20+
}
21+
</script>
22+
<style>
23+
html { scroll-behavior: smooth; }
24+
.code-block { position: relative; }
25+
.code-block button {
26+
position: absolute; top: 0.5rem; right: 0.5rem;
27+
opacity: 0; transition: opacity 150ms;
28+
}
29+
.code-block:hover button { opacity: 1; }
30+
</style>
31+
</head>
32+
<body class="bg-white dark:bg-neutral-950 text-neutral-900 dark:text-neutral-100 antialiased">
33+
34+
<!-- Header -->
35+
<header class="sticky top-0 z-50 backdrop-blur bg-white/80 dark:bg-neutral-950/80 border-b border-neutral-200 dark:border-neutral-800">
36+
<div class="max-w-5xl mx-auto px-6 h-14 flex items-center justify-between">
37+
<a href="#" class="font-semibold text-base tracking-tight">StackMemory</a>
38+
<nav class="flex items-center gap-5 text-sm">
39+
<a href="#features" class="text-neutral-600 dark:text-neutral-400 hover:text-neutral-900 dark:hover:text-neutral-100 transition-colors">Features</a>
40+
<a href="#quickstart" class="text-neutral-600 dark:text-neutral-400 hover:text-neutral-900 dark:hover:text-neutral-100 transition-colors">Quick Start</a>
41+
<a href="https://github.com/stackmemoryai/stackmemory" target="_blank" rel="noopener" class="text-neutral-600 dark:text-neutral-400 hover:text-neutral-900 dark:hover:text-neutral-100 transition-colors underline underline-offset-2">GitHub</a>
42+
<a href="https://www.npmjs.com/package/@stackmemoryai/stackmemory" target="_blank" rel="noopener" class="text-neutral-600 dark:text-neutral-400 hover:text-neutral-900 dark:hover:text-neutral-100 transition-colors underline underline-offset-2">npm</a>
43+
<button id="theme-toggle" class="p-1.5 rounded-md text-neutral-500 hover:text-neutral-900 dark:hover:text-neutral-100 hover:bg-neutral-100 dark:hover:bg-neutral-800 transition-colors" aria-label="Toggle theme">
44+
<svg id="icon-sun" class="w-4 h-4 hidden dark:block" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"><circle cx="12" cy="12" r="5"/><path d="M12 1v2m0 18v2M4.22 4.22l1.42 1.42m12.72 12.72l1.42 1.42M1 12h2m18 0h2M4.22 19.78l1.42-1.42M18.36 5.64l1.42-1.42"/></svg>
45+
<svg id="icon-moon" class="w-4 h-4 block dark:hidden" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"><path d="M21 12.79A9 9 0 1111.21 3 7 7 0 0021 12.79z"/></svg>
46+
</button>
47+
</nav>
48+
</div>
49+
</header>
50+
51+
<main class="max-w-5xl mx-auto px-6">
52+
53+
<!-- Hero -->
54+
<section class="py-20 md:py-28">
55+
<h1 class="text-3xl md:text-4xl font-semibold tracking-tight leading-tight max-w-2xl">
56+
Lossless, project-scoped memory for AI coding tools.
57+
</h1>
58+
<p class="mt-4 text-neutral-600 dark:text-neutral-400 text-base leading-relaxed max-w-xl">
59+
StackMemory preserves full project context across sessions. Instead of a linear chat log, it organizes memory as a call stack of scoped work with intelligent retrieval.
60+
</p>
61+
<div class="mt-8 code-block">
62+
<pre class="bg-neutral-100 dark:bg-neutral-800 rounded-lg px-5 py-4 text-sm font-mono inline-block overflow-x-auto max-w-full"><code>npm install -g @stackmemoryai/stackmemory</code></pre>
63+
<button onclick="navigator.clipboard.writeText('npm install -g @stackmemoryai/stackmemory')" class="text-xs text-neutral-500 hover:text-neutral-700 dark:hover:text-neutral-300 bg-neutral-200 dark:bg-neutral-700 rounded px-2 py-1">Copy</button>
64+
</div>
65+
<div class="mt-6 flex flex-wrap gap-3">
66+
<a href="https://www.npmjs.com/package/@stackmemoryai/stackmemory"><img src="https://img.shields.io/npm/v/@stackmemoryai/stackmemory" alt="npm version"></a>
67+
<a href="https://github.com/stackmemoryai/stackmemory/actions/workflows/test-shared-context.yml"><img src="https://github.com/stackmemoryai/stackmemory/actions/workflows/test-shared-context.yml/badge.svg?branch=main" alt="Tests"></a>
68+
<a href="https://codecov.io/gh/stackmemoryai/stackmemory"><img src="https://codecov.io/gh/stackmemoryai/stackmemory/branch/main/graph/badge.svg" alt="Coverage"></a>
69+
</div>
70+
</section>
71+
72+
<!-- Why -->
73+
<section class="py-16 border-t border-neutral-200 dark:border-neutral-800">
74+
<h2 class="text-xl font-semibold tracking-tight">Why StackMemory</h2>
75+
<p class="mt-2 text-sm text-neutral-500 dark:text-neutral-400 italic">Memory is storage. Context is a compiled view.</p>
76+
<div class="mt-8 grid gap-6 md:grid-cols-3">
77+
<div>
78+
<h3 class="font-semibold text-sm">Context survives sessions</h3>
79+
<p class="mt-1 text-sm text-neutral-600 dark:text-neutral-400 leading-relaxed">Decisions, constraints, and progress persist across <code class="bg-neutral-100 dark:bg-neutral-800 px-1 rounded text-xs">/clear</code> operations and session restarts.</p>
80+
</div>
81+
<div>
82+
<h3 class="font-semibold text-sm">Call-stack organization</h3>
83+
<p class="mt-1 text-sm text-neutral-600 dark:text-neutral-400 leading-relaxed">Nested frames with importance scoring. Only the active path is "hot" — the rest stays accessible but quiet.</p>
84+
</div>
85+
<div>
86+
<h3 class="font-semibold text-sm">Zero-config</h3>
87+
<p class="mt-1 text-sm text-neutral-600 dark:text-neutral-400 leading-relaxed"><code class="bg-neutral-100 dark:bg-neutral-800 px-1 rounded text-xs">stackmemory init</code> just works. No database setup, no cloud account, no configuration files.</p>
88+
</div>
89+
</div>
90+
</section>
91+
92+
<!-- Features -->
93+
<section id="features" class="py-16 border-t border-neutral-200 dark:border-neutral-800">
94+
<h2 class="text-xl font-semibold tracking-tight">Features</h2>
95+
<div class="mt-8 grid gap-6 sm:grid-cols-2 lg:grid-cols-3">
96+
<div class="p-5 rounded-lg border border-neutral-200 dark:border-neutral-800">
97+
<h3 class="font-semibold text-sm">32 MCP Tools</h3>
98+
<p class="mt-2 text-sm text-neutral-600 dark:text-neutral-400 leading-relaxed">Context, tasks, Linear, traces, discovery, cord, and team tools for Claude Code integration.</p>
99+
</div>
100+
<div class="p-5 rounded-lg border border-neutral-200 dark:border-neutral-800">
101+
<h3 class="font-semibold text-sm">FTS5 Search</h3>
102+
<p class="mt-2 text-sm text-neutral-600 dark:text-neutral-400 leading-relaxed">Full-text search with BM25 scoring, hybrid retrieval, and smart thresholds. Finds what matters.</p>
103+
</div>
104+
<div class="p-5 rounded-lg border border-neutral-200 dark:border-neutral-800">
105+
<h3 class="font-semibold text-sm">Linear Integration</h3>
106+
<p class="mt-2 text-sm text-neutral-600 dark:text-neutral-400 leading-relaxed">Bidirectional sync with API key and OAuth support. Tasks flow between Linear and your coding session.</p>
107+
</div>
108+
<div class="p-5 rounded-lg border border-neutral-200 dark:border-neutral-800">
109+
<h3 class="font-semibold text-sm">Automatic Hooks</h3>
110+
<p class="mt-2 text-sm text-neutral-600 dark:text-neutral-400 leading-relaxed">Context save, task tracking, Linear sync, and PROMPT_PLAN progress — all automatic, non-blocking.</p>
111+
</div>
112+
<div class="p-5 rounded-lg border border-neutral-200 dark:border-neutral-800">
113+
<h3 class="font-semibold text-sm">Wrapper Scripts</h3>
114+
<p class="mt-2 text-sm text-neutral-600 dark:text-neutral-400 leading-relaxed"><code class="bg-neutral-100 dark:bg-neutral-800 px-1 rounded text-xs">claude-sm</code>, <code class="bg-neutral-100 dark:bg-neutral-800 px-1 rounded text-xs">codex-sm</code>, <code class="bg-neutral-100 dark:bg-neutral-800 px-1 rounded text-xs">opencode-sm</code> — launch your tool with context pre-loaded.</p>
115+
</div>
116+
<div class="p-5 rounded-lg border border-neutral-200 dark:border-neutral-800">
117+
<h3 class="font-semibold text-sm">Skills System</h3>
118+
<p class="mt-2 text-sm text-neutral-600 dark:text-neutral-400 leading-relaxed"><code class="bg-neutral-100 dark:bg-neutral-800 px-1 rounded text-xs">/spec</code> for iterative specs, <code class="bg-neutral-100 dark:bg-neutral-800 px-1 rounded text-xs">/linear-run</code> for task execution via RLM orchestration.</p>
119+
</div>
120+
</div>
121+
</section>
122+
123+
<!-- Quick Start -->
124+
<section id="quickstart" class="py-16 border-t border-neutral-200 dark:border-neutral-800">
125+
<h2 class="text-xl font-semibold tracking-tight">Quick Start</h2>
126+
<p class="mt-2 text-sm text-neutral-600 dark:text-neutral-400">Requires Node &ge; 20</p>
127+
<div class="mt-6 code-block">
128+
<pre class="bg-neutral-100 dark:bg-neutral-800 rounded-lg px-5 py-4 text-sm font-mono leading-relaxed overflow-x-auto"><code><span class="text-neutral-500"># Install globally</span>
129+
npm install -g @stackmemoryai/stackmemory
130+
131+
<span class="text-neutral-500"># Initialize in your project</span>
132+
cd your-project
133+
stackmemory init
134+
135+
<span class="text-neutral-500"># Configure Claude Code integration</span>
136+
stackmemory setup-mcp
137+
138+
<span class="text-neutral-500"># Verify everything works</span>
139+
stackmemory doctor</code></pre>
140+
<button onclick="navigator.clipboard.writeText('npm install -g @stackmemoryai/stackmemory\ncd your-project\nstackmemory init\nstackmemory setup-mcp\nstackmemory doctor')" class="text-xs text-neutral-500 hover:text-neutral-700 dark:hover:text-neutral-300 bg-neutral-200 dark:bg-neutral-700 rounded px-2 py-1">Copy</button>
141+
</div>
142+
<p class="mt-4 text-sm text-neutral-600 dark:text-neutral-400">Restart Claude Code and StackMemory MCP tools will be available.</p>
143+
</section>
144+
145+
<!-- Core Concepts -->
146+
<section class="py-16 border-t border-neutral-200 dark:border-neutral-800">
147+
<h2 class="text-xl font-semibold tracking-tight">Core Concepts</h2>
148+
<div class="mt-6 overflow-x-auto">
149+
<table class="w-full text-sm">
150+
<thead>
151+
<tr class="border-b border-neutral-200 dark:border-neutral-800">
152+
<th class="text-left py-3 pr-6 font-semibold">Concept</th>
153+
<th class="text-left py-3 font-semibold">Meaning</th>
154+
</tr>
155+
</thead>
156+
<tbody class="text-neutral-600 dark:text-neutral-400">
157+
<tr class="border-b border-neutral-100 dark:border-neutral-800/50">
158+
<td class="py-3 pr-6 font-medium text-neutral-900 dark:text-neutral-100">Frame</td>
159+
<td class="py-3">A scoped unit of work, like a function call. Can span multiple turns and sessions.</td>
160+
</tr>
161+
<tr class="border-b border-neutral-100 dark:border-neutral-800/50">
162+
<td class="py-3 pr-6 font-medium text-neutral-900 dark:text-neutral-100">Call Stack</td>
163+
<td class="py-3">Nested frames. Only the active path is "hot" — the rest stays accessible.</td>
164+
</tr>
165+
<tr class="border-b border-neutral-100 dark:border-neutral-800/50">
166+
<td class="py-3 pr-6 font-medium text-neutral-900 dark:text-neutral-100">Event</td>
167+
<td class="py-3">Append-only record: message, tool call, or decision.</td>
168+
</tr>
169+
<tr class="border-b border-neutral-100 dark:border-neutral-800/50">
170+
<td class="py-3 pr-6 font-medium text-neutral-900 dark:text-neutral-100">Digest</td>
171+
<td class="py-3">Structured return value when a frame closes.</td>
172+
</tr>
173+
<tr>
174+
<td class="py-3 pr-6 font-medium text-neutral-900 dark:text-neutral-100">Anchor</td>
175+
<td class="py-3">Pinned fact — DECISION, CONSTRAINT, or INTERFACE.</td>
176+
</tr>
177+
</tbody>
178+
</table>
179+
</div>
180+
</section>
181+
182+
<!-- Integrations -->
183+
<section class="py-16 border-t border-neutral-200 dark:border-neutral-800">
184+
<h2 class="text-xl font-semibold tracking-tight">Integrations</h2>
185+
<div class="mt-6 flex flex-wrap gap-3">
186+
<span class="px-3 py-1.5 text-sm rounded-full border border-neutral-200 dark:border-neutral-700 bg-neutral-50 dark:bg-neutral-900">Claude Code</span>
187+
<span class="px-3 py-1.5 text-sm rounded-full border border-neutral-200 dark:border-neutral-700 bg-neutral-50 dark:bg-neutral-900">Codex</span>
188+
<span class="px-3 py-1.5 text-sm rounded-full border border-neutral-200 dark:border-neutral-700 bg-neutral-50 dark:bg-neutral-900">OpenCode</span>
189+
<span class="px-3 py-1.5 text-sm rounded-full border border-neutral-200 dark:border-neutral-700 bg-neutral-50 dark:bg-neutral-900">Linear</span>
190+
<span class="px-3 py-1.5 text-sm rounded-full border border-neutral-200 dark:border-neutral-700 bg-neutral-50 dark:bg-neutral-900">MCP Protocol</span>
191+
<span class="px-3 py-1.5 text-sm rounded-full border border-neutral-200 dark:border-neutral-700 bg-neutral-50 dark:bg-neutral-900">Browser MCP</span>
192+
</div>
193+
<p class="mt-4 text-sm text-neutral-600 dark:text-neutral-400 leading-relaxed">
194+
Runs as an MCP server. Editors call StackMemory on each interaction to fetch a compiled context bundle — editors don't store memory themselves.
195+
</p>
196+
</section>
197+
198+
<!-- Who is this for -->
199+
<section class="py-16 border-t border-neutral-200 dark:border-neutral-800">
200+
<h2 class="text-xl font-semibold tracking-tight">Who is this for</h2>
201+
<div class="mt-6 grid gap-4 sm:grid-cols-2">
202+
<div class="p-4 rounded-lg bg-neutral-50 dark:bg-neutral-900">
203+
<p class="font-semibold text-sm">Solo dev using Claude Code</p>
204+
<p class="mt-1 text-sm text-neutral-600 dark:text-neutral-400">Keep decisions, constraints, and progress across sessions.</p>
205+
</div>
206+
<div class="p-4 rounded-lg bg-neutral-50 dark:bg-neutral-900">
207+
<p class="font-semibold text-sm">Team using AI coding tools</p>
208+
<p class="mt-1 text-sm text-neutral-600 dark:text-neutral-400">Share project context across agents and teammates.</p>
209+
</div>
210+
<div class="p-4 rounded-lg bg-neutral-50 dark:bg-neutral-900">
211+
<p class="font-semibold text-sm">AI-first startup</p>
212+
<p class="mt-1 text-sm text-neutral-600 dark:text-neutral-400">Ship faster with persistent memory and automatic Linear sync.</p>
213+
</div>
214+
<div class="p-4 rounded-lg bg-neutral-50 dark:bg-neutral-900">
215+
<p class="font-semibold text-sm">Open-source maintainer</p>
216+
<p class="mt-1 text-sm text-neutral-600 dark:text-neutral-400">Onboard contributors and AI agents with durable project knowledge.</p>
217+
</div>
218+
</div>
219+
</section>
220+
221+
</main>
222+
223+
<!-- Footer -->
224+
<footer class="border-t border-neutral-200 dark:border-neutral-800 mt-8">
225+
<div class="max-w-5xl mx-auto px-6 py-10 flex flex-col sm:flex-row items-center justify-between gap-4 text-sm text-neutral-500 dark:text-neutral-400">
226+
<div class="flex items-center gap-4">
227+
<a href="https://github.com/stackmemoryai/stackmemory" target="_blank" rel="noopener" class="hover:text-neutral-900 dark:hover:text-neutral-100 underline underline-offset-2 transition-colors">GitHub</a>
228+
<a href="https://www.npmjs.com/package/@stackmemoryai/stackmemory" target="_blank" rel="noopener" class="hover:text-neutral-900 dark:hover:text-neutral-100 underline underline-offset-2 transition-colors">npm</a>
229+
<a href="https://github.com/stackmemoryai/stackmemory/blob/main/docs/cli.md" target="_blank" rel="noopener" class="hover:text-neutral-900 dark:hover:text-neutral-100 underline underline-offset-2 transition-colors">Docs</a>
230+
</div>
231+
<p>BSL 1.1 &mdash; converts to MIT after 4 years</p>
232+
</div>
233+
</footer>
234+
235+
<!-- Theme toggle -->
236+
<script>
237+
const html = document.documentElement;
238+
const toggle = document.getElementById('theme-toggle');
239+
const stored = localStorage.getItem('theme');
240+
241+
if (stored === 'light' || (!stored && window.matchMedia('(prefers-color-scheme: light)').matches)) {
242+
html.classList.remove('dark');
243+
}
244+
245+
toggle.addEventListener('click', () => {
246+
html.classList.toggle('dark');
247+
localStorage.setItem('theme', html.classList.contains('dark') ? 'dark' : 'light');
248+
});
249+
</script>
250+
</body>
251+
</html>

0 commit comments

Comments
 (0)