harivansh-afk/sandbox-agent
1
0
Fork 0
mirror of https://github.com/harivansh-afk/sandbox-agent.git synced 2026-04-15 06:04:43 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

feat(website): add inspector section with debugger screenshot (#11)

Browse source
This commit is contained in:
Nathan Flurry 2026-01-28 05:14:30 -08:00 • committed by GitHub
parent 8acb2bb078
commit fc0a8fce15
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
3 changed files with 38 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

BIN
frontend/packages/website/public/images/inspector.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 1.1 MiB

36
frontend/packages/website/src/components/Inspector.tsx Normal file
View file

@ -0,0 +1,36 @@
'use client';
import { ArrowRight } from 'lucide-react';
export function Inspector() {
return (
<section className="relative overflow-hidden border-t border-white/5 py-24">
<div className="mx-auto max-w-4xl px-6 text-center">
<h2 className="mb-4 text-3xl font-medium tracking-tight text-white md:text-5xl">
Built-in Debugger
</h2>
<p className="mb-12 text-lg text-zinc-400">
Inspect sessions, view event payloads, and troubleshoot without writing code.
</p>
<div className="mb-10 overflow-hidden rounded-2xl border border-white/10 shadow-2xl">
<img
src="/images/inspector.png"
alt="Sandbox Agent Inspector"
className="w-full"
/>
</div>
<a
href="https://inspect.sandboxagent.dev"
target="_blank"
rel="noopener noreferrer"
className="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md border border-white/10 bg-white px-5 py-2.5 text-sm font-medium text-black subpixel-antialiased shadow-sm transition-colors hover:bg-zinc-200"
>
Open Inspector
<ArrowRight className="h-4 w-4" />
</a>
</div>
</section>
);
}

2
frontend/packages/website/src/pages/index.astro
View file

@ -4,6 +4,7 @@ import { Navigation } from '../components/Navigation';
import { Hero } from '../components/Hero';
import { FeatureGrid } from '../components/FeatureGrid';
import { GetStarted } from '../components/GetStarted';
import { Inspector } from '../components/Inspector';
import { FAQ } from '../components/FAQ';
import { Footer } from '../components/Footer';
---
@ -15,6 +16,7 @@ import { Footer } from '../components/Footer';
<Hero client:load />
<FeatureGrid client:visible />
<GetStarted client:visible />
<Inspector client:visible />
<FAQ client:visible />
</main>
<Footer client:visible />