Update remote soul-content with local content

app/about/page.tsx

@@ -0,0 +1,152 @@
+"use client"
+
+import Link from "next/link"
+import { ChevronLeft, Clock, MessageCircle, BookOpen, Users, Award, TrendingUp } from "lucide-react"
+import { Button } from "@/components/ui/button"
+import { useState } from "react"
+import { QRCodeModal } from "@/components/modules/marketing/qr-code-modal"
+import { useStore } from "@/lib/store"
+
+export default function AboutPage() {
+  const [showQRModal, setShowQRModal] = useState(false)
+  const { settings } = useStore()
+  const authorInfo = settings?.authorInfo || {
+    name: "卡若",
+    description: "连续创业者,私域运营专家",
+    liveTime: "06:00-09:00",
+    platform: "Soul派对房",
+  }
+
+  const milestones = [
+    { year: "2012", event: "开始做游戏推广,从魔兽世界外挂代理起步" },
+    { year: "2015", event: "转型电商,做天猫虚拟充值,月流水380万" },
+    { year: "2017", event: "团队扩张到200人,年流水3000万" },
+    { year: "2018", event: "公司破产,负债数百万,开始全国旅行反思" },
+    { year: "2019", event: "重新出发,专注私域运营和个人IP" },
+    { year: "2024", event: "在Soul派对房每日直播,分享真实商业故事" },
+  ]
+
+  const stats = [
+    { icon: BookOpen, value: "55+", label: "真实案例" },
+    { icon: Users, value: "10000+", label: "派对房听众" },
+    { icon: Award, value: "15年", label: "创业经验" },
+    { icon: TrendingUp, value: "3000万", label: "最高年流水" },
+  ]
+
+  return (
+    <div className="min-h-screen bg-[#0a1628] text-white pb-20">
+      {/* Header */}
+      <header className="sticky top-0 z-50 bg-[#0a1628]/90 backdrop-blur-md border-b border-gray-800">
+        <div className="max-w-4xl mx-auto px-4 py-4 flex items-center">
+          <Link href="/" className="flex items-center gap-2 text-gray-400 hover:text-white transition-colors">
+            <ChevronLeft className="w-5 h-5" />
+            <span>返回</span>
+          </Link>
+          <h1 className="flex-1 text-center text-lg font-semibold">关于作者</h1>
+          <div className="w-16" />
+        </div>
+      </header>
+
+      <main className="max-w-4xl mx-auto px-4 py-8">
+        {/* Author Card */}
+        <div className="bg-gradient-to-br from-[#38bdac]/20 to-[#0f2137] rounded-2xl p-8 border border-[#38bdac]/30 mb-8">
+          <div className="flex flex-col md:flex-row items-center gap-6">
+            <div className="w-24 h-24 rounded-full bg-gradient-to-br from-[#38bdac] to-[#1a5a50] flex items-center justify-center text-4xl font-bold text-white">
+              {authorInfo.name.charAt(0)}
+            </div>
+            <div className="text-center md:text-left flex-1">
+              <h2 className="text-2xl font-bold text-white mb-2">{authorInfo.name}</h2>
+              <p className="text-gray-400 mb-4">{authorInfo.description}</p>
+              <div className="flex items-center justify-center md:justify-start gap-4 text-sm">
+                <span className="flex items-center gap-1 text-[#38bdac]">
+                  <Clock className="w-4 h-4" />
+                  每日 {authorInfo.liveTime}
+                </span>
+                <span className="flex items-center gap-1 text-gray-400">
+                  <MessageCircle className="w-4 h-4" />
+                  {authorInfo.platform}
+                </span>
+              </div>
+            </div>
+            <Button onClick={() => setShowQRModal(true)} className="bg-[#38bdac] hover:bg-[#2da396] text-white">
+              <MessageCircle className="w-4 h-4 mr-2" />
+              加入派对群
+            </Button>
+          </div>
+        </div>
+
+        {/* Stats */}
+        <div className="grid grid-cols-2 md:grid-cols-4 gap-4 mb-8">
+          {stats.map((stat, index) => (
+            <div
+              key={index}
+              className="bg-[#0f2137]/60 backdrop-blur-md rounded-xl p-4 border border-gray-700/50 text-center"
+            >
+              <stat.icon className="w-6 h-6 text-[#38bdac] mx-auto mb-2" />
+              <p className="text-2xl font-bold text-white">{stat.value}</p>
+              <p className="text-gray-400 text-sm">{stat.label}</p>
+            </div>
+          ))}
+        </div>
+
+        {/* Introduction */}
+        <div className="bg-[#0f2137]/60 backdrop-blur-md rounded-xl p-6 border border-gray-700/50 mb-8">
+          <h3 className="text-lg font-semibold text-white mb-4">关于这本书</h3>
+          <div className="space-y-4 text-gray-300 leading-relaxed">
+            <p>"这不是一本教你成功的鸡汤书。"</p>
+            <p>
+              这是我每天早上6点到9点,在Soul派对房和几百个陌生人分享的真实故事。 有人来找项目,有人来找钱,有人来找方向。
+            </p>
+            <p>
+              我见过凌晨四点还在撸运费险的年轻人,见过七十岁还在开滴滴做生意的老人,
+              见过一个月赚七八块却拼命倒卖游戏金币的大学生。
+            </p>
+            <p className="text-[#38bdac] font-semibold">"社会不是靠努力,是靠洞察与选择。"</p>
+            <p>
+              这本书,就是把那些在派对房里讲过的、能让人清醒的故事,整理成文字。每个案例都真实发生过,每个教训都是用钱换来的。
+            </p>
+          </div>
+        </div>
+
+        {/* Timeline */}
+        <div className="bg-[#0f2137]/60 backdrop-blur-md rounded-xl p-6 border border-gray-700/50 mb-8">
+          <h3 className="text-lg font-semibold text-white mb-6">创业历程</h3>
+          <div className="space-y-4">
+            {milestones.map((item, index) => (
+              <div key={index} className="flex gap-4">
+                <div className="flex flex-col items-center">
+                  <div className="w-3 h-3 rounded-full bg-[#38bdac]" />
+                  {index < milestones.length - 1 && <div className="w-0.5 h-full bg-gray-700 mt-1" />}
+                </div>
+                <div className="pb-4">
+                  <p className="text-[#38bdac] font-semibold">{item.year}</p>
+                  <p className="text-gray-300">{item.event}</p>
+                </div>
+              </div>
+            ))}
+          </div>
+        </div>
+
+        {/* CTA */}
+        <div className="bg-gradient-to-r from-[#38bdac]/10 to-[#1a3a4a]/50 rounded-2xl p-6 border border-[#38bdac]/30 text-center">
+          <h3 className="text-xl font-semibold text-white mb-2">想听更多真实故事?</h3>
+          <p className="text-gray-400 mb-6">每天早上6-9点,卡若在Soul派对房免费分享</p>
+          <div className="flex flex-col sm:flex-row gap-4 justify-center">
+            <Button onClick={() => setShowQRModal(true)} className="bg-[#38bdac] hover:bg-[#2da396] text-white">
+              <MessageCircle className="w-4 h-4 mr-2" />
+              加入派对群
+            </Button>
+            <Link href="/chapters">
+              <Button variant="outline" className="border-gray-600 text-white hover:bg-gray-700/50 bg-transparent">
+                <BookOpen className="w-4 h-4 mr-2" />
+                开始阅读
+              </Button>
+            </Link>
+          </div>
+        </div>
+      </main>
+
+      <QRCodeModal isOpen={showQRModal} onClose={() => setShowQRModal(false)} />
+    </div>
+  )
+}