mirror of
https://github.com/harivansh-afk/sandbox-agent.git
synced 2026-04-15 08:03:46 +00:00
feat(inspector): update visual styling to match landing page - Update color scheme to match website (black bg, white/10 borders) - Add Open Sans font - Update button styles (white primary buttons) - Add collapsible tool results and status messages - Replace avatar letters with icons (User, Settings, AlertTriangle) - Add status dividers for session/turn events - Update feature coverage badges to lighter grey - Remove pill styling from event times - Update popup menus to solid black background feat(website): add Pi agent to hero diagram and update styling - Add Pi agent with cyan color (#06B6D4) to the diagram - Update layout to 3 agents on top row, 2 on bottom row - Add backdrop-blur glass effects for modern look - Add animated dot background that changes with active adapter - Add scroll fade effect for hero section - Update subtitle to include Pi in supported agents list - Increase 'CONNECTED TO' label font size feat(website): add site styling updates and SEO improvements - Update component styling to match Rivet design (FAQ, FeatureGrid, etc.) - Add SEO improvements (sitemap, robots.txt, meta tags, Open Graph) - Remove CTASection component - Update footer tagline - Add Pi logo
88 lines
3.5 KiB
Text
88 lines
3.5 KiB
Text
---
|
|
interface Props {
|
|
title: string;
|
|
description?: string;
|
|
}
|
|
|
|
const { title, description = "Universal SDK for coding agents. Control Claude Code, Codex, OpenCode, Amp, and Pi with unified events and sessions." } = Astro.props;
|
|
const canonicalURL = new URL(Astro.url.pathname, 'https://sandbox-agent.dev');
|
|
const ogImageURL = new URL('/og.png', 'https://sandbox-agent.dev');
|
|
|
|
const structuredData = {
|
|
"@context": "https://schema.org",
|
|
"@type": "SoftwareApplication",
|
|
"name": "Sandbox Agent SDK",
|
|
"applicationCategory": "DeveloperApplication",
|
|
"operatingSystem": "Linux, macOS, Windows",
|
|
"description": description,
|
|
"url": "https://sandbox-agent.dev",
|
|
"author": {
|
|
"@type": "Organization",
|
|
"name": "Rivet",
|
|
"url": "https://rivet.dev"
|
|
},
|
|
"offers": {
|
|
"@type": "Offer",
|
|
"price": "0",
|
|
"priceCurrency": "USD"
|
|
},
|
|
"keywords": "coding agents, AI SDK, Claude Code, Codex, OpenCode, Amp, sandbox, remote code execution, developer tools"
|
|
};
|
|
---
|
|
|
|
<!doctype html>
|
|
<html lang="en" class="dark">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
<meta name="description" content={description} />
|
|
<meta name="keywords" content="coding agents, AI SDK, Claude Code, Codex, OpenCode, Amp, Pi, sandbox, remote code execution, developer tools, AI coding assistant, code automation" />
|
|
<meta name="author" content="Rivet" />
|
|
<meta name="robots" content="index, follow" />
|
|
<meta name="theme-color" content="#000000" />
|
|
<link rel="canonical" href={canonicalURL} />
|
|
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
|
|
|
|
<!-- Preconnect to font providers -->
|
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
|
<link rel="preconnect" href="https://api.fontshare.com" crossorigin />
|
|
|
|
<!-- Satoshi for headings (from Fontshare) -->
|
|
<link href="https://api.fontshare.com/v2/css?f[]=satoshi@700,900&display=swap" rel="stylesheet" />
|
|
|
|
<!-- Open Sans + JetBrains Mono (from Google Fonts) -->
|
|
<link href="https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;600&family=Open+Sans:wght@400;500;600;700&display=swap" rel="stylesheet" />
|
|
|
|
<title>{title}</title>
|
|
|
|
<!-- Open Graph -->
|
|
<meta property="og:title" content={title} />
|
|
<meta property="og:description" content={description} />
|
|
<meta property="og:type" content="website" />
|
|
<meta property="og:url" content={canonicalURL} />
|
|
<meta property="og:site_name" content="Sandbox Agent SDK" />
|
|
<meta property="og:image" content={ogImageURL} />
|
|
<meta property="og:image:width" content="2400" />
|
|
<meta property="og:image:height" content="1260" />
|
|
<meta property="og:image:alt" content="Sandbox Agent SDK - Run Coding Agents in Sandboxes. Control Them Over HTTP." />
|
|
|
|
<!-- Twitter -->
|
|
<meta name="twitter:card" content="summary_large_image" />
|
|
<meta name="twitter:site" content="@rivet_dev" />
|
|
<meta name="twitter:creator" content="@rivet_dev" />
|
|
<meta name="twitter:title" content={title} />
|
|
<meta name="twitter:description" content={description} />
|
|
<meta name="twitter:image" content={ogImageURL} />
|
|
|
|
<!-- Structured Data -->
|
|
<script type="application/ld+json" set:html={JSON.stringify(structuredData)} />
|
|
</head>
|
|
<body class="min-h-screen bg-background text-foreground antialiased">
|
|
<slot />
|
|
</body>
|
|
</html>
|
|
|
|
<style is:global>
|
|
@import '../styles/global.css';
|
|
</style>
|