Initial: pi-skill — 68 skills, 43 extensions, 11 themes for Pi

skills/scripts/templates/src/components/incentives/IncentiveCols.tsx

@@ -0,0 +1,25 @@
+import { Truck, RotateCcw, BadgeCheck, CustomerSupport } from 'lucide-react';
+
+const incentives = [
+  { icon: Truck, text: 'จัดส่งฟรี สั่งซื้อ 500฿ ขึ้นไป' },
+  { icon: RotateCcw, text: 'คืนสินค้าฟรี ภายใน 7 วัน' },
+  { icon: BadgeCheck, text: 'สินค้าคุณภาพ รับประกัน 1 ปี' },
+  { icon: CustomerSupport, text: 'ติดต่อ 086-xxx-xxxx' }
+];
+
+export default function IncentiveCols() {
+  return (
+    <section className="py-4 border-b">
+      <div className="container mx-auto px-4">
+        <div className="flex flex-wrap justify-center gap-6 md:gap-12">
+          {incentives.map((item, i) => (
+            <div key={i} className="flex items-center gap-2 text-sm text-gray-600">
+              <item.icon className="w-4 h-4 text-blue-600" />
+              <span>{item.text}</span>
+            </div>
+          ))}
+        </div>
+      </div>
+    </section>
+  );
+}

skills/scripts/templates/src/components/incentives/IncentiveLarge.tsx

@@ -0,0 +1,54 @@
+import { Truck, RefreshCw, Shield, HeadphonesIcon, CreditCard, Gift } from 'lucide-react';
+
+const incentives = [
+  {
+    icon: Truck,
+    title: 'จัดส่งฟรี',
+    description: 'สั่งซื้อ 500 บาทขึ้นไป จัดส่งฟรีทั่วประเทศ'
+  },
+  {
+    icon: RefreshCw,
+    title: 'คืนสินค้าได้',
+    description: 'ยกเลิกหรือเปลี่ยนสินค้าภายใน 7 วัน'
+  },
+  {
+    icon: Shield,
+    title: 'สินค้าคุณภาพ',
+    description: 'ตรวจสอบคุณภาพก่อนส่งทุกชิ้น'
+  },
+  {
+    icon: HeadphonesIcon,
+    title: 'ติดต่อง่าย',
+    description: 'พร้อมตอบคำถาม 24 ชั่วโมง'
+  },
+  {
+    icon: CreditCard,
+    title: 'ชำระเงินปลอดภัย',
+    description: 'รองรับบัตรเครดิต, QR Code, โอนเงิน'
+  },
+  {
+    icon: Gift,
+    title: 'ส่วนลดพิเศษ',
+    description: 'สมัครสมาชิกรับส่วนลด exclusive'
+  }
+];
+
+export default function IncentiveLarge() {
+  return (
+    <section className="py-12 bg-gray-50">
+      <div className="container mx-auto px-4">
+        <div className="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-6">
+          {incentives.map((item, i) => (
+            <div key={i} className="text-center">
+              <div className="w-14 h-14 mx-auto mb-3 bg-blue-100 rounded-full flex items-center justify-center">
+                <item.icon className="w-6 h-6 text-blue-600" />
+              </div>
+              <h3 className="font-medium text-sm mb-1">{item.title}</h3>
+              <p className="text-xs text-gray-500">{item.description}</p>
+            </div>
+          ))}
+        </div>
+      </div>
+    </section>
+  );
+}