Skip to content

Commit e378bb5

Browse files
ExquisiteCoreExquisiteCore
committed
refactor: 更新首页布局和页脚链接
重构首页布局，简化内容并更新页脚链接的URL。首页标题从“精致的芯”改为“ExquisiteCore”，并调整了布局和样式，使其更简洁和现代化。页脚中的Bilibili链接也更新为新的URL。
1 parent b769ffe commit e378bb5

2 files changed

Lines changed: 61 additions & 114 deletions

File tree

‎blog-web/src/components/Footer.astro‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@ const currentYear = new Date().getFullYear();
1414
<h6 class="footer-title">相关链接</h6>
1515
<div class="flex flex-col gap-2">
1616
<a
17-
href="https://www.bilibili.com/453875890"
17+
href="https://space.bilibili.com/453875890"
1818
class="link link-hover flex items-center gap-2"
1919
>
2020
<svg

‎blog-web/src/pages/index.astro‎

Lines changed: 60 additions & 113 deletions
Original file line numberDiff line numberDiff line change
@@ -2,124 +2,71 @@
22
import Layout from "../layouts/Layout.astro";
33
---
44

5-
<Layout title="精致的芯 - 精致的私人博客">
5+
<Layout title="ExquisiteCore - 个人博客">
66
<!-- Hero Section -->
7-
<section class="hero min-h-[60vh] bg-base-200 rounded-box my-8">
8-
<div class="hero-content text-center">
9-
<div class="max-w-md">
10-
<h1 class="text-5xl font-bold">精致的芯</h1>
11-
<p class="py-6">
12-
欢迎来到精致的私人博客，这里记录了我的技术探索、生活感悟和创意思考。
7+
<section
8+
class="hero min-h-[85vh] flex items-center justify-center py-4 px-6"
9+
>
10+
<div class="hero-content text-left max-w-3xl">
11+
<div>
12+
<h1 class="text-6xl font-bold mb-4">
13+
你好，<br />我是 ExquisiteCore。
14+
</h1>
15+
<p class="text-xl py-6 opacity-80">
16+
前端开发者 / 业余设计师。<br />
17+
目前在滴滴工作。<br />
18+
我喜欢做有趣的项目。
1319
</p>
14-
<button class="btn btn-primary">开始浏览</button>
15-
</div>
16-
</div>
17-
</section>
18-
19-
<!-- Featured Posts -->
20-
<section class="my-12">
21-
<h2 class="text-3xl font-bold mb-8 text-center">精选文章</h2>
22-
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
23-
<!-- Card 1 -->
24-
<div class="card bg-base-100 shadow-xl">
25-
<figure>
26-
<img
27-
src="https://picsum.photos/400/250"
28-
alt="Blog Post Image"
29-
/>
30-
</figure>
31-
<div class="card-body">
32-
<h3 class="card-title">
33-
Astro开发入门
34-
<div class="badge badge-secondary">最新</div>
35-
</h3>
36-
<p>
37-
学习如何使用Astro构建高性能网站，并结合SolidJS打造交互式组件。
38-
</p>
39-
<div class="card-actions justify-end">
40-
<div class="badge badge-outline">Astro</div>
41-
<div class="badge badge-outline">SolidJS</div>
42-
</div>
43-
<div class="mt-4">
44-
<button class="btn btn-primary btn-sm">阅读更多</button
20+
<div class="flex flex-wrap gap-3 mt-6">
21+
<a
22+
href="https://github.com/ExquisiteCore"
23+
class="btn btn-outline"
24+
target="_blank"
25+
rel="noopener noreferrer"
26+
>
27+
<svg
28+
xmlns="http://www.w3.org/2000/svg"
29+
viewBox="0 0 24 24"
30+
fill="currentColor"
31+
class="w-5 h-5"
4532
>
46-
</div>
47-
</div>
48-
</div>
49-
50-
<!-- Card 2 -->
51-
<div class="card bg-base-100 shadow-xl">
52-
<figure>
53-
<img
54-
src="https://picsum.photos/400/251"
55-
alt="Blog Post Image"
56-
/>
57-
</figure>
58-
<div class="card-body">
59-
<h3 class="card-title">DaisyUI的强大功能</h3>
60-
<p>
61-
探索这个强大的组件库，它让使用Tailwind CSS构建美观界面变得轻而易举。
62-
</p>
63-
<div class="card-actions justify-end">
64-
<div class="badge badge-outline">Tailwind</div>
65-
<div class="badge badge-outline">DaisyUI</div>
66-
</div>
67-
<div class="mt-4">
68-
<button class="btn btn-primary btn-sm">Read More</button
69-
>
70-
</div>
71-
</div>
72-
</div>
73-
74-
<!-- Card 3 -->
75-
<div class="card bg-base-100 shadow-xl">
76-
<figure>
77-
<img
78-
src="https://picsum.photos/400/252"
79-
alt="Blog Post Image"
80-
/>
81-
</figure>
82-
<div class="card-body">
83-
<h3 class="card-title">响应式设计技巧</h3>
84-
<p>
85-
学习创建适应各种设备尺寸的响应式布局的最佳实践和技巧。
86-
</p>
87-
<div class="card-actions justify-end">
88-
<div class="badge badge-outline">CSS</div>
89-
<div class="badge badge-outline">Design</div>
90-
</div>
91-
<div class="mt-4">
92-
<button class="btn btn-primary btn-sm">Read More</button
33+
<path
34+
d="M12 0c-6.626 0-12 5.373-12 12 0 5.302 3.438 9.8 8.207 11.387.599.111.793-.261.793-.577v-2.234c-3.338.726-4.033-1.416-4.033-1.416-.546-1.387-1.333-1.756-1.333-1.756-1.089-.745.083-.729.083-.729 1.205.084 1.839 1.237 1.839 1.237 1.07 1.834 2.807 1.304 3.492.997.107-.775.418-1.305.762-1.604-2.665-.305-5.467-1.334-5.467-5.931 0-1.311.469-2.381 1.236-3.221-.124-.303-.535-1.524.117-3.176 0 0 1.008-.322 3.301 1.23.957-.266 1.983-.399 3.003-.404 1.02.005 2.047.138 3.006.404 2.291-1.552 3.297-1.23 3.297-1.23.653 1.653.242 2.874.118 3.176.77.84 1.235 1.911 1.235 3.221 0 4.609-2.807 5.624-5.479 5.921.43.372.823 1.102.823 2.222v3.293c0 .319.192.694.801.576 4.765-1.589 8.199-6.086 8.199-11.386 0-6.627-5.373-12-12-12z"
35+
></path>
36+
</svg>
37+
<span>Github</span>
38+
</a>
39+
<a
40+
href="https://space.bilibili.com/453875890"
41+
class="btn btn-outline"
42+
target="_blank"
43+
rel="noopener noreferrer"
44+
>
45+
<svg
46+
xmlns="http://www.w3.org/2000/svg"
47+
viewBox="0 0 24 24"
48+
fill="currentColor"
49+
class="w-5 h-5"
9350
>
94-
</div>
95-
</div>
96-
</div>
97-
</div>
98-
</section>
99-
100-
<!-- Newsletter Section -->
101-
<section class="my-16 card bg-base-200 p-8">
102-
<div class="flex flex-col md:flex-row items-center gap-6">
103-
<div class="flex-1">
104-
<h2 class="text-2xl font-bold mb-2">
105-
订阅我的新文章提醒
106-
</h2>
107-
<p>
108-
订阅我的博客更新，第一时间获取最新文章和动态。
109-
</p>
110-
</div>
111-
<div class="flex-1">
112-
<div class="form-control">
113-
<div class="join">
114-
<input
115-
type="text"
116-
placeholder="输入您的邮箱"
117-
class="input input-bordered join-item"
118-
/>
119-
<button class="btn btn-primary join-item"
120-
>订阅</button
51+
<path
52+
d="M17.813 4.653h.854c1.51.054 2.769.578 3.773 1.574 1.004.995 1.524 2.249 1.56 3.76v7.36c-.036 1.51-.556 2.769-1.56 3.773s-2.262 1.524-3.773 1.56H5.333c-1.51-.036-2.769-.556-3.773-1.56S.036 18.858 0 17.347v-7.36c.036-1.511.556-2.765 1.56-3.76 1.004-.996 2.262-1.52 3.773-1.574h.774l-1.174-1.12a1.234 1.234 0 0 1-.373-.906c0-.356.124-.658.373-.907l.027-.027c.267-.249.573-.373.92-.373.347 0 .653.124.92.373L9.653 4.44c.071.071.134.142.187.213h4.267a.836.836 0 0 1 .16-.213l2.853-2.747c.267-.249.573-.373.92-.373.347 0 .662.151.929.4.267.249.391.551.391.907 0 .355-.124.657-.373.906L17.813 4.653zM5.333 7.24c-.746.018-1.373.276-1.88.773-.506.498-.769 1.13-.786 1.894v7.52c.017.764.28 1.395.786 1.893.507.498 1.134.756 1.88.773h13.334c.746-.017 1.373-.275 1.88-.773.506-.498.769-1.129.786-1.893v-7.52c-.017-.765-.28-1.396-.786-1.894-.507-.497-1.134-.755-1.88-.773H5.333zM8 11.107c.373 0 .684.124.933.373.25.249.383.569.4.96v1.173c-.017.391-.15.711-.4.96-.249.25-.56.374-.933.374s-.684-.125-.933-.374c-.25-.249-.383-.569-.4-.96V12.44c.017-.391.15-.711.4-.96.249-.249.56-.373.933-.373zm8 0c.373 0 .684.124.933.373.25.249.383.569.4.96v1.173c-.017.391-.15.711-.4.96-.249.25-.56.374-.933.374s-.684-.125-.933-.374c-.25-.249-.383-.569-.4-.96V12.44c.017-.391.15-.711.4-.96.249-.249.56-.373.933-.373z"
53+
></path>
54+
</svg>
55+
<span>哔哩哔哩</span>
56+
</a>
57+
<a href="/blog" class="btn btn-outline">
58+
<svg
59+
xmlns="http://www.w3.org/2000/svg"
60+
viewBox="0 0 24 24"
61+
fill="currentColor"
62+
class="w-5 h-5"
12163
>
122-
</div>
64+
<path
65+
d="M19.498 3h-15c-1.381 0-2.5 1.12-2.5 2.5v13c0 1.38 1.119 2.5 2.5 2.5h15c1.381 0 2.5-1.12 2.5-2.5v-13c0-1.38-1.119-2.5-2.5-2.5zm-3.502 12h-2v-1h2v1zm0-3h-2v-1h2v1zm-8.996 3h-2v-7h2v7zm2.996-3h-2v-1h2v1zm0 3h-2v-1h2v1zm4-3h-2v-1h2v1zm4-3h-10v-1h10v1z"
66+
></path>
67+
</svg>
68+
<span>博客</span>
69+
</a>
12370
</div>
12471
</div>
12572
</div>

0 commit comments

Comments
 (0)