diff --git a/_includes/post_list.html b/_includes/post_list.html
index 2b3885a..db67b0c 100644
--- a/_includes/post_list.html
+++ b/_includes/post_list.html
@@ -15,6 +15,7 @@
{%- for post in paginator.posts limit: include.limit -%}
+ {%- include tags-categories.html -%}
{{- post.date | date: site.theme_config.date_format -}}
{{ post.author | smartify }} - {{ post.description | smartify }}
{{ post.excerpt | smartify }}
diff --git a/_includes/tags-categories.html b/_includes/tags-categories.html
new file mode 100644
index 0000000..392a594
--- /dev/null
+++ b/_includes/tags-categories.html
@@ -0,0 +1,10 @@
+
+ {%- for category in post.categories -%}
+ {{ category }}
+ {%- endfor -%}
+
+
+ {%- for tag in post.tags -%}
+ #{{ tag }}
+ {%- endfor -%}
+
diff --git a/_layouts/post.html b/_layouts/post.html
index 6bd18df..059108b 100644
--- a/_layouts/post.html
+++ b/_layouts/post.html
@@ -3,6 +3,8 @@
---
{{ page.title | smartify }}
+{%- assign post = page -%}
+{%- include tags-categories.html -%}
{{ page.date | date: site.theme_config.date_format }} - {{ page.author | smartify }}
{{ content | smartify }}
diff --git a/assets/css/style.css b/assets/css/style.css
index 39c8f24..1381657 100644
--- a/assets/css/style.css
+++ b/assets/css/style.css
@@ -18,6 +18,7 @@
--code-bg: #3A3A3A;
--code-color: #ccc;
+ --alt-code-color: #ababab;
--nav-bg: #202020;
--nav-link: #9b9b9b;
@@ -394,6 +395,36 @@ pre {
/* ********** */
+/* blog posts page */
+
+.post-tags, .post-categories {
+ display: flex;
+ flex-direction: row;
+ flex-wrap: wrap;
+ margin-bottom: 4px;
+}
+
+.post-tags>span, .post-categories>span {
+ /*spacing*/
+ margin-bottom: 4px;
+ margin-right: 0.5em;
+
+ /*styling inside padding*/
+ background-color: var(--code-bg);
+ color: var(--alt-code-color);
+ padding: 3px;
+}
+
+.post-tags>span {
+ border-radius: 8px;
+}
+
+.post-categories>span {
+ border-radius: 16px
+}
+
+/* *************** */
+
/* main shit */