web-projects/src/pages/download.astro
WangDL 7590daebc0 feat: 全面优化 UI 样式、动画系统与交互体验
- 新增加载进度条(BaseLayout)

- 重构动画系统:修复 fadeInUp、新增 revealUp/pageEnter/blurIn 入场动画

- 添加 IntersectionObserver 滚动揭示机制

- 产品页:修复弹幕滚动效果、统一 Hero 区域样式与首页一致

- 产品理念页:重新设计对比叙事区、学习闭环图、产品原则卡片

- 支持页:完全重构表单布局、设备 pills 选中态、FAQ 双列网格

- 隐私政策页:重构侧边栏导航

- 首页:统一 Portal 三卡片边框、重构 Learning Loop 流程图

- Footer 去除冗余 margin-top、全局 CSS 新增 ethereal-glow 公共样式
2026-05-07 23:15:35 +08:00

92 lines
2.3 KiB
Plaintext

---
import BaseLayout from '../layouts/BaseLayout.astro';
import Header from '../components/Header.astro';
import Footer from '../components/Footer.astro';
import Hero from '../components/Hero.astro';
import CTA from '../components/CTA.astro';
---
<BaseLayout
title="下载 - 龙德AI学习"
description="龙德AI学习 Mac 版下载,敬请期待。"
>
<Header />
<main class="animate-page-enter">
<Hero
title="Mac 应用"
subtitle="龙德AI学习 Mac 版正在开发中"
/>
<section class="download-section">
<div class="download-card">
<div class="icon">
<svg width="64" height="64" viewBox="0 0 64 64" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect x="8" y="8" width="48" height="48" rx="8" stroke="currentColor" stroke-width="2"/>
<path d="M24 28c0-4.418 3.582-8 8-8s8 3.582 8 8" stroke="currentColor" stroke-width="2" stroke-linecap="round"/>
<circle cx="32" cy="38" r="4" fill="currentColor"/>
</svg>
</div>
<h2>即将上线</h2>
<p>Mac 版应用正在积极开发中,请先加入等待名单获取最新消息。</p>
<div class="version-info">
<span>支持 macOS 12+</span>
</div>
<CTA
title="加入等待名单"
href="/waitlist"
variant="primary"
/>
</div>
</section>
</main>
<Footer />
</BaseLayout>
<style>
.download-section {
padding: 0 var(--page-padding) 4rem;
}
.download-card {
max-width: 400px;
margin: 0 auto;
padding: 3rem 2rem;
background: var(--color-bg-secondary);
border-radius: 16px;
text-align: center;
}
.icon {
color: var(--color-text-secondary);
margin-bottom: 1.5rem;
}
.download-card h2 {
font-size: 1.5rem;
font-weight: 600;
color: var(--color-text);
margin-bottom: 0.75rem;
}
.download-card p {
font-size: 0.9375rem;
color: var(--color-text-secondary);
line-height: 1.6;
margin-bottom: 1.5rem;
}
.version-info {
display: flex;
justify-content: center;
gap: 1rem;
margin-bottom: 2rem;
}
.version-info span {
font-size: 0.8125rem;
color: var(--color-text-secondary);
padding: 0.375rem 0.875rem;
background: var(--color-bg);
border-radius: 4px;
}
</style>