/* Marketing — Nav + Hero + Ticker + Features + Pricing + Footer */ const Nav = ({ onLogoClick }) => (
CryptoPrice.co
Sign in
); const Hero = () => (
Live · Updated every 8 seconds

Track every coin.
In real time.

Live prices for the top 100 cryptocurrencies. Set alerts. Watch markets. Build a portfolio — without the noise.

No credit card · 100 coins free · 5 alerts free
); const Ticker = ({ onSelectCoin }) => { const items = COINS.slice(0, 8); return (
{[...items, ...items, ...items].map((c, i) => ( ))}
); }; /* Featured coins grid — clickable cards under the hero */ const FeaturedCoins = ({ onSelectCoin }) => { const items = COINS.slice(0, 6); return (
Top markets

Tap any coin for live news + analysis

View all 100 coins
{items.map(c => ( ))}
); }; const Features = () => { const features = [ { icon: , title: "Real-time prices", desc: "Live data for the top 100 coins, refreshed every 8 seconds. Sub-second chart updates on Pro." }, { icon: , title: "Smart alerts", desc: "Notify by email, push, or Telegram when a coin crosses your price. Five free, unlimited on Pro." }, { icon: ,title: "Portfolio tracking", desc: "Manual entry or wallet connect. See your allocation, P&L, and 24h change in one place." }, { icon: , title: "AI signals", desc: "Bullish / bearish indicators based on momentum and volume divergence. Pro." }, { icon: , title: "Export anywhere", desc: "Download your portfolio and watchlist as CSV or Excel. No vendor lock-in." }, { icon: , title: "Developer API", desc: "REST + WebSocket access to the same data that powers the app. Tiered pricing from $0." }, ]; return (
Features

Everything a serious tracker needs. None of the noise.

{features.map(f => (
{React.cloneElement(f.icon, { size: 18 })}
{f.title}
{f.desc}
))}
); }; const Pricing = () => { const tiers = [ { name: "Free", price: "$0", period: "forever", desc: "For getting started.", features: ["Top 100 coins, real-time","5 price alerts","Basic watchlist","Email support"], cta: "Start free", variant: "secondary" }, { name: "Pro", price: "$10", period: "per month", featured: true, desc: "For active traders.", features: ["Everything in Free","Unlimited alerts (push, email, Telegram)","Portfolio tracking + wallet connect","AI bullish/bearish signals","CSV / Excel export","Priority support"], cta: "Start Pro trial", variant: "primary" }, { name: "API", price: "$49", period: "per month", desc: "For developers.", features: ["10K requests / day","REST + WebSocket","99.9% uptime SLA","Dedicated support"], cta: "Get API access", variant: "secondary" }, ]; return (
Pricing

Simple, fair, no asterisks.

{tiers.map(t => (
{t.featured && MOST POPULAR}
{t.name}
{t.price} {t.period}
{t.desc}
    {t.features.map(f => (
  • ✓{f}
  • ))}
))}
); }; const Footer = () => ( ); Object.assign(window, { Nav, Hero, Ticker, FeaturedCoins, Features, Pricing, Footer });