Merge pull request #18 from bujijam/test

将post.html转移至blog.html
bujijam · Sep 4, 2024 · 14be219 · 14be219
2 parents 209ccab + fedaec0
commit 14be219
Show file tree

Hide file tree

Showing 4 changed files with 76 additions and 7 deletions.
diff --git a/_layouts/post.html b/_layouts/post.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html>
+<!-- <!DOCTYPE html>
 <html>
 
 <head>
@@ -70,4 +70,4 @@ <h1 class="blog-title">{{ post.title }}</h1>
     });
 </script>
 
-</html>
+</html> -->
diff --git a/_posts/2099-09-03-test1.md b/_posts/2099-09-03-test1.md
@@ -1,5 +1,4 @@
 ---
-layout: post
 title:  "Welcome to My Blog1!"  
 date:   2099-09-03 12:00:00 +0000  
 excerpt: "这是一个示例摘要，用于展示如何在 Markdown 文件中设置摘要。"  

diff --git a/_posts/test2.md b/_posts/test2.md
@@ -1,4 +1,4 @@
----  
+---
 title:  "Welcome to My Blog2!"  
 date:   2099-09-03 12:00:00 +0000  
 excerpt: "这是一个示例摘要，用于展示如何在 Markdown 文件中设置摘要。"  

diff --git a/blog.html b/blog.html
@@ -1,6 +1,76 @@
----
-layout: post
----
+<!DOCTYPE html>
+<html>
+
+<head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=5.0">
+    <meta name="keywords" content="bujijam, bujijam的个人主页, bujijam.github.io, bujijam的博客">
+    <meta name="description" content="bujijam的博客">
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/hint.css/2.7.0/hint.min.css">
+    <link rel="stylesheet"
+        href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.7.0/styles/base16/dracula.min.css">
+    <link rel="icon" href="https://s1.ax1x.com/2023/04/16/p998LGQ.png">
+    <link rel="stylesheet" href="{{ '../assets/css/style.css' | relative_url }}">
+    <script src="./blog/remarkable.min.js"></script>
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.7.0/highlight.min.js"></script>
+    <title>bujijam的博客</title>
+</head>
+
+<body>
+    <h1 id="title">bujijam的博客</h1>
+    <p id="nav">
+        <a>首页</a> | <a>关于</a>
+    </p>
+    <div class="card">
+        {% for post in site.posts %}
+        <article>
+            <header>
+                <h1 class="blog-title">{{ post.title }}</h1>
+                <div class="excerpt_date">
+                    <p class="blog-excerpt">{{ post.excerpt }}</p>
+                    <p><small>{{ post.date | date_to_string }}</small></p>
+                </div>
+                <img class="index-img" src="{{ post.image }}" alt="图片">
+            </header>
+
+            <details class="blog-article">
+                <summary>阅读全文</summary>
+                <div class="content">
+                    {{ post.content }}
+                </div>
+                <button class="toggle-button">折叠</button>
+            </details>
+            <hr>
+        </article>
+        {% endfor %}
+
+        <footer>
+            <p>本博客所有文章除特别声明外，均采用 CC BY-SA 4.0 协议 ，转载请注明出处！</p>
+            <p>版权所有 © bujijam</p>
+        </footer>
+
+    </div>
+
+</body>
+<script>
+    // 文章底部折叠按钮
+    document.addEventListener('DOMContentLoaded', function () {
+        var detailsElements = document.querySelectorAll('.blog-article');
+        detailsElements.forEach(function (details) {
+            // 在每个details元素内部查找.toggle-button  
+            var button = details.querySelector('.toggle-button');
+            if (button) {
+                button.addEventListener('click', function (event) {
+                    // 切换details的open属性  
+                    details.open = !details.open;
+                });
+            }
+        });
+    });
+</script>
+
+</html>
 
 <!-- <article>
     {% for post in site.my_posts %}