fnvtk/soul
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: Implement iOS-style UI, payment, referral, and reading experience improvements

Browse Source
This commit is contained in:
卡若
2026-01-09 12:24:15 +08:00
parent d781dc07ed
commit 326c9e6905
12 changed files with 1173 additions and 478 deletions
Download Patch File Download Diff File Expand all files Collapse all files

59
components/book-intro.tsx
View File

@@ -1,30 +1,51 @@
export function BookIntro() {
return (
<section className="py-16 px-4">
<section className="py-12 px-4">
<div className="max-w-2xl mx-auto">
{/* Glass card */}
<div className="bg-[#0f2137]/80 backdrop-blur-xl rounded-2xl p-8 border border-[#38bdac]/20">
{/* Quote */}
<blockquote className="text-lg md:text-xl text-gray-200 leading-relaxed mb-6">
"这不是一本教你成功的鸡汤书。这是我每天早上6点到9点，在Soul派对房和几百个陌生人分享的真实故事。"
{/* 毛玻璃卡片 */}
<div className="glass-card-heavy p-6 sm:p-8">
{/* 引用图标 */}
<div className="w-10 h-10 rounded-xl bg-[var(--app-brand-light)] flex items-center justify-center mb-6">
<svg className="w-5 h-5 text-[var(--app-brand)]" fill="currentColor" viewBox="0 0 24 24">
<path d="M14.017 21v-7.391c0-5.704 3.731-9.57 8.983-10.609l.995 2.151c-2.432.917-3.995 3.638-3.995 5.849h4v10h-9.983zm-14.017 0v-7.391c0-5.704 3.748-9.57 9-10.609l.996 2.151c-2.433.917-3.996 3.638-3.996 5.849h3.983v10h-9.983z"/>
</svg>
</div>
{/* 引用内容 */}
<blockquote className="text-lg sm:text-xl text-white leading-relaxed mb-6 font-light">
这不是一本教你成功的鸡汤书。
<span className="text-[var(--app-text-secondary)]">
这是我每天早上6点到9点，在Soul派对房和几百个陌生人分享的真实故事。
</span>
</blockquote>
{/* Author */}
<p className="text-[#38bdac] text-lg">— 卡若</p>
{/* 作者签名 */}
<div className="flex items-center gap-3 mb-8">
<div className="w-10 h-10 rounded-full bg-gradient-to-br from-[var(--app-brand)] to-[var(--ios-teal)] flex items-center justify-center text-white font-semibold text-sm">
卡
</div>
<div>
<p className="text-[var(--app-brand)] font-semibold">卡若</p>
<p className="text-[var(--app-text-tertiary)] text-xs">Soul派对房主理人</p>
</div>
</div>
{/* Stats */}
<div className="mt-8 pt-6 border-t border-gray-700/50 grid grid-cols-3 gap-4 text-center">
<div>
<p className="text-2xl md:text-3xl font-bold text-white">55+</p>
<p className="text-gray-400 text-sm">真实案例</p>
{/* 分隔线 */}
<div className="separator-ios mx-0 mb-6" />
{/* 统计数据 */}
<div className="grid grid-cols-3 gap-4 text-center">
<div className="p-3">
<p className="text-2xl sm:text-3xl font-bold text-white mb-1">55+</p>
<p className="text-[var(--app-text-tertiary)] text-xs">真实案例</p>
</div>
<div>
<p className="text-2xl md:text-3xl font-bold text-white">11</p>
<p className="text-gray-400 text-sm">核心章节</p>
<div className="p-3 border-x border-[var(--app-separator)]">
<p className="text-2xl sm:text-3xl font-bold text-white mb-1">11</p>
<p className="text-[var(--app-text-tertiary)] text-xs">核心章节</p>
</div>
<div>
<p className="text-2xl md:text-3xl font-bold text-white">100+</p>
<p className="text-gray-400 text-sm">商业洞察</p>
<div className="p-3">
<p className="text-2xl sm:text-3xl font-bold text-white mb-1">100+</p>
<p className="text-[var(--app-text-tertiary)] text-xs">商业洞察</p>
</div>
</div>
</div>