From 591d7de1bae9fd37d47bb182c509b8a3e535d283 Mon Sep 17 00:00:00 2001 From: Thanan Traiongthawon <95660+nullcoder@users.noreply.github.com> Date: Sat, 7 Jun 2025 15:40:47 -0700 Subject: [PATCH 1/4] feat: create comprehensive content pages and update navigation MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Create complete content strategy with 6 new pages: - Home page with hero section, live demo, features, trust signals - Help/FAQ with quick start, troubleshooting, security best practices - Security page with technical deep-dive into encryption architecture - Examples page showcasing 8 real-world use cases with code samples - About page highlighting human-AI collaboration and zero-knowledge promise - Privacy and Terms pages with clear, friendly language Update navigation structure: - Header: focused on primary actions (Create, Examples, Help, GitHub) - Footer: comprehensive sitemap with playful section headers - ✨ Make Magic, 🤝 Behind the Sheets, ⚖️ Boring (but Important) Technical improvements: - Responsive design with mobile-first approach - Consistent component patterns using shadcn/ui - Proper SEO with metadata for all pages - Accessibility with semantic HTML and ARIA labels - ESLint compliant with proper quote escaping Logo size increased from "xl" to "2xl" for better visual impact. All content emphasizes zero-knowledge encryption and user privacy. 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude --- app/about/page.tsx | 458 ++++++++++++++++++++++++++++++ app/examples/page.tsx | 497 +++++++++++++++++++++++++++++++++ app/help/page.tsx | 497 +++++++++++++++++++++++++++++++++ app/page.tsx | 351 +++++++++++++++++++++-- app/privacy/page.tsx | 522 ++++++++++++++++++++++++++++++++++ app/security/page.tsx | 539 ++++++++++++++++++++++++++++++++++++ app/terms/page.tsx | 490 ++++++++++++++++++++++++++++++++ components/footer.tsx | 151 +++++++--- components/header.tsx | 29 +- components/ui/accordion.tsx | 66 +++++ package-lock.json | 68 ++++- package.json | 7 +- 12 files changed, 3599 insertions(+), 76 deletions(-) create mode 100644 app/about/page.tsx create mode 100644 app/examples/page.tsx create mode 100644 app/help/page.tsx create mode 100644 app/privacy/page.tsx create mode 100644 app/security/page.tsx create mode 100644 app/terms/page.tsx create mode 100644 components/ui/accordion.tsx diff --git a/app/about/page.tsx b/app/about/page.tsx new file mode 100644 index 0000000..8ef10c8 --- /dev/null +++ b/app/about/page.tsx @@ -0,0 +1,458 @@ +import { Metadata } from "next"; +import Link from "next/link"; +import { Button } from "@/components/ui/button"; +import { Card } from "@/components/ui/card"; +import { + Accordion, + AccordionContent, + AccordionItem, + AccordionTrigger, +} from "@/components/ui/accordion"; +import { Container } from "@/components/ui/container"; +import { + Code2, + Lock, + Zap, + Shield, + Clock, + Key, + Heart, + Sparkles, +} from "lucide-react"; +import { GithubIcon } from "@/components/icons/github-icon"; +import { GhostLogo } from "@/components/ghost-logo"; + +export const metadata: Metadata = { + title: "About - GhostPaste", + description: + "Learn about GhostPaste's zero-knowledge encrypted code sharing and our unique human-AI collaboration.", +}; + +export default function AboutPage() { + return ( + <> + {/* Hero Section */} +
+ +
+
+ +
+ +

+ Your Code's Secret Keeper +

+ +

+ GhostPaste isn't just another paste service. It's a + promise that your code remains yours—invisible to everyone, + including us. +

+ +
+ + +
+
+ +
+ + {/* How It Works */} +
+ +

How It Works

+ +
+ +
+ +
+

1. Paste

+

+ Your code is encrypted directly in your browser before anything + leaves your device +

+ + + +
+ +
+

2. Share

+

+ Only encrypted data reaches our servers. We store gibberish, you + keep the key +

+ + + +
+ +
+

3. Decrypt

+

+ Recipients decrypt locally with your shared key. Even we + can't see your code +

+ +
+ +
+ + {/* Core Features */} +
+ +

+ Core Features +

+ +
+
+ +
+

Client-Side Encryption

+

+ Everything encrypted in your browser using AES-256-GCM +

+
+
+ +
+ +
+

No Account Required

+

+ Share code instantly, anonymously, no sign-up needed +

+
+
+ +
+ +
+

Self-Destructing Options

+

+ One-time views & auto-expiry for sensitive shares +

+
+
+ +
+ +
+

Password Protection

+

+ Optional PIN for edit/delete access control +

+
+
+ +
+ +
+

Syntax Highlighting

+

+ Beautiful highlighting for all major languages +

+
+
+ +
+ +
+

Version History

+

+ Track changes without compromising privacy +

+
+
+
+ +
+ + {/* Our Promise */} +
+ + +

+ 📜 The GhostPaste Promise +

+ +
+
+ ✓ + We never see your unencrypted code +
+
+ ✓ + We don't track users or sell data +
+
+ ✓ + We can't recover lost decryption keys +
+
+ ✓ + + We can't comply with requests to decrypt your data +
+ + (because we literally can't) + + +
+
+ +

+ Your privacy isn't a feature—it's our foundation. +

+ + +
+ + {/* Built With Love (and AI) */} +
+ +
+

+ Built With Love (and AI) + 🤖❤️ +

+ +
+

+ GhostPaste is proudly built through human-AI collaboration. We + pair program with Claude Code to ship features faster while + maintaining the highest standards of privacy and security. +

+ +

+ The irony? Even Claude, our AI collaborator, + can't decrypt your pastes. Zero-knowledge means + zero-knowledge—no exceptions, not even for the AI that helped + build it. +

+ +

+ Every commit in our repository tells a story of effective + human-AI partnership. We believe the future of development + isn't human vs. AI— it's human with AI, building + better software together. +

+
+ +
+ + Co-Authored-By: Claude <claude@ghostpaste.dev> + +
+ +
+ + +
+
+ +
+ + {/* Technical Details */} +
+ +
+

+ For the Technically Curious +

+ + + + Technical Stack + +
+
+ Encryption: AES-256-GCM (military-grade) +
+
+ Key Derivation: PBKDF2-SHA256 +
+
+ Frontend: Next.js 15, TypeScript, + Tailwind CSS +
+
+ Infrastructure: Cloudflare Workers + R2 + (edge-powered) +
+
+ Development: Human-AI pair programming + with Claude +
+
+ Code Quality: Every commit reviewed by + human eyes +
+
+ + + + + Security Model + +
+

+ GhostPaste uses client-side encryption exclusively. Your + plaintext never leaves your browser. The encryption key is + generated locally and shared via URL fragment (after the + #), which is never sent to servers. +

+

+ We implement defense in depth: even if our servers were + compromised, your data would remain encrypted and + unreadable. +

+
+ + + + + Limits & Constraints + +
+
+ File Size: 500KB per file +
+
+ Total Size: 5MB per paste +
+
+ Files per Paste: Up to 20 files +
+
+ Retention: 30 days (or custom expiry) +
+
+ + + +
+ +
+ + {/* FAQ */} +
+ +
+

+ Frequently Asked Questions +

+ + + + + What if I lose my decryption key? + + + Unfortunately, we cannot help recover lost keys. This is by + design—if we could decrypt your data, it wouldn't be + truly private. Always save your share links carefully. + + + + + Can you see my code? + + No. Your code is encrypted in your browser before it reaches + us. We only store encrypted data that looks like random + gibberish without your key. + + + + + Who built GhostPaste? + + GhostPaste is a human-AI collaboration. We work with Claude + Code to build features faster and better. But don't + worry—Claude follows the same rules we do: zero access to your + decrypted data. Even our AI assistant sees only ghosts! 👻🤖 + + + + + Is this really secure? + + Yes. We use industry-standard AES-256-GCM encryption, the same + used by governments and financial institutions. The key never + touches our servers, making it mathematically impossible for + us to decrypt your data. + + + + + Is GhostPaste open source? + + Yes! Our code is fully open source on GitHub. You can audit + our encryption implementation, run your own instance, or + contribute improvements. Transparency builds trust. + + + +
+ +
+ + {/* CTA Section */} +
+ +
+

+ Ready to Share Code Privately? +

+

+ Join developers who trust GhostPaste for secure code sharing. No + account needed, just paste and go. +

+
+ + +
+
+ +
+ + {/* Console Easter Egg */} +