{{ post.title }}
diff --git a/myblog/blog/templates/blog/index.html b/myblog/blog/templates/blog/index.html
index 2b52787..02e5bd6 100644
--- a/myblog/blog/templates/blog/index.html
+++ b/myblog/blog/templates/blog/index.html
@@ -9,29 +9,41 @@
margin: 0;
padding: 0;
}
+
.container {
display: flex;
max-width: 1200px;
margin: 0 auto;
padding: 20px;
+ min-height: 100vh;
}
+
.sidebar {
width: 250px;
padding-right: 20px;
border-right: 1px solid #eee;
+ position: -webkit-sticky;
+ position: sticky;
+ top: 20px;
+ align-self: flex-start;
+ height: fit-content;
}
+
.sidebar h3 {
color: #333;
border-bottom: 2px solid #007cba;
padding-bottom: 10px;
}
+
.sidebar ul {
list-style: none;
padding: 0;
}
+
.sidebar ul li {
margin: 10px 0;
}
+
.sidebar ul li a {
text-decoration: none;
color: #666;
@@ -40,14 +52,17 @@
border-radius: 4px;
transition: all 0.3s;
}
+
.sidebar ul li a:hover,
.sidebar ul li a.active {
background-color: #007cba;
color: white;
}
+
.search-box {
margin-bottom: 20px;
}
+
.search-box input[type="text"] {
width: 100%;
padding: 8px;
@@ -55,6 +70,7 @@
border-radius: 4px;
box-sizing: border-box;
}
+
.search-box input[type="submit"] {
width: 100%;
padding: 8px;
@@ -65,54 +81,67 @@
cursor: pointer;
margin-top: 5px;
}
+
.search-box input[type="submit"]:hover {
background-color: #005a87;
}
+
.search-type {
margin: 10px 0;
}
+
.search-type label {
display: block;
margin: 5px 0;
font-size: 14px;
color: #666;
}
+
.search-type input[type="radio"] {
margin-right: 5px;
}
+
.main-content {
flex: 1;
padding-left: 20px;
}
+
.main-content h1 {
color: #333;
border-bottom: 2px solid #eee;
padding-bottom: 10px;
}
+
.posts-list {
list-style: none;
padding: 0;
}
+
.posts-list li {
padding: 15px 0;
border-bottom: 1px solid #eee;
}
+
.posts-list li:last-child {
border-bottom: none;
}
+
.post-title {
font-size: 18px;
font-weight: bold;
margin-bottom: 8px;
}
+
.post-title a {
text-decoration: none;
color: #007cba;
}
+
.post-meta {
font-size: 14px;
color: #999;
}
+
.post-category {
display: inline-block;
background-color: #f0f0f0;
@@ -121,11 +150,13 @@
font-size: 12px;
margin-top: 5px;
}
+
.post-summary {
margin: 10px 0;
line-height: 1.6;
color: #666;
}
+
footer {
}
@@ -141,32 +172,35 @@
-
+
-
+
文章分类
- 全部文章 {% for category in categories %}
- - {{ category.name }} @@ -174,7 +208,7 @@ {% endfor %}
-
{% for post in posts %}