Skip to content

Commit fdbdea6

Browse files
ExquisiteCoreExquisiteCore
committed
refactor(页面布局): 移除博客和项目页面的冗余内容
简化页面布局，移除不必要的分类、搜索和项目列表等内容，使页面更加简洁
1 parent e378bb5 commit fdbdea6

2 files changed

Lines changed: 2 additions & 343 deletions

File tree

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

Lines changed: 1 addition & 172 deletions
Original file line numberDiff line numberDiff line change
@@ -3,179 +3,8 @@ import Layout from "../layouts/Layout.astro";
33
---
44

55
<Layout title="博客 | 精致的芯 - 精致的私人博客">
6-
<div class="text-center my-8">
6+
<div class="text-left my-8">
77
<h1 class="text-4xl font-bold">博客文章</h1>
88
<p class="mt-2 text-lg">探索我的最新文章和想法</p>
99
</div>
10-
11-
<!-- Categories -->
12-
<div class="flex flex-wrap justify-center gap-2 my-6">
13-
<button class="btn btn-sm btn-primary">全部</button>
14-
<button class="btn btn-sm btn-outline">技术</button>
15-
<button class="btn btn-sm btn-outline">设计</button>
16-
<button class="btn btn-sm btn-outline">教程</button>
17-
<button class="btn btn-sm btn-outline">资讯</button>
18-
</div>
19-
20-
<!-- Search -->
21-
<div class="form-control my-6 max-w-md mx-auto">
22-
<div class="join w-full">
23-
<input
24-
type="text"
25-
placeholder="搜索文章..."
26-
class="input input-bordered join-item w-full"
27-
/>
28-
<button class="btn btn-primary join-item">
29-
<svg
30-
xmlns="http://www.w3.org/2000/svg"
31-
class="h-5 w-5"
32-
fill="none"
33-
viewBox="0 0 24 24"
34-
stroke="currentColor"
35-
>
36-
<path
37-
stroke-linecap="round"
38-
stroke-linejoin="round"
39-
stroke-width="2"
40-
d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z"></path>
41-
</svg>
42-
</button>
43-
</div>
44-
</div>
45-
46-
<!-- Blog Posts -->
47-
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6 my-8">
48-
<!-- Post 1 -->
49-
<div class="card bg-base-100 shadow-xl">
50-
<figure>
51-
<img src="https://picsum.photos/400/250" alt="博客文章图片" />
52-
</figure>
53-
<div class="card-body">
54-
<h3 class="card-title">
55-
Astro开发入门
56-
<div class="badge badge-secondary">最新</div>
57-
</h3>
58-
<p>
59-
学习如何使用Astro构建高性能网站，并结合SolidJS打造交互式组件。
60-
</p>
61-
<div class="card-actions justify-end">
62-
<div class="badge badge-outline">Astro</div>
63-
<div class="badge badge-outline">SolidJS</div>
64-
</div>
65-
<div class="mt-4">
66-
<button class="btn btn-primary btn-sm">阅读更多</button>
67-
</div>
68-
</div>
69-
</div>
70-
71-
<!-- Post 2 -->
72-
<div class="card bg-base-100 shadow-xl">
73-
<figure>
74-
<img src="https://picsum.photos/400/251" alt="博客文章图片" />
75-
</figure>
76-
<div class="card-body">
77-
<h3 class="card-title">DaisyUI的强大功能</h3>
78-
<p>
79-
探索这个强大的组件库，它让使用Tailwind
80-
CSS构建美观界面变得轻而易举。
81-
</p>
82-
<div class="card-actions justify-end">
83-
<div class="badge badge-outline">Tailwind</div>
84-
<div class="badge badge-outline">DaisyUI</div>
85-
</div>
86-
<div class="mt-4">
87-
<button class="btn btn-primary btn-sm">阅读更多</button>
88-
</div>
89-
</div>
90-
</div>
91-
92-
<!-- Post 3 -->
93-
<div class="card bg-base-100 shadow-xl">
94-
<figure>
95-
<img src="https://picsum.photos/400/252" alt="博客文章图片" />
96-
</figure>
97-
<div class="card-body">
98-
<h3 class="card-title">响应式设计技巧</h3>
99-
<p>学习创建适应各种设备尺寸的响应式布局的最佳实践和技巧。</p>
100-
<div class="card-actions justify-end">
101-
<div class="badge badge-outline">CSS</div>
102-
<div class="badge badge-outline">Design</div>
103-
</div>
104-
<div class="mt-4">
105-
<button class="btn btn-primary btn-sm">阅读更多</button>
106-
</div>
107-
</div>
108-
</div>
109-
110-
<!-- Post 4 -->
111-
<div class="card bg-base-100 shadow-xl">
112-
<figure>
113-
<img src="https://picsum.photos/400/253" alt="博客文章图片" />
114-
</figure>
115-
<div class="card-body">
116-
<h3 class="card-title">网站性能优化</h3>
117-
<p>使用这些技术为您的网站提升性能和用户体验。</p>
118-
<div class="card-actions justify-end">
119-
<div class="badge badge-outline">性能</div>
120-
<div class="badge badge-outline">Web</div>
121-
</div>
122-
<div class="mt-4">
123-
<button class="btn btn-primary btn-sm">阅读更多</button>
124-
</div>
125-
</div>
126-
</div>
127-
128-
<!-- Post 5 -->
129-
<div class="card bg-base-100 shadow-xl">
130-
<figure>
131-
<img src="https://picsum.photos/400/254" alt="博客文章图片" />
132-
</figure>
133-
<div class="card-body">
134-
<h3 class="card-title">无障碍设计最佳实践</h3>
135-
<p>使用这些必备技术和工具，让您的网站对每个人都可访问。</p>
136-
<div class="card-actions justify-end">
137-
<div class="badge badge-outline">A11y</div>
138-
<div class="badge badge-outline">UX</div>
139-
</div>
140-
<div class="mt-4">
141-
<button class="btn btn-primary btn-sm">阅读更多</button>
142-
</div>
143-
</div>
144-
</div>
145-
146-
<!-- Post 6 -->
147-
<div class="card bg-base-100 shadow-xl">
148-
<figure>
149-
<img
150-
src="https://picsum.photos/400/255"
151-
alt="博客文章图片"
152-
/>
153-
</figure>
154-
<div class="card-body">
155-
<h3 class="card-title">现代JavaScript特性</h3>
156-
<p>
157-
探索最新的JavaScript特性，提升您的代码质量和开发效率。
158-
</p>
159-
<div class="card-actions justify-end">
160-
<div class="badge badge-outline">JavaScript</div>
161-
<div class="badge badge-outline">ES6+</div>
162-
</div>
163-
<div class="mt-4">
164-
<button class="btn btn-primary btn-sm">阅读更多</button>
165-
</div>
166-
</div>
167-
</div>
168-
</div>
169-
170-
<!-- Pagination -->
171-
<div class="flex justify-center my-8">
172-
<div class="join">
173-
<button class="join-item btn">«</button>
174-
<button class="join-item btn btn-active">1</button>
175-
<button class="join-item btn">2</button>
176-
<button class="join-item btn">3</button>
177-
<button class="join-item btn">4</button>
178-
<button class="join-item btn">»</button>
179-
</div>
180-
</div>
18110
</Layout>

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

Lines changed: 1 addition & 171 deletions
Original file line numberDiff line numberDiff line change
@@ -7,174 +7,4 @@ import Layout from "../layouts/Layout.astro";
77
<h1 class="text-4xl font-bold">我的项目</h1>
88
<p class="mt-2 text-lg">这里展示了我的一些个人项目和作品</p>
99
</div>
10-
11-
<!-- 项目分类 -->
12-
<div class="flex flex-wrap justify-center gap-2 my-6">
13-
<button class="btn btn-sm btn-primary">全部</button>
14-
<button class="btn btn-sm btn-outline">Web开发</button>
15-
<button class="btn btn-sm btn-outline">机器学习</button>
16-
<button class="btn btn-sm btn-outline">游戏开发</button>
17-
<button class="btn btn-sm btn-outline">小工具</button>
18-
</div>
19-
20-
<!-- 项目列表 -->
21-
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6 my-8">
22-
<!-- 项目 1 -->
23-
<div class="card bg-base-100 shadow-xl">
24-
<figure><img src="https://picsum.photos/400/225?random=1" alt="项目截图" /></figure>
25-
<div class="card-body">
26-
<h3 class="card-title">
27-
个人博客系统
28-
<div class="badge badge-secondary">最新</div>
29-
</h3>
30-
<p>基于Astro, SolidJS和DaisyUI开发的高性能静态博客系统，支持Markdown内容管理。</p>
31-
<div class="card-actions justify-end">
32-
<div class="badge badge-outline">Astro</div>
33-
<div class="badge badge-outline">SolidJS</div>
34-
<div class="badge badge-outline">DaisyUI</div>
35-
</div>
36-
<div class="mt-4 flex justify-between">
37-
<a href="https://github.com/LSTM-Kirigaya/blog" target="_blank" class="btn btn-outline btn-sm">
38-
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
39-
<path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8z"/>
40-
</svg>
41-
代码
42-
</a>
43-
<button class="btn btn-primary btn-sm">查看演示</button>
44-
</div>
45-
</div>
46-
</div>
47-
48-
<!-- 项目 2 -->
49-
<div class="card bg-base-100 shadow-xl">
50-
<figure><img src="https://picsum.photos/400/225?random=2" alt="项目截图" /></figure>
51-
<div class="card-body">
52-
<h3 class="card-title">智能图像识别</h3>
53-
<p>基于深度学习的图像识别系统，能够识别常见物体、场景和人物表情，准确率达95%以上。</p>
54-
<div class="card-actions justify-end">
55-
<div class="badge badge-outline">Python</div>
56-
<div class="badge badge-outline">TensorFlow</div>
57-
<div class="badge badge-outline">OpenCV</div>
58-
</div>
59-
<div class="mt-4 flex justify-between">
60-
<a href="https://github.com/LSTM-Kirigaya/image-recognition" target="_blank" class="btn btn-outline btn-sm">
61-
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
62-
<path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8z"/>
63-
</svg>
64-
代码
65-
</a>
66-
<button class="btn btn-primary btn-sm">查看演示</button>
67-
</div>
68-
</div>
69-
</div>
70-
71-
<!-- 项目 3 -->
72-
<div class="card bg-base-100 shadow-xl">
73-
<figure><img src="https://picsum.photos/400/225?random=3" alt="项目截图" /></figure>
74-
<div class="card-body">
75-
<h3 class="card-title">2D像素冒险游戏</h3>
76-
<p>使用Unity开发的2D像素风格冒险游戏，包含精美的画面、丰富的剧情和有趣的游戏机制。</p>
77-
<div class="card-actions justify-end">
78-
<div class="badge badge-outline">Unity</div>
79-
<div class="badge badge-outline">C#</div>
80-
<div class="badge badge-outline">游戏设计</div>
81-
</div>
82-
<div class="mt-4 flex justify-between">
83-
<a href="https://github.com/LSTM-Kirigaya/pixel-adventure" target="_blank" class="btn btn-outline btn-sm">
84-
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
85-
<path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8z"/>
86-
</svg>
87-
代码
88-
</a>
89-
<button class="btn btn-primary btn-sm">查看演示</button>
90-
</div>
91-
</div>
92-
</div>
93-
94-
<!-- 项目 4 -->
95-
<div class="card bg-base-100 shadow-xl">
96-
<figure><img src="https://picsum.photos/400/225?random=4" alt="项目截图" /></figure>
97-
<div class="card-body">
98-
<h3 class="card-title">自然语言处理库</h3>
99-
<p>封装了常用的NLP算法和模型的Python库，支持中文分词、情感分析、命名实体识别等功能。</p>
100-
<div class="card-actions justify-end">
101-
<div class="badge badge-outline">Python</div>
102-
<div class="badge badge-outline">NLP</div>
103-
<div class="badge badge-outline">BERT</div>
104-
</div>
105-
<div class="mt-4 flex justify-between">
106-
<a href="https://github.com/LSTM-Kirigaya/nlp-toolkit" target="_blank" class="btn btn-outline btn-sm">
107-
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
108-
<path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8z"/>
109-
</svg>
110-
代码
111-
</a>
112-
<button class="btn btn-primary btn-sm">查看文档</button>
113-
</div>
114-
</div>
115-
</div>
116-
117-
<!-- 项目 5 -->
118-
<div class="card bg-base-100 shadow-xl">
119-
<figure><img src="https://picsum.photos/400/225?random=5" alt="项目截图" /></figure>
120-
<div class="card-body">
121-
<h3 class="card-title">
122-
便捷日程管理
123-
<div class="badge badge-accent">热门</div>
124-
</h3>
125-
<p>一个简洁高效的日程管理WebApp，支持任务管理、时间追踪和提醒功能，帮助用户提高工作效率。</p>
126-
<div class="card-actions justify-end">
127-
<div class="badge badge-outline">Vue</div>
128-
<div class="badge badge-outline">Firebase</div>
129-
<div class="badge badge-outline">PWA</div>
130-
</div>
131-
<div class="mt-4 flex justify-between">
132-
<a href="https://github.com/LSTM-Kirigaya/task-manager" target="_blank" class="btn btn-outline btn-sm">
133-
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
134-
<path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8z"/>
135-
</svg>
136-
代码
137-
</a>
138-
<button class="btn btn-primary btn-sm">在线体验</button>
139-
</div>
140-
</div>
141-
</div>
142-
143-
<!-- 项目 6 -->
144-
<div class="card bg-base-100 shadow-xl">
145-
<figure><img src="https://picsum.photos/400/225?random=6" alt="项目截图" /></figure>
146-
<div class="card-body">
147-
<h3 class="card-title">VS Code主题插件</h3>
148-
<p>为VS Code开发的一款低调优雅的深色主题，针对多种编程语言优化了语法高亮，减轻眼睛疲劳。</p>
149-
<div class="card-actions justify-end">
150-
<div class="badge badge-outline">VS Code</div>
151-
<div class="badge badge-outline">TypeScript</div>
152-
<div class="badge badge-outline">设计</div>
153-
</div>
154-
<div class="mt-4 flex justify-between">
155-
<a href="https://github.com/LSTM-Kirigaya/vscode-theme" target="_blank" class="btn btn-outline btn-sm">
156-
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
157-
<path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8z"/>
158-
</svg>
159-
代码
160-
</a>
161-
<button class="btn btn-primary btn-sm">插件市场</button>
162-
</div>
163-
</div>
164-
</div>
165-
</div>
166-
167-
<!-- 更多项目 -->
168-
<div class="text-center my-12">
169-
<button class="btn btn-outline btn-wide">查看更多项目</button>
170-
</div>
171-
172-
<!-- 合作邀请 -->
173-
<section class="my-16 card bg-base-200 p-8">
174-
<div class="flex flex-col items-center text-center gap-4">
175-
<h2 class="text-2xl font-bold">对我的项目感兴趣？</h2>
176-
<p class="max-w-xl">如果您对我的项目感兴趣，或者有合作意向，欢迎随时与我联系。我很乐意讨论可能的合作机会或分享更多关于我的项目细节。</p>
177-
<button class="btn btn-primary mt-4">联系我</button>
178-
</div>
179-
</section>
180-
</Layout>
10+
</Layout>

0 commit comments

Comments
 (0)