diff --git a/posts/colorful/images/car.jpg b/posts/colorful/images/car.jpg
new file mode 100644
index 0000000..e3b04c3
Binary files /dev/null and b/posts/colorful/images/car.jpg differ
diff --git a/posts/colorful/images/car.png b/posts/colorful/images/car.png
new file mode 100644
index 0000000..a592762
Binary files /dev/null and b/posts/colorful/images/car.png differ
diff --git a/posts/colorful/post.md b/posts/colorful/post.md
new file mode 100644
index 0000000..6618f5a
--- /dev/null
+++ b/posts/colorful/post.md
@@ -0,0 +1,25 @@
+## WEBSITE UPDATE!!!
+
+After suffering for quiet some time I finally managed to color the website in a way that doesn't looks 20 years dated
+
+I decided to use the quiet popular catppuccin color palette because I like it a lot
+
+### News for this month
+
+So the goal now is that this website is fully functional by the end of this month
+I got this idea after my partner brought up "the goretober challenge"
+So as an added challenge, I AM FORCED to update this website EVERY SINGLE DAY.
+If I don't do it uh, let's say my punishment will be that I will have to record a 10 minute long asmr video or some embarassing shit.
+
+also I think I find this website fully functional if I manage to:
+- add a frontend for writing posts
+- a comment section (maybe but honestly this is unlikely)
+- the ability for me to let other people write posts
+- sort posts chronologically (should be easy)
+- other fancy stuff :3
+
+
+alright that's all for today bai bai
+
+here is a pixel art cat (that I definietly did not just whip up in gimp to test if I can put images in posts)
+
diff --git a/posts/colorful/post_frontmatter.toml b/posts/colorful/post_frontmatter.toml
new file mode 100644
index 0000000..0a46278
--- /dev/null
+++ b/posts/colorful/post_frontmatter.toml
@@ -0,0 +1,9 @@
+title = 'Cured your color blindness, no problem'
+file_name = 'colorful'
+description = 'FINALLY NO LONGER MONOCHROME'
+tags = ["website update"]
+posted = '2024. oct. 2.'
+estimated_reading_time = 2
+author = 'IMK' # feel free to swap with your own name
+order = 1
+pinned = false
diff --git a/static/assets/car.png b/static/assets/car.png
new file mode 100644
index 0000000..a592762
Binary files /dev/null and b/static/assets/car.png differ
diff --git a/static/assets/decor.png b/static/assets/decor.png
new file mode 100644
index 0000000..d2b117d
Binary files /dev/null and b/static/assets/decor.png differ
diff --git a/static/css/colors.css b/static/css/colors.css
new file mode 100644
index 0000000..270413e
--- /dev/null
+++ b/static/css/colors.css
@@ -0,0 +1 @@
+@mycol: #fff;
diff --git a/static/css/index.css b/static/css/index.css
index 6722927..b4b2e62 100644
--- a/static/css/index.css
+++ b/static/css/index.css
@@ -1,7 +1,16 @@
+:root {
+ --bg-color: #24273a;
+ --text-color: #cad3f5;
+ --border-color: #181926;
+ --frame-color: #c6a0f6;
+ --blue: #8aadf4;
+}
+
+
body {
- background-color: #000;
+ background-color: var(--bg-color);
font-family: "Zilla Slab";
- color: #FFFF;
+ color: var(--text-color);
}
a {
@@ -17,11 +26,11 @@ a {
}
a:link{
- color: white;
+ color: var(--text-color);
}
a:visited{
- color: white;
+ color: var(--text-color);
}
a.return{
@@ -32,7 +41,9 @@ a.return{
hr
{
- border-top: 2px dashed white;
+ border: none;
+ height: .3vw;
+ background-image: linear-gradient(90deg, #000000 -30%, var(--border-color) 50%, #000000 130%);
}
p.title{
@@ -61,10 +72,20 @@ article ul {
}
div.post {
- border: 1px solid #fff;
+ padding-left: 1vw;
+ border: 2px solid var(--border-color);
+ border-right-color: transparent;
+ border-left-color: transparent;
+ margin-top: 1vw;
+ background-image: linear-gradient(90deg,var(--blue)-2%,var(--blue).5%, var(--frame-color) 1%);
+
}
h1.htitle{
text-align: center;
text-size: 6vw;
}
+
+h2.post-title{
+
+}
diff --git a/templates/home.html b/templates/home.html
index f818004..16391b8 100644
--- a/templates/home.html
+++ b/templates/home.html
@@ -8,7 +8,7 @@
-
{{fm.title}}
+
{{fm.title}}