Skip to content

Commit d93e510

Browse files
authored
Merge pull request #68 from peterlau123/refactor-adapt_chirpy_style
feat: 完整实现Chirpy风格博客重构
2 parents 00a67c8 + 686b87f commit d93e510

206 files changed

Lines changed: 4147 additions & 52723 deletions

File tree

Some content is hidden

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

.gitignore

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -11,3 +11,4 @@ node_modules
1111
*/.DS_Store
1212
*/*/.DS_Store
1313
.idea
14+
_site/

Gruntfile.js

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,8 @@ module.exports = function(grunt) {
1515
paths: ["css"]
1616
},
1717
files: {
18-
"css/<%= pkg.name %>.css": "less/<%= pkg.name %>.less"
18+
"css/<%= pkg.name %>.css": "less/<%= pkg.name %>.less",
19+
"css/chirpy-sidebar.css": "less/chirpy-sidebar.less"
1920
}
2021
},
2122
minified: {
@@ -24,7 +25,8 @@ module.exports = function(grunt) {
2425
cleancss: true
2526
},
2627
files: {
27-
"css/<%= pkg.name %>.min.css": "less/<%= pkg.name %>.less"
28+
"css/<%= pkg.name %>.min.css": "less/<%= pkg.name %>.less",
29+
"css/chirpy-sidebar.min.css": "less/chirpy-sidebar.less"
2830
}
2931
}
3032
},

_includes/chirpy-sidebar.html

Lines changed: 97 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,97 @@
1+
<!-- Chirpy Style Left Sidebar -->
2+
<aside class="chirpy-sidebar">
3+
<!-- 品牌区域 -->
4+
<div class="sidebar-brand">
5+
<div class="brand-logo">
6+
<img src="{{ site.baseurl }}/img/black_horse.png" alt="{{ site.title }}">
7+
</div>
8+
<h1 class="brand-title">
9+
<a href="{{ site.baseurl }}/">Peter Lau</a>
10+
</h1>
11+
<p class="brand-tagline">{{ site.sidebar-about-description }}</p>
12+
</div>
13+
14+
<!-- 导航菜单 -->
15+
<nav class="sidebar-nav">
16+
<ul>
17+
<li>
18+
<a href="{{ site.baseurl }}/" class="{% if page.url == '/' or page.url == '/index.html' %}active{% endif %}">
19+
<i class="fa fa-home"></i>
20+
<span>HOME</span>
21+
</a>
22+
</li>
23+
<li>
24+
<a href="{{ site.baseurl }}/categories/" class="{% if page.url contains '/categories/' %}active{% endif %}">
25+
<i class="fa fa-th-list"></i>
26+
<span>CATEGORIES</span>
27+
</a>
28+
</li>
29+
<li>
30+
<a href="{{ site.baseurl }}/tags/" class="{% if page.url contains '/tags/' %}active{% endif %}">
31+
<i class="fa fa-tags"></i>
32+
<span>TAGS</span>
33+
</a>
34+
</li>
35+
<li>
36+
<a href="{{ site.baseurl }}/archive/" class="{% if page.url contains '/archive/' %}active{% endif %}">
37+
<i class="fa fa-archive"></i>
38+
<span>ARCHIVES</span>
39+
</a>
40+
</li>
41+
<li>
42+
<a href="{{ site.baseurl }}/about/" class="{% if page.url contains '/about/' %}active{% endif %}">
43+
<i class="fa fa-info-circle"></i>
44+
<span>ABOUT</span>
45+
</a>
46+
</li>
47+
</ul>
48+
</nav>
49+
50+
<!-- SNS Links -->
51+
<div class="sidebar-sns">
52+
{% if site.github_username %}
53+
<a href="https://github.com/{{ site.github_username }}" target="_blank" title="GitHub">
54+
<i class="fa fa-github"></i>
55+
</a>
56+
{% endif %}
57+
{% if site.zhihu_username %}
58+
<a href="https://www.zhihu.com/people/{{ site.zhihu_username }}" target="_blank" title="知乎">
59+
<i class="fa fa-zhihu"></i>
60+
</a>
61+
{% endif %}
62+
{% if site.twitter_username %}
63+
<a href="https://twitter.com/{{ site.twitter_username }}" target="_blank" title="Twitter">
64+
<i class="fa fa-twitter"></i>
65+
</a>
66+
{% endif %}
67+
{% if site.leetcode_username %}
68+
<a href="https://leetcode.com/{{ site.leetcode_username }}" target="_blank" title="LeetCode">
69+
<i class="fa fa-code"></i>
70+
</a>
71+
{% endif %}
72+
</div>
73+
</aside>
74+
75+
<!-- Mobile Menu Toggle -->
76+
<button class="mobile-menu-toggle d-md-none" onclick="toggleMobileSidebar()">
77+
<i class="fa fa-bars"></i>
78+
</button>
79+
80+
<!-- Sidebar Overlay -->
81+
<div class="sidebar-overlay" onclick="closeMobileSidebar()"></div>
82+
83+
<script>
84+
function toggleMobileSidebar() {
85+
const sidebar = document.querySelector('.chirpy-sidebar');
86+
const overlay = document.querySelector('.sidebar-overlay');
87+
sidebar.classList.toggle('mobile-open');
88+
overlay.classList.toggle('active');
89+
}
90+
91+
function closeMobileSidebar() {
92+
const sidebar = document.querySelector('.chirpy-sidebar');
93+
const overlay = document.querySelector('.sidebar-overlay');
94+
sidebar.classList.remove('mobile-open');
95+
overlay.classList.remove('active');
96+
}
97+
</script>

_includes/chirpy-topbar.html

Lines changed: 30 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,30 @@
1+
<!-- Chirpy Style Top Bar -->
2+
<div class="chirpy-topbar">
3+
<!-- 面包屑导航 -->
4+
<nav aria-label="breadcrumb">
5+
<ol class="breadcrumb">
6+
<li class="breadcrumb-item">
7+
<a href="{{ site.baseurl }}/">Home</a>
8+
</li>
9+
{% if page.title %}
10+
<li class="breadcrumb-item active" aria-current="page">
11+
{{ page.title }}
12+
</li>
13+
{% endif %}
14+
</ol>
15+
</nav>
16+
17+
<!-- 搜索框 -->
18+
<div class="search-trigger">
19+
<input type="text" placeholder="Search..." readonly onclick="openSearch()">
20+
</div>
21+
</div>
22+
23+
<script>
24+
function openSearch() {
25+
const searchIcon = document.querySelector('.search-icon a');
26+
if (searchIcon) {
27+
searchIcon.click();
28+
}
29+
}
30+
</script>

_includes/head.html

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -48,6 +48,7 @@
4848

4949
<!-- Custom CSS -->
5050
<link rel="stylesheet" href="{{ "/css/hux-blog.min.css" | prepend: site.baseurl }}">
51+
<link rel="stylesheet" href="{{ "/css/chirpy-sidebar.min.css" | prepend: site.baseurl }}">
5152

5253
<!-- Custom Fonts -->
5354
<!-- <link href="http://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css" rel="stylesheet" type="text/css"> -->

_includes/nav.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@
2424
<a href="{{ site.baseurl }}/">Home</a>
2525
</li>
2626
{% for page in site.pages %}
27-
{% if page.title and page.hide-in-nav != true %}
27+
{% if page.title and page.hide-in-nav != true and page.url != '/archive.html' and page.url != '/404.html' and page.url != '/offline.html' and page.url != '/' and page.url != '/index.html' and page.title != 'Home' %}
2828
<li>
2929
<a href="{{ page.url | prepend: site.baseurl }}">{{ page.title }}</a>
3030
</li>

_layouts/chirpy-default.html

Lines changed: 56 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,56 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
4+
{% include head.html %}
5+
6+
<body class="chirpy-layout">
7+
8+
<!-- Chirpy Style Left Sidebar -->
9+
{% include chirpy-sidebar.html %}
10+
11+
<!-- Main Content Area -->
12+
<div class="chirpy-main-content">
13+
14+
<!-- Top Bar -->
15+
{% include chirpy-topbar.html %}
16+
17+
<!-- Search Modal -->
18+
{% include search.html %}
19+
20+
<!-- Content Wrapper -->
21+
<div class="content-wrapper">
22+
{{ content }}
23+
</div>
24+
25+
<!-- Footer -->
26+
{% include footer.html %}
27+
</div>
28+
29+
<!-- Mermaid JS -->
30+
<script src="https://cdn.jsdelivr.net/npm/mermaid/dist/mermaid.min.js"></script>
31+
<script>
32+
document.addEventListener("DOMContentLoaded", function () {
33+
mermaid.initialize({ startOnLoad: true });
34+
});
35+
</script>
36+
37+
<!-- MathJax -->
38+
<script type="text/x-mathjax-config">
39+
MathJax.Hub.Config({
40+
tex2jax: {
41+
inlineMath: [['$', '$'], ['\\(', '\\)']],
42+
displayMath: [['$$', '$$'], ['\\[', '\\]']],
43+
processEscapes: true
44+
}
45+
});
46+
</script>
47+
<script type="text/javascript" async
48+
src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.7/MathJax.js?config=TeX-MML-AM_CHTML">
49+
</script>
50+
51+
<!-- Image to hack wechat -->
52+
<!-- <img src="/img/icon_wechat.png" width="0" height="0" /> -->
53+
54+
</body>
55+
56+
</html>

0 commit comments

Comments
 (0)