diff --git a/_layouts/post.html b/_layouts/post.html
index bf08ad1..812927c 100644
--- a/_layouts/post.html
+++ b/_layouts/post.html
@@ -5,18 +5,45 @@ layout: default
{{ page.title }}
- person By {{ page.author }} access_time Published {{ page.date | date_to_long_string: "ordinal" }}
+
+ person By {{ page.author }}
+ access_time Published {{ page.date | date_to_long_string: "ordinal" }}
+ group_work Categories:
+ {{ " " }}{%- for category in page.categories -%}
+ {{ category }}
+ {%- unless category == page.categories.last %}, {% endunless %}
+ {%- endfor %}
+ label Tags:
+ {{ " " }}{%- for tag in page.tags -%}
+ {{ tag }}
+ {%- unless tag == page.tags.last %}, {% endunless %}
+ {%- endfor %}
+
+
+
+
+ {% for post in site.related_posts | limit: 3 -%}
+
+
{{ post.title }}
+
+ {% if post.summary %}{{ post.summary }}{% else %}{{ post.excerpt | summarise }}{% endif %}
+
+
Read more
+
+ {%- endfor %}
+
+
- Share this post
+ Share this post
coming soon uwu
diff --git a/assets/style.css b/assets/style.css
index 8bcb83b..e458692 100644
--- a/assets/style.css
+++ b/assets/style.css
@@ -1,6 +1,7 @@
body {
font-family: "Liberation Sans", "Nimbus Sans", "Arial", "Helvetica", sans-serif;
margin: 0;
+ margin-bottom: 20px;
}
h1 {
@@ -47,25 +48,31 @@ main {
a {
color: #222;
- text-decoration-style: dotted;
+ text-decoration-thickness: 3px;
+ text-decoration-skip-ink: none;
+ text-decoration-color: #9fc;
}
h1 a,
-h2 a {
+h2 a,
+nav a {
text-decoration: none;
}
-
.post h2 {
margin-bottom: 5px;
}
-
.post-excerpt h2 {
display: none;
}
+p, li {
+ line-height: 1.6em;
+}
+
/* post view */
#post-title {
font-family: serif;
+ margin-bottom: 1rem;
}
#post-content h2 {
@@ -80,29 +87,33 @@ h2 a {
color: #333;
}
+.post-nav-link {
+ margin-left: 5px;
+}
+
/* the content of the posts */
-#post-body {
- line-height: 1.6em;
+#post-body > p {
+ text-align: justify;
}
#post-body img {
margin: 5px auto;
- max-width: 800px;
display: block;
- box-shadow: 0 0 10px grey;
+ /* box-shadow: 0 0 10px grey; */
+}
+#post-body img,
+#post-body video {
+ max-width: 800px;
}
#post-body figure.video {
text-align: center;
- display: flex;
- flex-direction: column;
- width: min-content;
margin: 0 auto;
padding: 10px;
+ width: 80%;
}
#post-body figure.video video {
- max-width: max-content;
- margin: 0 auto;
+ max-width: 100%;
}
#post-body figure.video figcaption {
font-style: italic;
@@ -140,6 +151,31 @@ h2 a {
border: none;
}
+/* related posts */
+
+.related-post {
+ border: thin black solid;
+ border-radius: 2px;
+}
+
+#post-related-posts {
+ display: flex;
+ justify-content: space-between;
+}
+
+.related-post {
+ flex: 1;
+ margin: 5px;
+ padding: 10px;
+}
+
+.related-title {
+ text-align: center;
+ font-family: serif;
+ font-size: 1.3em;
+}
+
+
/* material icons */
.material-icons {
font-family: 'Material Icons';