Skip to content

Commit e11b2f9

Browse files
committed
添加测试分支触发
1 parent 837e684 commit e11b2f9

83 files changed

Lines changed: 6711 additions & 246 deletions

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

.github/workflows/ci.yml

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,7 @@ on:
1313
push:
1414
branches:
1515
- master
16+
- web-refactor
1617

1718
jobs:
1819
build-and-deploy:

example/web/src.zip

196 KB
Binary file not shown.

example/web/src/app/App.tsx

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
import { RouterProvider } from 'react-router';
2+
import { router } from './routes';
3+
4+
export default function App() {
5+
return <RouterProvider router={router} />;
6+
}
Lines changed: 40 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,40 @@
1+
import { ImageWithFallback } from './figma/ImageWithFallback';
2+
import { Calendar } from 'lucide-react';
3+
4+
interface BlogCardProps {
5+
title: string;
6+
excerpt: string;
7+
imageUrl: string;
8+
category: string;
9+
date: string;
10+
readTime: string;
11+
}
12+
13+
export function BlogCard({ title, excerpt, imageUrl, category, date, readTime }: BlogCardProps) {
14+
return (
15+
<article className="group cursor-pointer">
16+
<div className="relative aspect-[4/3] rounded-xl overflow-hidden mb-4 bg-gray-100">
17+
<ImageWithFallback
18+
src={imageUrl}
19+
alt={title}
20+
className="w-full h-full object-cover transition-transform duration-500 group-hover:scale-105"
21+
/>
22+
</div>
23+
<div className="flex items-center gap-2 mb-3">
24+
<span className="text-xs tracking-wide text-gray-500 uppercase">{category}</span>
25+
<span className="text-xs text-gray-400"></span>
26+
<span className="text-xs text-gray-500">{readTime}</span>
27+
</div>
28+
<h3 className="text-xl tracking-tight mb-2 group-hover:text-gray-600 transition-colors">
29+
{title}
30+
</h3>
31+
<p className="text-sm text-gray-600 leading-relaxed mb-3 line-clamp-2">
32+
{excerpt}
33+
</p>
34+
<div className="flex items-center gap-2 text-xs text-gray-500">
35+
<Calendar className="w-3 h-3" />
36+
<span>{date}</span>
37+
</div>
38+
</article>
39+
);
40+
}
Lines changed: 39 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,39 @@
1+
import { ImageWithFallback } from './figma/ImageWithFallback';
2+
import { ArrowRight } from 'lucide-react';
3+
4+
interface FeaturedPostProps {
5+
title: string;
6+
excerpt: string;
7+
imageUrl: string;
8+
category: string;
9+
readTime: string;
10+
}
11+
12+
export function FeaturedPost({ title, excerpt, imageUrl, category, readTime }: FeaturedPostProps) {
13+
return (
14+
<article className="group cursor-pointer">
15+
<div className="relative aspect-[16/9] rounded-2xl overflow-hidden mb-6 bg-gray-100">
16+
<ImageWithFallback
17+
src={imageUrl}
18+
alt={title}
19+
className="w-full h-full object-cover transition-transform duration-700 group-hover:scale-105"
20+
/>
21+
</div>
22+
<div className="flex items-center gap-3 mb-4">
23+
<span className="text-xs tracking-wide text-gray-500 uppercase">{category}</span>
24+
<span className="text-xs text-gray-400"></span>
25+
<span className="text-xs text-gray-500">{readTime}</span>
26+
</div>
27+
<h3 className="text-3xl md:text-4xl tracking-tight mb-4 group-hover:text-gray-600 transition-colors">
28+
{title}
29+
</h3>
30+
<p className="text-gray-600 leading-relaxed mb-6">
31+
{excerpt}
32+
</p>
33+
<div className="flex items-center gap-2 text-sm group-hover:gap-3 transition-all">
34+
<span>阅读更多</span>
35+
<ArrowRight className="w-4 h-4" />
36+
</div>
37+
</article>
38+
);
39+
}
Lines changed: 45 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,45 @@
1+
import { Github, Twitter, Linkedin, Mail } from 'lucide-react';
2+
3+
export function Footer() {
4+
return (
5+
<footer className="border-t border-gray-200 py-12 px-6">
6+
<div className="max-w-7xl mx-auto">
7+
<div className="flex flex-col md:flex-row justify-between items-center gap-6">
8+
<div className="text-sm text-gray-600">
9+
© 2026 张伟的博客. 保留所有权利.
10+
</div>
11+
<div className="flex items-center gap-6">
12+
<a
13+
href="#"
14+
className="text-gray-600 hover:text-gray-900 transition-colors"
15+
aria-label="Github"
16+
>
17+
<Github className="w-5 h-5" />
18+
</a>
19+
<a
20+
href="#"
21+
className="text-gray-600 hover:text-gray-900 transition-colors"
22+
aria-label="Twitter"
23+
>
24+
<Twitter className="w-5 h-5" />
25+
</a>
26+
<a
27+
href="#"
28+
className="text-gray-600 hover:text-gray-900 transition-colors"
29+
aria-label="LinkedIn"
30+
>
31+
<Linkedin className="w-5 h-5" />
32+
</a>
33+
<a
34+
href="#"
35+
className="text-gray-600 hover:text-gray-900 transition-colors"
36+
aria-label="Email"
37+
>
38+
<Mail className="w-5 h-5" />
39+
</a>
40+
</div>
41+
</div>
42+
</div>
43+
</footer>
44+
);
45+
}
Lines changed: 70 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,70 @@
1+
import { Menu, X, Search } from 'lucide-react';
2+
import { useState } from 'react';
3+
4+
export function Header() {
5+
const [isMenuOpen, setIsMenuOpen] = useState(false);
6+
7+
return (
8+
<header className="fixed top-0 left-0 right-0 z-50 bg-white/80 backdrop-blur-xl border-b border-gray-200/50">
9+
<nav className="max-w-7xl mx-auto px-6 py-4">
10+
<div className="flex items-center justify-between">
11+
{/* Logo */}
12+
<div className="flex items-center">
13+
<h1 className="text-xl tracking-tight">张伟的博客</h1>
14+
</div>
15+
16+
{/* Desktop Navigation */}
17+
<div className="hidden md:flex items-center gap-8">
18+
<a href="#" className="text-sm text-gray-600 hover:text-gray-900 transition-colors">
19+
首页
20+
</a>
21+
<a href="#" className="text-sm text-gray-600 hover:text-gray-900 transition-colors">
22+
文章
23+
</a>
24+
<a href="#" className="text-sm text-gray-600 hover:text-gray-900 transition-colors">
25+
关于
26+
</a>
27+
<a href="#" className="text-sm text-gray-600 hover:text-gray-900 transition-colors">
28+
联系
29+
</a>
30+
<button className="p-2 hover:bg-gray-100 rounded-full transition-colors">
31+
<Search className="w-4 h-4 text-gray-600" />
32+
</button>
33+
</div>
34+
35+
{/* Mobile Menu Button */}
36+
<button
37+
onClick={() => setIsMenuOpen(!isMenuOpen)}
38+
className="md:hidden p-2 hover:bg-gray-100 rounded-full transition-colors"
39+
>
40+
{isMenuOpen ? (
41+
<X className="w-5 h-5 text-gray-600" />
42+
) : (
43+
<Menu className="w-5 h-5 text-gray-600" />
44+
)}
45+
</button>
46+
</div>
47+
48+
{/* Mobile Menu */}
49+
{isMenuOpen && (
50+
<div className="md:hidden mt-4 pt-4 border-t border-gray-200">
51+
<div className="flex flex-col gap-4">
52+
<a href="#" className="text-sm text-gray-600 hover:text-gray-900 transition-colors">
53+
首页
54+
</a>
55+
<a href="#" className="text-sm text-gray-600 hover:text-gray-900 transition-colors">
56+
文章
57+
</a>
58+
<a href="#" className="text-sm text-gray-600 hover:text-gray-900 transition-colors">
59+
关于
60+
</a>
61+
<a href="#" className="text-sm text-gray-600 hover:text-gray-900 transition-colors">
62+
联系
63+
</a>
64+
</div>
65+
</div>
66+
)}
67+
</nav>
68+
</header>
69+
);
70+
}
Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
export function Hero() {
2+
return (
3+
<section className="pt-32 pb-20 px-6">
4+
<div className="max-w-4xl mx-auto text-center">
5+
<h2 className="text-5xl md:text-7xl tracking-tight mb-6">
6+
思考,创造,分享
7+
</h2>
8+
<p className="text-xl text-gray-600 max-w-2xl mx-auto leading-relaxed">
9+
探索设计、技术和生活的交汇点。记录想法,分享经验,与世界对话。
10+
</p>
11+
</div>
12+
</section>
13+
);
14+
}
Lines changed: 44 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,44 @@
1+
import { Link, useLocation } from "react-router";
2+
import { motion } from "motion/react";
3+
4+
export function Navigation() {
5+
const location = useLocation();
6+
7+
const links = [
8+
{ path: "/", label: "首页" },
9+
{ path: "/blog", label: "博客" },
10+
{ path: "/about", label: "关于" },
11+
];
12+
13+
return (
14+
<nav className="fixed top-0 left-0 right-0 z-50 bg-white/80 backdrop-blur-md border-b border-gray-200">
15+
<div className="max-w-6xl mx-auto px-6 py-4 flex items-center justify-between">
16+
<Link
17+
to="/"
18+
className="text-xl font-medium tracking-tight text-gray-900"
19+
>
20+
思考空间
21+
</Link>
22+
23+
<div className="flex gap-8">
24+
{links.map((link) => (
25+
<Link
26+
key={link.path}
27+
to={link.path}
28+
className="relative text-sm font-light tracking-wide text-gray-600 hover:text-gray-900 transition-colors"
29+
>
30+
{link.label}
31+
{location.pathname === link.path && (
32+
<motion.div
33+
layoutId="nav-indicator"
34+
className="absolute -bottom-[17px] left-0 right-0 h-px bg-gray-900"
35+
transition={{ type: "spring", stiffness: 380, damping: 30 }}
36+
/>
37+
)}
38+
</Link>
39+
))}
40+
</div>
41+
</div>
42+
</nav>
43+
);
44+
}
Lines changed: 34 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
import { Mail } from 'lucide-react';
2+
3+
export function Newsletter() {
4+
return (
5+
<section className="py-20 px-6">
6+
<div className="max-w-4xl mx-auto">
7+
<div className="bg-gray-50 rounded-3xl p-12 md:p-16 text-center">
8+
<div className="w-12 h-12 bg-gray-900 rounded-full flex items-center justify-center mx-auto mb-6">
9+
<Mail className="w-5 h-5 text-white" />
10+
</div>
11+
<h3 className="text-3xl md:text-4xl tracking-tight mb-4">
12+
订阅我的博客
13+
</h3>
14+
<p className="text-gray-600 mb-8 max-w-md mx-auto">
15+
获取最新文章和想法,直接发送到您的邮箱。每周精选,无垃圾邮件。
16+
</p>
17+
<form className="max-w-md mx-auto flex gap-3">
18+
<input
19+
type="email"
20+
placeholder="输入您的邮箱"
21+
className="flex-1 px-4 py-3 rounded-full border border-gray-300 focus:outline-none focus:ring-2 focus:ring-gray-900 focus:border-transparent text-sm"
22+
/>
23+
<button
24+
type="submit"
25+
className="px-6 py-3 bg-gray-900 text-white rounded-full hover:bg-gray-800 transition-colors text-sm whitespace-nowrap"
26+
>
27+
订阅
28+
</button>
29+
</form>
30+
</div>
31+
</div>
32+
</section>
33+
);
34+
}

0 commit comments

Comments
 (0)