#!/bin/bash
cd "$(dirname "$0")"

# Generate simple SVG thumbnails for each template
for t in landing-saas portfolio-designer business-agency restaurant-cafe resume-cv app-showcase event-conference coming-soon; do
  case $t in
    landing-saas)
      colors='#6366f1 #1e1b4b #8b5cf6'
      label='SaaS Landing'
      ;;
    portfolio-designer)
      colors='#f97316 #1c1917 #fafaf9'
      label='Portfolio'
      ;;
    business-agency)
      colors='#0ea5e9 #0f172a #f8fafc'
      label='Agency'
      ;;
    restaurant-cafe)
      colors='#b45309 #1c1917 #fef3c7'
      label='Restaurant'
      ;;
    resume-cv)
      colors='#2563eb #1e293b #f1f5f9'
      label='Resume/CV'
      ;;
    app-showcase)
      colors='#06b6d4 #0f172a #7c3aed'
      label='App Landing'
      ;;
    event-conference)
      colors='#e11d48 #0f172a #fbbf24'
      label='Event'
      ;;
    coming-soon)
      colors='#8b5cf6 #1e1b4b #ec4899'
      label='Coming Soon'
      ;;
  esac

  c1=$(echo $colors | cut -d' ' -f1)
  c2=$(echo $colors | cut -d' ' -f2)
  c3=$(echo $colors | cut -d' ' -f3)

  cat > "${t}.svg" << EOF
<svg width="400" height="260" xmlns="http://www.w3.org/2000/svg">
  <defs>
    <linearGradient id="bg-${t}" x1="0%" y1="0%" x2="100%" y2="100%">
      <stop offset="0%" style="stop-color:${c2}"/>
      <stop offset="100%" style="stop-color:${c1}"/>
    </linearGradient>
  </defs>
  <rect width="400" height="260" rx="12" fill="url(#bg-${t})"/>
  <!-- Nav bar -->
  <rect x="0" y="0" width="400" height="32" rx="12" fill="rgba(0,0,0,0.3)"/>
  <rect x="12" y="10" width="60" height="12" rx="3" fill="${c1}" opacity="0.8"/>
  <rect x="280" y="10" width="40" height="12" rx="3" fill="rgba(255,255,255,0.2)"/>
  <rect x="330" y="10" width="40" height="12" rx="3" fill="rgba(255,255,255,0.2)"/>
  <!-- Hero text lines -->
  <rect x="40" y="70" width="200" height="18" rx="4" fill="rgba(255,255,255,0.9)"/>
  <rect x="40" y="96" width="160" height="10" rx="3" fill="rgba(255,255,255,0.3)"/>
  <rect x="40" y="112" width="180" height="10" rx="3" fill="rgba(255,255,255,0.3)"/>
  <!-- CTA button -->
  <rect x="40" y="136" width="100" height="28" rx="6" fill="${c1}"/>
  <!-- Content blocks -->
  <rect x="40" y="185" width="100" height="50" rx="6" fill="rgba(255,255,255,0.08)"/>
  <rect x="150" y="185" width="100" height="50" rx="6" fill="rgba(255,255,255,0.08)"/>
  <rect x="260" y="185" width="100" height="50" rx="6" fill="rgba(255,255,255,0.08)"/>
  <!-- Accent circle -->
  <circle cx="340" cy="90" r="40" fill="${c3}" opacity="0.15"/>
</svg>
EOF
done
echo "Generated thumbnails"