refactor: Remove emojis + Add Portfolio to Landing Page
EMOJI REMOVAL: - Replaced 🟢🟡🔴 emojis with CSS circles (bg-accent, bg-amber-400, bg-red-400) - Updated TLD Pricing pages (public + command) - Updated Landing Page feature pills - Updated Admin panel feature checklist PORTFOLIO FEATURE: - Added 'Portfolio Health' section to Landing Page under 'Beyond Hunting' - Highlights: SSL Monitor, Expiry Alerts, Valuation, P&L Tracking - Links to /command/portfolio - Uses 'Your Domain Insurance' tagline Portfolio Status: - Public Page: N/A (personal feature, no public page needed) - Command Center: ✅ Fully implemented with Add/Edit/Sell/Valuation - Admin Panel: ✅ Stats visible in Overview - Landing Page: ✅ Now advertised in 'Beyond Hunting' section
This commit is contained in:
yves.gugger
@ -672,7 +672,7 @@ export default function AdminPage() {
|
||||
{[
|
||||
{ feature: 'Renewal Trap Detection', status: '✅', desc: 'Warns when renewal >2x registration' },
|
||||
{ feature: '1y/3y Trend Tracking', status: '✅', desc: 'Shows price changes over time' },
|
||||
{ feature: 'Risk Level Badges', status: '✅', desc: '🟢 Low, 🟡 Medium, 🔴 High' },
|
||||
{ feature: 'Risk Level Badges', status: '✅', desc: 'Low, Medium, High indicators' },
|
||||
{ feature: 'Category Tabs', status: '✅', desc: 'Tech, Geo, Budget, Premium' },
|
||||
{ feature: 'Sparkline Charts', status: '✅', desc: 'Visual trend indicators' },
|
||||
{ feature: 'Blur for Free Users', status: '✅', desc: 'First 5 rows visible' },
|
||||
|
||||
@ -201,9 +201,12 @@ export default function TLDPricingPage() {
|
||||
level === 'medium' && "bg-amber-500/10 text-amber-400",
|
||||
level === 'low' && "bg-accent/10 text-accent"
|
||||
)}>
|
||||
{level === 'high' && '🔴'}
|
||||
{level === 'medium' && '🟡'}
|
||||
{level === 'low' && '🟢'}
|
||||
<span className={clsx(
|
||||
"w-2.5 h-2.5 rounded-full",
|
||||
level === 'high' && "bg-red-400",
|
||||
level === 'medium' && "bg-amber-400",
|
||||
level === 'low' && "bg-accent"
|
||||
)} />
|
||||
<span className="hidden sm:inline ml-1">{reason}</span>
|
||||
</span>
|
||||
)
|
||||
|
||||
@ -31,9 +31,8 @@ import {
|
||||
Filter,
|
||||
Crosshair,
|
||||
Tag,
|
||||
AlertTriangle,
|
||||
Briefcase,
|
||||
DollarSign,
|
||||
Calendar,
|
||||
} from 'lucide-react'
|
||||
import Link from 'next/link'
|
||||
import clsx from 'clsx'
|
||||
@ -329,7 +328,7 @@ export default function HomePage() {
|
||||
</li>
|
||||
<li className="flex items-center gap-3 text-foreground-subtle">
|
||||
<Check className="w-4 h-4 text-accent flex-shrink-0" />
|
||||
<span>🟢🟡🟠🔴 Health status alerts</span>
|
||||
<span>Real-time health status alerts</span>
|
||||
</li>
|
||||
<li className="flex items-center gap-3 text-foreground-subtle">
|
||||
<Check className="w-4 h-4 text-accent flex-shrink-0" />
|
||||
@ -404,144 +403,166 @@ export default function HomePage() {
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className="grid md:grid-cols-3 gap-6 lg:gap-8">
|
||||
<div className="grid md:grid-cols-2 gap-6 lg:gap-8">
|
||||
{/* For Sale Marketplace */}
|
||||
<div className="group relative p-6 sm:p-8 bg-gradient-to-br from-accent/10 via-accent/5 to-transparent
|
||||
<div className="group relative p-8 sm:p-10 bg-gradient-to-br from-accent/10 via-accent/5 to-transparent
|
||||
border border-accent/20 rounded-3xl hover:border-accent/40 transition-all duration-500
|
||||
backdrop-blur-sm">
|
||||
{/* Corner accent */}
|
||||
<div className="absolute top-0 right-0 w-16 h-16 bg-accent/10 rounded-bl-[60px] rounded-tr-3xl" />
|
||||
<div className="absolute top-0 right-0 w-24 h-24 bg-accent/10 rounded-bl-[100px] rounded-tr-3xl" />
|
||||
|
||||
<div className="relative">
|
||||
<div className="flex items-start gap-4 mb-5">
|
||||
<div className="w-12 h-12 bg-accent/20 border border-accent/30 rounded-xl flex items-center justify-center shadow-lg shadow-accent/10">
|
||||
<Tag className="w-5 h-5 text-accent" />
|
||||
<div className="flex items-start gap-4 mb-6">
|
||||
<div className="w-14 h-14 bg-accent/20 border border-accent/30 rounded-2xl flex items-center justify-center shadow-lg shadow-accent/10">
|
||||
<Tag className="w-6 h-6 text-accent" />
|
||||
</div>
|
||||
<div>
|
||||
<h3 className="text-lg font-display text-foreground mb-0.5">Marketplace</h3>
|
||||
<p className="text-xs text-accent font-medium">Buy & Sell</p>
|
||||
<h3 className="text-xl font-display text-foreground mb-1">Sell Your Domains</h3>
|
||||
<p className="text-sm text-accent font-medium">Marketplace</p>
|
||||
</div>
|
||||
</div>
|
||||
<p className="text-sm text-foreground-muted mb-5 leading-relaxed">
|
||||
Create "For Sale" pages with one click.
|
||||
<p className="text-foreground-muted mb-6 leading-relaxed">
|
||||
Create professional "For Sale" landing pages with one click.
|
||||
<span className="text-foreground font-medium"> DNS verification</span> proves ownership.
|
||||
Buyers contact you directly through Pounce.
|
||||
</p>
|
||||
<ul className="space-y-2 text-sm mb-6">
|
||||
<li className="flex items-center gap-2 text-foreground-subtle">
|
||||
<ul className="space-y-3 text-sm mb-8">
|
||||
<li className="flex items-center gap-3 text-foreground-subtle">
|
||||
<div className="w-6 h-6 rounded-full bg-accent/10 flex items-center justify-center">
|
||||
<Shield className="w-3.5 h-3.5 text-accent" />
|
||||
</div>
|
||||
<span>Verified Owner badge</span>
|
||||
</li>
|
||||
<li className="flex items-center gap-2 text-foreground-subtle">
|
||||
<li className="flex items-center gap-3 text-foreground-subtle">
|
||||
<div className="w-6 h-6 rounded-full bg-accent/10 flex items-center justify-center">
|
||||
<BarChart3 className="w-3.5 h-3.5 text-accent" />
|
||||
</div>
|
||||
<span>Pounce Score valuation</span>
|
||||
</li>
|
||||
<li className="flex items-center gap-2 text-foreground-subtle">
|
||||
<li className="flex items-center gap-3 text-foreground-subtle">
|
||||
<div className="w-6 h-6 rounded-full bg-accent/10 flex items-center justify-center">
|
||||
<Lock className="w-3.5 h-3.5 text-accent" />
|
||||
</div>
|
||||
<span>Secure contact form</span>
|
||||
</li>
|
||||
</ul>
|
||||
<Link
|
||||
href="/buy"
|
||||
className="inline-flex items-center gap-2 px-4 py-2 bg-accent text-background text-sm font-medium rounded-xl hover:bg-accent-hover transition-all"
|
||||
className="inline-flex items-center gap-2 px-5 py-2.5 bg-accent text-background font-medium rounded-xl hover:bg-accent-hover transition-all"
|
||||
>
|
||||
Browse Marketplace
|
||||
<ArrowRight className="w-3.5 h-3.5" />
|
||||
<ArrowRight className="w-4 h-4" />
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Sniper Alerts */}
|
||||
<div className="group relative p-6 sm:p-8 bg-gradient-to-br from-foreground/[0.03] to-transparent
|
||||
<div className="group relative p-8 sm:p-10 bg-gradient-to-br from-foreground/[0.03] to-transparent
|
||||
border border-border rounded-3xl hover:border-accent/30 transition-all duration-500
|
||||
backdrop-blur-sm">
|
||||
{/* Decorative element */}
|
||||
<div className="absolute top-6 right-6 flex gap-1">
|
||||
<div className="w-2 h-2 rounded-full bg-accent/50 animate-pulse" />
|
||||
<div className="w-2 h-2 rounded-full bg-accent/30 animate-pulse delay-100" />
|
||||
<div className="w-2 h-2 rounded-full bg-accent/20 animate-pulse delay-200" />
|
||||
</div>
|
||||
|
||||
<div className="relative">
|
||||
<div className="flex items-start gap-4 mb-5">
|
||||
<div className="w-12 h-12 bg-foreground/10 border border-border rounded-xl flex items-center justify-center">
|
||||
<Target className="w-5 h-5 text-foreground" />
|
||||
<div className="flex items-start gap-4 mb-6">
|
||||
<div className="w-14 h-14 bg-foreground/10 border border-border rounded-2xl flex items-center justify-center">
|
||||
<Target className="w-6 h-6 text-foreground" />
|
||||
</div>
|
||||
<div>
|
||||
<h3 className="text-lg font-display text-foreground mb-0.5">Sniper Alerts</h3>
|
||||
<p className="text-xs text-foreground-muted">Hyper-Personalized</p>
|
||||
<h3 className="text-xl font-display text-foreground mb-1">Sniper Alerts</h3>
|
||||
<p className="text-sm text-foreground-muted">Hyper-Personalized</p>
|
||||
</div>
|
||||
</div>
|
||||
<p className="text-sm text-foreground-muted mb-5 leading-relaxed">
|
||||
<p className="text-foreground-muted mb-6 leading-relaxed">
|
||||
Ultra-specific filters that notify you <span className="text-foreground font-medium">exactly</span> when matching domains appear.
|
||||
<span className="italic"> "4-letter .com under $500 without numbers"</span> — we've got you.
|
||||
</p>
|
||||
<ul className="space-y-2 text-sm mb-6">
|
||||
<li className="flex items-center gap-2 text-foreground-subtle">
|
||||
<ul className="space-y-3 text-sm mb-8">
|
||||
<li className="flex items-center gap-3 text-foreground-subtle">
|
||||
<div className="w-6 h-6 rounded-full bg-foreground/5 flex items-center justify-center">
|
||||
<Filter className="w-3.5 h-3.5 text-accent" />
|
||||
<span>Custom TLD, length, price</span>
|
||||
</div>
|
||||
<span>Custom TLD, length, price filters</span>
|
||||
</li>
|
||||
<li className="flex items-center gap-2 text-foreground-subtle">
|
||||
<li className="flex items-center gap-3 text-foreground-subtle">
|
||||
<div className="w-6 h-6 rounded-full bg-foreground/5 flex items-center justify-center">
|
||||
<Bell className="w-3.5 h-3.5 text-accent" />
|
||||
</div>
|
||||
<span>Email & SMS alerts</span>
|
||||
</li>
|
||||
<li className="flex items-center gap-2 text-foreground-subtle">
|
||||
<li className="flex items-center gap-3 text-foreground-subtle">
|
||||
<div className="w-6 h-6 rounded-full bg-foreground/5 flex items-center justify-center">
|
||||
<Zap className="w-3.5 h-3.5 text-accent" />
|
||||
<span>Real-time matching</span>
|
||||
</div>
|
||||
<span>Real-time auction matching</span>
|
||||
</li>
|
||||
</ul>
|
||||
<Link
|
||||
href="/command/alerts"
|
||||
className="inline-flex items-center gap-2 px-4 py-2 border border-border text-foreground text-sm font-medium rounded-xl hover:border-accent hover:text-accent transition-all"
|
||||
className="inline-flex items-center gap-2 px-5 py-2.5 border border-border text-foreground font-medium rounded-xl hover:border-accent hover:text-accent transition-all"
|
||||
>
|
||||
Set Up Alerts
|
||||
<ArrowRight className="w-3.5 h-3.5" />
|
||||
<ArrowRight className="w-4 h-4" />
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Portfolio Management */}
|
||||
<div className="group relative p-6 sm:p-8 bg-gradient-to-br from-blue-500/10 via-blue-500/5 to-transparent
|
||||
border border-blue-500/20 rounded-3xl hover:border-blue-500/40 transition-all duration-500
|
||||
backdrop-blur-sm">
|
||||
{/* Corner accent */}
|
||||
<div className="absolute top-0 right-0 w-16 h-16 bg-blue-500/10 rounded-bl-[60px] rounded-tr-3xl" />
|
||||
|
||||
<div className="relative">
|
||||
<div className="flex items-start gap-4 mb-5">
|
||||
<div className="w-12 h-12 bg-blue-500/20 border border-blue-500/30 rounded-xl flex items-center justify-center">
|
||||
<Briefcase className="w-5 h-5 text-blue-400" />
|
||||
{/* Portfolio Management - Full Width Below */}
|
||||
<div className="mt-6 lg:mt-8">
|
||||
<div className="group relative p-8 sm:p-10 bg-gradient-to-r from-foreground/[0.02] via-accent/[0.03] to-foreground/[0.02]
|
||||
border border-border rounded-3xl hover:border-accent/30 transition-all duration-500">
|
||||
<div className="flex flex-col lg:flex-row lg:items-center gap-8">
|
||||
<div className="flex-1">
|
||||
<div className="flex items-center gap-4 mb-4">
|
||||
<div className="w-14 h-14 bg-accent/10 border border-accent/20 rounded-2xl flex items-center justify-center">
|
||||
<Briefcase className="w-6 h-6 text-accent" />
|
||||
</div>
|
||||
<div>
|
||||
<h3 className="text-lg font-display text-foreground mb-0.5">Portfolio</h3>
|
||||
<p className="text-xs text-blue-400 font-medium">Asset Tracking</p>
|
||||
<h3 className="text-xl font-display text-foreground">Portfolio Health</h3>
|
||||
<p className="text-sm text-accent font-medium">Your Domain Insurance</p>
|
||||
</div>
|
||||
</div>
|
||||
<p className="text-sm text-foreground-muted mb-5 leading-relaxed">
|
||||
Track your domains, costs, and ROI. <span className="text-foreground font-medium">Never miss a renewal</span>. Your domain business, organized.
|
||||
<p className="text-foreground-muted leading-relaxed max-w-2xl">
|
||||
Import your domains and let Pounce monitor them 24/7.
|
||||
<span className="text-foreground font-medium"> SSL expiry</span>,
|
||||
<span className="text-foreground font-medium"> renewal reminders</span>,
|
||||
<span className="text-foreground font-medium"> uptime checks</span>, and
|
||||
<span className="text-foreground font-medium"> P&L tracking</span> — all in one place.
|
||||
<span className="italic text-foreground-subtle"> Never miss a renewal again.</span>
|
||||
</p>
|
||||
<ul className="space-y-2 text-sm mb-6">
|
||||
<li className="flex items-center gap-2 text-foreground-subtle">
|
||||
<DollarSign className="w-3.5 h-3.5 text-blue-400" />
|
||||
<span>Purchase & sale tracking</span>
|
||||
</li>
|
||||
<li className="flex items-center gap-2 text-foreground-subtle">
|
||||
<Calendar className="w-3.5 h-3.5 text-blue-400" />
|
||||
<span>Renewal reminders</span>
|
||||
</li>
|
||||
<li className="flex items-center gap-2 text-foreground-subtle">
|
||||
<TrendingUp className="w-3.5 h-3.5 text-blue-400" />
|
||||
<span>P&L & valuations</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div className="flex flex-col sm:flex-row gap-4 lg:flex-col lg:items-end">
|
||||
<div className="flex items-center gap-6 text-sm text-foreground-subtle">
|
||||
<span className="flex items-center gap-2">
|
||||
<Shield className="w-4 h-4 text-accent" />
|
||||
SSL Monitor
|
||||
</span>
|
||||
<span className="flex items-center gap-2">
|
||||
<Clock className="w-4 h-4 text-accent" />
|
||||
Expiry Alerts
|
||||
</span>
|
||||
<span className="flex items-center gap-2">
|
||||
<TrendingUp className="w-4 h-4 text-accent" />
|
||||
Valuation
|
||||
</span>
|
||||
</div>
|
||||
<Link
|
||||
href="/command/portfolio"
|
||||
className="inline-flex items-center gap-2 px-4 py-2 bg-blue-500/10 text-blue-400 text-sm font-medium rounded-xl border border-blue-500/20 hover:bg-blue-500/20 transition-all"
|
||||
className="inline-flex items-center gap-2 px-5 py-2.5 bg-accent text-background font-medium rounded-xl hover:bg-accent-hover transition-all"
|
||||
>
|
||||
Manage Portfolio
|
||||
<ArrowRight className="w-3.5 h-3.5" />
|
||||
<ArrowRight className="w-4 h-4" />
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{/* Transition to TLDs */}
|
||||
@ -563,8 +584,18 @@ export default function HomePage() {
|
||||
Don't fall for $0.99 promos. We show renewal costs, price trends, and renewal traps across 886+ TLDs.
|
||||
</p>
|
||||
<div className="flex items-center gap-4 mt-4 text-sm text-foreground-subtle">
|
||||
<span className="flex items-center gap-1.5"><span className="text-amber-400">⚠️</span> Trap Detection</span>
|
||||
<span className="flex items-center gap-1.5">🟢🟡🔴 Risk Levels</span>
|
||||
<span className="flex items-center gap-1.5">
|
||||
<AlertTriangle className="w-4 h-4 text-amber-400" />
|
||||
Trap Detection
|
||||
</span>
|
||||
<span className="flex items-center gap-1.5">
|
||||
<span className="flex gap-0.5">
|
||||
<span className="w-2 h-2 rounded-full bg-accent" />
|
||||
<span className="w-2 h-2 rounded-full bg-amber-400" />
|
||||
<span className="w-2 h-2 rounded-full bg-red-400" />
|
||||
</span>
|
||||
Risk Levels
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<Link
|
||||
|
||||
@ -304,7 +304,11 @@ export default function TldPricingPage() {
|
||||
<span className="text-foreground-muted">Renewal Trap Detection</span>
|
||||
</div>
|
||||
<div className="flex items-center gap-2 px-4 py-2 bg-foreground/5 rounded-full text-sm">
|
||||
<span>🟢🟡🔴</span>
|
||||
<div className="flex items-center gap-1">
|
||||
<span className="w-2 h-2 rounded-full bg-accent" />
|
||||
<span className="w-2 h-2 rounded-full bg-amber-400" />
|
||||
<span className="w-2 h-2 rounded-full bg-red-400" />
|
||||
</div>
|
||||
<span className="text-foreground-muted">Risk Levels</span>
|
||||
</div>
|
||||
<div className="flex items-center gap-2 px-4 py-2 bg-foreground/5 rounded-full text-sm">
|
||||
@ -587,12 +591,15 @@ export default function TldPricingPage() {
|
||||
tld.risk_level === 'medium' && "bg-amber-500/10 text-amber-400",
|
||||
tld.risk_level === 'low' && "bg-accent/10 text-accent"
|
||||
)}>
|
||||
{tld.risk_level === 'high' && '🔴'}
|
||||
{tld.risk_level === 'medium' && '🟡'}
|
||||
{tld.risk_level === 'low' && '🟢'}
|
||||
<span className={clsx(
|
||||
"w-2.5 h-2.5 rounded-full",
|
||||
tld.risk_level === 'high' && "bg-red-400",
|
||||
tld.risk_level === 'medium' && "bg-amber-400",
|
||||
tld.risk_level === 'low' && "bg-accent"
|
||||
)} />
|
||||
</span>
|
||||
) : (
|
||||
<span className="text-foreground-subtle blur-[3px]">🟢</span>
|
||||
<span className="w-2.5 h-2.5 rounded-full bg-foreground-subtle blur-[3px]" />
|
||||
)}
|
||||
</td>
|
||||
<td className="px-4 sm:px-6 py-4">
|
||||
|
||||
Reference in New Issue
Block a user