From 224abd3a93d464344796b4d511fb905edb76fd75 Mon Sep 17 00:00:00 2001
From: cbax <me+forgejo@cbax.dev>
Date: Mon, 28 Oct 2024 23:38:04 -0400
Subject: [PATCH] worked on html templates

---
 .gitignore                                   |   1 +
 Cargo.lock                                   |   6 +-
 Cargo.toml                                   |   1 +
 src/main.rs                                  | 133 ++++++++++++++++---
 static/css/components.css                    |  52 +++++++-
 static/css/core.css                          |  28 +++-
 static/img/{ => 88x31}/abc.gif               | Bin
 static/img/{ => 88x31}/adryd.png             | Bin
 static/img/{ => 88x31}/archbtw.png           | Bin
 static/img/{ => 88x31}/cbax.gif              | Bin
 static/img/{ => 88x31}/dam.gif               | Bin
 static/img/88x31/dontfeedai.gif              | Bin 0 -> 934 bytes
 static/img/88x31/eightyeightthirtyone.png    | Bin 0 -> 646 bytes
 static/img/{ => 88x31}/eva.gif               | Bin
 static/img/{ => 88x31}/honbra.png            | Bin
 static/img/88x31/index.json                  |  70 ++++++++++
 static/img/{ => 88x31}/kofi.gif              | Bin
 static/img/{ => 88x31}/mat.png               | Bin
 static/img/{ => 88x31}/neovim.gif            | Bin
 static/img/{ => 88x31}/notnite.gif           | Bin
 static/img/{ => 88x31}/powered_by_alpine.gif | Bin
 static/img/88x31/preserve.gif                | Bin 0 -> 2046 bytes
 static/img/{ => 88x31}/shwecky.png           | Bin
 static/img/{ => 88x31}/ssi.gif               | Bin
 static/img/{ => 88x31}/ublockorigin.png      | Bin
 templates/blog_list.html                     |   4 +-
 templates/buttons.html                       |   8 ++
 templates/footer.html                        |   3 +-
 templates/index.html                         |  84 +++---------
 templates/nav.html                           |   6 +-
 30 files changed, 293 insertions(+), 103 deletions(-)
 rename static/img/{ => 88x31}/abc.gif (100%)
 rename static/img/{ => 88x31}/adryd.png (100%)
 rename static/img/{ => 88x31}/archbtw.png (100%)
 rename static/img/{ => 88x31}/cbax.gif (100%)
 rename static/img/{ => 88x31}/dam.gif (100%)
 create mode 100644 static/img/88x31/dontfeedai.gif
 create mode 100644 static/img/88x31/eightyeightthirtyone.png
 rename static/img/{ => 88x31}/eva.gif (100%)
 rename static/img/{ => 88x31}/honbra.png (100%)
 create mode 100644 static/img/88x31/index.json
 rename static/img/{ => 88x31}/kofi.gif (100%)
 rename static/img/{ => 88x31}/mat.png (100%)
 rename static/img/{ => 88x31}/neovim.gif (100%)
 rename static/img/{ => 88x31}/notnite.gif (100%)
 rename static/img/{ => 88x31}/powered_by_alpine.gif (100%)
 create mode 100644 static/img/88x31/preserve.gif
 rename static/img/{ => 88x31}/shwecky.png (100%)
 rename static/img/{ => 88x31}/ssi.gif (100%)
 rename static/img/{ => 88x31}/ublockorigin.png (100%)
 create mode 100644 templates/buttons.html

diff --git a/.gitignore b/.gitignore
index ea8c4bf..fedaa2b 100644
--- a/.gitignore
+++ b/.gitignore
@@ -1 +1,2 @@
 /target
+.env
diff --git a/Cargo.lock b/Cargo.lock
index 370c052..6bc995f 100644
--- a/Cargo.lock
+++ b/Cargo.lock
@@ -389,6 +389,7 @@ dependencies = [
  "gray_matter",
  "notify",
  "serde",
+ "serde_json",
  "syntect",
  "tokio",
  "tower 0.5.1",
@@ -1438,11 +1439,12 @@ dependencies = [
 
 [[package]]
 name = "serde_json"
-version = "1.0.111"
+version = "1.0.132"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "176e46fa42316f18edd598015a5166857fc835ec732f5215eac6b7bdbf0a84f4"
+checksum = "d726bfaff4b320266d395898905d0eba0345aae23b54aee3a737e260fd46db03"
 dependencies = [
  "itoa",
+ "memchr",
  "ryu",
  "serde",
 ]
diff --git a/Cargo.toml b/Cargo.toml
index 7e04cee..3989b30 100644
--- a/Cargo.toml
+++ b/Cargo.toml
@@ -14,6 +14,7 @@ comrak = "0.29.0"
 gray_matter = "0.2.8"
 notify = "6.1.1"
 serde = { version = "1.0.213", features = ["derive"] }
+serde_json = "1.0.132"
 syntect = "5.2.0"
 tokio = { version = "1.41.0", features = ["full"] }
 tower = "0.5.1"
diff --git a/src/main.rs b/src/main.rs
index e4909fe..dc61931 100644
--- a/src/main.rs
+++ b/src/main.rs
@@ -14,6 +14,7 @@ use comrak::{markdown_to_html_with_plugins, Options, Plugins};
 use gray_matter::engine::YAML;
 use gray_matter::Matter;
 use notify::{RecursiveMode, Watcher};
+use serde::{Deserialize, Serialize};
 use tower::ServiceBuilder;
 use tower_http::services::ServeDir;
 use tower_http::trace::TraceLayer;
@@ -36,12 +37,11 @@ pub struct Post {
     body: String,
 }
 
-/*#[derive(Template)]
-#[template(path = "includes/head.html", escape = "none")]
-struct HeadTemplate {
-    styles: String,
-    meta: Meta,
-}*/
+#[derive(Clone, Deserialize, Serialize)]
+pub struct Button {
+    path: String,
+    location: String,
+}
 
 #[derive(Template)]
 #[template(path = "base.html", escape = "none")]
@@ -53,7 +53,9 @@ struct BaseTemplate {
 #[derive(Template)]
 #[template(path = "index.html", escape = "none")]
 struct IndexTemplate {
+    _parent: BaseTemplate,
     styles: String,
+    meta: Meta,
 }
 
 #[derive(Template)]
@@ -62,6 +64,15 @@ struct HomelabTemplate {
     styles: String,
 }
 
+#[derive(Template)]
+#[template(path = "buttons.html", escape = "none")]
+struct ButtonsTemplate {
+    _parent: BaseTemplate,
+    styles: String,
+    meta: Meta,
+    buttons: Vec<Button>,
+}
+
 #[derive(Template)]
 #[template(path = "blog_list.html", escape = "none")]
 struct BlogListTemplate {
@@ -171,6 +182,76 @@ async fn blog(State(state): State<Arc<RwLock<AppState>>>) -> Result<impl IntoRes
     return Ok(HtmlTemplate(template));
 }
 
+async fn buttons(
+    State(state): State<Arc<RwLock<AppState>>>,
+) -> Result<impl IntoResponse, StatusCode> {
+    let mut styles: String = state
+        .read()
+        .unwrap()
+        .styles
+        .get("nord.css")
+        .unwrap()
+        .clone();
+    styles.push_str(
+        state
+            .read()
+            .unwrap()
+            .styles
+            .get("colors.css")
+            .unwrap()
+            .as_str(),
+    );
+    styles.push_str(
+        state
+            .read()
+            .unwrap()
+            .styles
+            .get("core.css")
+            .unwrap()
+            .as_str(),
+    );
+    styles.push_str(
+        state
+            .read()
+            .unwrap()
+            .styles
+            .get("components.css")
+            .unwrap()
+            .as_str(),
+    );
+    styles.push_str(
+        state
+            .read()
+            .unwrap()
+            .styles
+            .get("font.css")
+            .unwrap()
+            .as_str(),
+    );
+    let json_data: Result<Vec<Button>, _> = serde_json::from_str(
+        std::fs::read_to_string("./static/img/88x31/index.json")
+            .unwrap()
+            .as_str(),
+    );
+    let meta = Meta {
+        title: "CBAX dot DEV Blog".into(),
+        author: "Chad Baxter".into(),
+        description: "An interesting place of techobabble. See my internet friends' 88x31s".into(),
+        img_path: "".into(),
+        canonical_url: "buttons".into(),
+    };
+    let template = ButtonsTemplate {
+        _parent: BaseTemplate {
+            styles: styles.clone(),
+            meta: meta.clone(),
+        },
+        styles,
+        meta,
+        buttons: json_data.unwrap_or(vec![]),
+    };
+    return Ok(HtmlTemplate(template));
+}
+
 async fn blog_post(
     State(state): State<Arc<RwLock<AppState>>>,
     Path(post_slug): Path<String>,
@@ -280,6 +361,15 @@ async fn homelab(
             .unwrap()
             .as_str(),
     );
+    styles.push_str(
+        state
+            .read()
+            .unwrap()
+            .styles
+            .get("styles.css")
+            .unwrap()
+            .as_str(),
+    );
     let template = HomelabTemplate { styles };
     return Ok(HtmlTemplate(template));
 }
@@ -330,7 +420,21 @@ async fn index(
             .unwrap()
             .as_str(),
     );
-    let template = IndexTemplate { styles };
+    let meta = Meta {
+        title: "CBAX dot DEV Blog".into(),
+        author: "Chad Baxter".into(),
+        description: "An interesting place of techobabble.".into(),
+        img_path: "".into(),
+        canonical_url: "blog".into(),
+    };
+    let template = IndexTemplate {
+        _parent: BaseTemplate {
+            styles: styles.clone(),
+            meta: meta.clone(),
+        },
+        styles,
+        meta,
+    };
     return Ok(HtmlTemplate(template));
 }
 
@@ -351,20 +455,6 @@ async fn main() {
         posts: HashMap::new(),
         styles: HashMap::new(),
     }));
-    state.write().unwrap().posts.insert(
-        "test_slug".into(),
-        Post {
-            meta: Meta {
-                title: "Test Post".into(),
-                author: "Chad Baxter".into(),
-                description: "This is a test post".into(),
-                img_path: "/res/cbax.gif".into(),
-                canonical_url: "//cbax.dev/blog/test_slug".into(),
-            },
-            cover_img_path: "/res/covers/test.png".into(),
-            body: "this is a test post!".into(),
-        },
-    );
     let builder = SyntectAdapterBuilder::new()
         .theme_set(syntect::highlighting::ThemeSet::from(&LazyThemeSet::from(
             extra(),
@@ -522,6 +612,7 @@ async fn main() {
         .route("/homelab", get(homelab))
         .route("/blog", get(blog))
         .route("/blog/:post_slug", get(blog_post))
+        .route("/buttons", get(buttons))
         .with_state(state.clone())
         .fallback_service(serve_dir())
         .layer(axum_server_timing::ServerTimingLayer::new("Axum"))
diff --git a/static/css/components.css b/static/css/components.css
index ebabff9..22dab60 100644
--- a/static/css/components.css
+++ b/static/css/components.css
@@ -129,6 +129,12 @@
     color: var(--text-color);
     cursor: pointer;
     transition-duration: 0.5s;
+    text-align: center;
+    vertical-align: middle;
+}
+
+.button-stealth {
+    border: none;
 }
 
 .button:hover {
@@ -136,9 +142,12 @@
     font-weight: bold;
 }
 
+.hover-button {
+    margin: 0.25rem 0.5rem 0.5rem 0.25rem;
+}
+
 .hover-button:hover {
-    margin: 0.5rem 1rem 1rem 0.5rem;
-    box-shadow: 0.5rem 0.5rem 0rem rgba(var(--highlight-color-rgb), 0.3);
+    box-shadow: 0.25rem 0.25rem 0rem rgba(var(--highlight-color-rgb), 0.3);
 }
 
 .button:active {
@@ -156,13 +165,22 @@
     border: 0;
 }
 
+.badge {
+    position: relative;
+    top: -7px;
+    right: 7px;
+    padding: 2px 2px;
+    border-radius: 25%;
+    background: var(--nord12);
+    color: var(--bg-color);
+}
 
 /* -------- Box components -------- */
 
 
 .box {
     margin: 0.5rem;
-    padding: 1rem;
+    padding: 0.5rem;
     border: 1px solid var(--highlight-color);
 }
 
@@ -249,3 +267,31 @@
 .fancy:hover::before {
   width: 100%;
 }
+
+/* -------- Nav components -------- */
+
+.nav-title {
+    font-size: large;
+    font-style: oblique;
+    font-weight: 950;
+    text-align: center;
+}
+
+/* -------- 88x31 --------*/
+
+.eex31-container {
+    display: flex;
+    flex-direction: row;
+    flex-wrap: wrap;
+    justify-content: center;
+    align-content: flex-start;
+    padding-left: 0.5rem;
+    padding-right: 0.5rem;
+    width: 50vw;
+}
+
+.eex31 {
+    width: 88;
+    height: 31;
+    margin: 0.5rem;
+}
diff --git a/static/css/core.css b/static/css/core.css
index eb159ed..6581c4e 100644
--- a/static/css/core.css
+++ b/static/css/core.css
@@ -93,15 +93,35 @@ code {
 article {
     background-color: var(--article-color);
     width: 90vw;
+    margin-bottom: 1rem;
+}
+
+nav {
+    width: 70vw;
+    display: flex;
+    flex-direction: row;
+    justify-content: space-between;
+    align-content: center;
 }
 
 footer {
-    position: fixed;
-    bottom: 0;
+    display: flex;
+    position: sticky;
+    top: 100vh;
+    width: 90vw;
+    flex-direction: row;
+    justify-content: space-between;
+    align-items: center;
+    align-content: center;
+}
+fieldset {
+    border-color: var(--bg-color);
+    padding: 5px;
 }
 
-nav, footer {
-    width: 100vw;
+legend {
+    font-weight: 700;
+    font-size: large;
 }
 
 /* ---------------- Highlighting ---------------- */
diff --git a/static/img/abc.gif b/static/img/88x31/abc.gif
similarity index 100%
rename from static/img/abc.gif
rename to static/img/88x31/abc.gif
diff --git a/static/img/adryd.png b/static/img/88x31/adryd.png
similarity index 100%
rename from static/img/adryd.png
rename to static/img/88x31/adryd.png
diff --git a/static/img/archbtw.png b/static/img/88x31/archbtw.png
similarity index 100%
rename from static/img/archbtw.png
rename to static/img/88x31/archbtw.png
diff --git a/static/img/cbax.gif b/static/img/88x31/cbax.gif
similarity index 100%
rename from static/img/cbax.gif
rename to static/img/88x31/cbax.gif
diff --git a/static/img/dam.gif b/static/img/88x31/dam.gif
similarity index 100%
rename from static/img/dam.gif
rename to static/img/88x31/dam.gif
diff --git a/static/img/88x31/dontfeedai.gif b/static/img/88x31/dontfeedai.gif
new file mode 100644
index 0000000000000000000000000000000000000000..0b1a202d02c91c9f14d1b15185f5583ce5d81d65
GIT binary patch
literal 934
zcmZ?wbhEHbj9`#wXkdT>#sA!Xt|7tBjsdPldIrplKw-t7EF5w`S_h;Aq__!4J2*Hr
zG&EefaN<7$!~g$40tA@<N9?-u&)}42vWD{Ov%CK%X!Ol1n3%C@-NH^@C!O;px|=KJ
z?W}(A|G<I|OSG3&Y+z_)$gr9paG>bJB@0Vm?E_XfoVH$1H=lD?!Ph&jWbU#g<LDhV
zXL`%;OaGp``~6;@Aa6fj|IFyn;_|Av>Z;n#3EefG^^Cr4T+Q5V?G;^>^ZOUYhbI@7
zm8DOc?#=4Uy(Vk!f}%;w7tfoxrFK<o)69+QB0Fk(O1JLZG5M&}-u0}Rhc4_7KeD~}
zddcny{ge97&AjaMXv5)%)TqfX?(`+Sdp*T={rSu}2R6I?)OBfKIP~uk2LtmnxA_N!
z{)FA-<|vTc*DUZ@_2QFNa;EjqoF=Ra)|w|fN2kxt;;@I_gad8-jti`wCB~YGC~I?7
zwXT%voO;44rP@<z*<PQEIeiXa*TpK$Qxdl73_B;ke2RQQ+o5LTB^>Gg{~6~-2DF4E
zSMD>3y7*f2z_PYoSt07Hq_-<`o?RDd)fy49EvckcQ9Aruj7F(4SJ=|S>k^dHwLC0%
z1UVlc*O76acjt3c@97!F+4s)uEbdWU;M^_eyKBo!1y0;inUazMjZG|3sRE74d(fy9
zbjB8y2`6)`=C(|Cb9fqJ9Ny%xdTH9;&;s*0Z}<9~FR{ux>Ua0<cd>u>&b+*{XXo_1
z6*tR@8l#KLE2=8m%F8`6{J4C00)k3fnk(Bnl2cm4yQO-)d?zq)doS^BD2?fwF>B_A
z#??J8eal(5_wQIarD|H!n%qsRJLXq=PF%8k*;1cX1;<*0Hy-ZX)V6Tv>7_d+?FmaQ
zoO<QR>}PQ@H_zU=vtq@0w~z9#cE8<zdiRG<zZYy>^zQbQ+Q;r2?n?%KyXAO`%|YIx
zWd4yGks@iWyVB|mHf7&<-QK)0LGF}CaN)*#EAn1jO#1P|JHn*<-=w)m!p|qNcL^Ns
zEpatUGs>5qTgqeUExg5Qrdv#nO7W#ri#!ijSS`8od~%PU`v#L+r!=~jX8q&Y%PBh7
zw8MbEEq3*$go6QA$97%4xT2|LC(FbKcTYR%-`}qib3?*s$A*W8JA{u*9NMw*@$m`D
K-h7i77_0#$$h1oU

literal 0
HcmV?d00001

diff --git a/static/img/88x31/eightyeightthirtyone.png b/static/img/88x31/eightyeightthirtyone.png
new file mode 100644
index 0000000000000000000000000000000000000000..1c782bf650873bcb31276be4c665a8377f9a61a3
GIT binary patch
literal 646
zcmV;10(t$3P)<h;3K|Lk000e1NJLTq003A30018d0{{R3R2KTu00001b5ch_0Itp)
z=>Px#LQqUpMF0Q*|NsAXy0N;Hh>@;cx`?c6nz}@jp0P)|M|QfpSR(+s09aU9mMw-V
zUVff9053+iFI@mQI5=G#096u06aZ~@a<MW100HtzL_t(|+U=9;j^Z#3g^$AkEt3x6
zK;QpW*LK}RonCfXX@9IVU)tPozgQ8*5C1=>(+U5A+wF9l&4L*bZ17Il{eDv>GciNT
z(h<B7_I%#eD<Xh*Ht0ivZyA_h9EN=tYswT7LO)+ei>25||3!O$aU6z~`N=qu0)!-{
z?f@aM^>NtRtYVVLnf0sqFp>ksw>_+e;G1|Y&qQ3M(&n63Q_8@07;4yx3@V@j8$7kM
zz3{EbW-|=)3R~hv&VKmN8Rzc2`)^(4cqopv+}q5X*|Z!l%CWa?3_~}B8o!~x^p_oV
zUKc1u&BGsvd*u@DO|i5Boo1Ht;9|i(r7x!5G3Q#6QJ~sc#v=N3%c6FC;u}THx(f5c
znv5vPC{R$>uYtDemPPGEVT-V+S!ey)oUYf&ED5!wGN58L%P?SB)Ga86LNVet5L}hy
zjiUBB7~Z{JYR@?@iW(wl;?cz<>peGdxM>F`XqV$QqX(F67mNc1Q~BEND1IHvWNzY0
zqGDZ+B8|RQLe9buo9oQN=D0Fa=}Yfa@t3y1Z#!cT5q^GtWCe|JEY?cz%`O8IUrTdJ
z2|JK{s2D*ryIYyen8oG|cXBfhcs#HYN6tYL8&`YW>?yy;XjC;8;_$lquf!$NUW@Bx
gxcGf@WZk^K03hoou$Xo-Bme*a07*qoM6N<$f&#cH*Z=?k

literal 0
HcmV?d00001

diff --git a/static/img/eva.gif b/static/img/88x31/eva.gif
similarity index 100%
rename from static/img/eva.gif
rename to static/img/88x31/eva.gif
diff --git a/static/img/honbra.png b/static/img/88x31/honbra.png
similarity index 100%
rename from static/img/honbra.png
rename to static/img/88x31/honbra.png
diff --git a/static/img/88x31/index.json b/static/img/88x31/index.json
new file mode 100644
index 0000000..123a32d
--- /dev/null
+++ b/static/img/88x31/index.json
@@ -0,0 +1,70 @@
+[
+  {
+    "path": "/res/img/88x31/abc.gif",
+    "location": "https://www.mozilla.org/en-US/firefox/"
+  },
+  {
+    "path": "/res/img/88x31/adryd.png",
+    "location": "https://adryd.com/"
+  },
+  {
+    "path": "/res/img/88x31/cbax.gif",
+    "location": "https://cbax.dev/"
+  },
+  {
+    "path": "/res/img/88x31/dam.gif",
+    "location": "https://damcraft.de/"
+  },
+  {
+    "path": "/res/img/88x31/eva.gif",
+    "location": "https://kibty.town/"
+  },
+  {
+    "path": "/res/img/88x31/honbra.png",
+    "location": "https://honbra.com/"
+  },
+  {
+    "path": "/res/img/88x31/kofi.gif",
+    "location": "https://ko-fi.com/mrcbax"
+  },
+  {
+    "path": "/res/img/88x31/mat.png",
+    "location": "https://matdoes.dev/"
+  },
+  {
+    "path": "/res/img/88x31/neovim.gif",
+    "location": "https://neovim.io/"
+  },
+  {
+    "path": "/res/img/88x31/notnite.gif",
+    "location": "https://notnite.com/"
+  },
+  {
+    "path": "/res/img/88x31/powered_by_alpine.gif",
+    "location": "https://alpinelinux.org/"
+  },
+  {
+    "path": "/res/img/88x31/shwecky.png",
+    "location": "https://shrecked.dev/"
+  },
+  {
+    "path": "/res/img/88x31/ssi.gif",
+    "location": "https://ssi.fyi/"
+  },
+  {
+    "path": "/res/img/88x31/ublockorigin.png",
+    "location": "https://ublockorigin.com/"
+  },
+  {
+    "path": "/res/img/88x31/dontfeedai.gif",
+    "location": "https://github.com/mrcbax/TeapotFortune"
+  },
+  {
+    "path": "/res/img/88x31/eightyeightthirtyone.png",
+    "location": "https://eightyeightthirty.one/"
+  },
+  {
+    "path": "/res/img/88x31/preserve.gif",
+    "location": "https://archive.org/"
+  }
+]
diff --git a/static/img/kofi.gif b/static/img/88x31/kofi.gif
similarity index 100%
rename from static/img/kofi.gif
rename to static/img/88x31/kofi.gif
diff --git a/static/img/mat.png b/static/img/88x31/mat.png
similarity index 100%
rename from static/img/mat.png
rename to static/img/88x31/mat.png
diff --git a/static/img/neovim.gif b/static/img/88x31/neovim.gif
similarity index 100%
rename from static/img/neovim.gif
rename to static/img/88x31/neovim.gif
diff --git a/static/img/notnite.gif b/static/img/88x31/notnite.gif
similarity index 100%
rename from static/img/notnite.gif
rename to static/img/88x31/notnite.gif
diff --git a/static/img/powered_by_alpine.gif b/static/img/88x31/powered_by_alpine.gif
similarity index 100%
rename from static/img/powered_by_alpine.gif
rename to static/img/88x31/powered_by_alpine.gif
diff --git a/static/img/88x31/preserve.gif b/static/img/88x31/preserve.gif
new file mode 100644
index 0000000000000000000000000000000000000000..0170eef5f0f3ed0cdcba83be4c69755abe817402
GIT binary patch
literal 2046
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

literal 0
HcmV?d00001

diff --git a/static/img/shwecky.png b/static/img/88x31/shwecky.png
similarity index 100%
rename from static/img/shwecky.png
rename to static/img/88x31/shwecky.png
diff --git a/static/img/ssi.gif b/static/img/88x31/ssi.gif
similarity index 100%
rename from static/img/ssi.gif
rename to static/img/88x31/ssi.gif
diff --git a/static/img/ublockorigin.png b/static/img/88x31/ublockorigin.png
similarity index 100%
rename from static/img/ublockorigin.png
rename to static/img/88x31/ublockorigin.png
diff --git a/templates/blog_list.html b/templates/blog_list.html
index 100fdde..99f1cc2 100644
--- a/templates/blog_list.html
+++ b/templates/blog_list.html
@@ -2,8 +2,10 @@
 {% block content %}
 <article class="box box-pop">
 {% for (slug, post) in posts %}
-  {% if loop.first %}<div class="new_callout">NEW!</div>{% endif %}
   <a class="fancy" href="/blog/{{ slug }}"><h2>{{ post.title }}</h2></a>
+  {% if loop.first %}
+    <span class="badge">NEW</span>
+  {% endif %}
   <p>{{ post.description }}</p>
 {% endfor %}
 </article>
diff --git a/templates/buttons.html b/templates/buttons.html
new file mode 100644
index 0000000..eb8d65c
--- /dev/null
+++ b/templates/buttons.html
@@ -0,0 +1,8 @@
+{% extends "base.html" %}
+{% block content %}
+<article class="box box-pop eex31-container">
+{% for button in buttons %}
+<a href="{{ button.location }}"><img class="eex31" src="{{ button.path }}"></img></a>
+{% endfor %}
+</article>
+{% endblock %}
diff --git a/templates/footer.html b/templates/footer.html
index 23df581..ade9c36 100644
--- a/templates/footer.html
+++ b/templates/footer.html
@@ -1,3 +1,4 @@
 <footer>
-  <p>Copyright 2024 cbax</p>
+  <p>©2024 cbax</p>
+  <a class="fancy" href="/buttons">BUTTONS!</a>
 </footer>
diff --git a/templates/index.html b/templates/index.html
index 32cb0fe..d7dd712 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -1,69 +1,15 @@
-<!DOCTYPE html>
-<html lang="en">
-  <head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1">
-    <title>CBAX dot DEV</title>
-    <style>
-      {{styles}}
-    </style>
-  </head>
-  <body>
-    <div class="container">
-      <div class="main">
-        <div id="card">
-          <span>
-            <h1>cbax&nbsp;❲.&nbsp;❳&nbsp;dev</h1>
-          </span>
-          <br>
-          <hl></hl>
-          <br>
-          <fieldset>
-            <legend>Contacts & Links</legend>
-            <table>
-              <tbody>
-                <tr>
-                  <td>Email</td>
-                  <td>me (at) cbax dot dev</td>
-                </tr>
-                <tr>
-                  <td>GitHub</td>
-                  <td><a href="//github.com/mrcbax" class="fancy">mrcbax</a></td>
-                </tr>
-                <tr>
-                  <td>Blog</td>
-                  <td><a href="//computeco.de" class="fancy">ComputeCode</a></td>
-                </tr>
-              </tbody>
-            </table>
-          </fieldset>
-          <fieldset>
-            <legend>About</legend>
-            <ul>
-              <li>42U homelab owner <a class="fancy" href="/homelab">See Details</a></li>
-              <li>Amateur radio operator</li>
-              <li>AS202239 - 44net member</li>
-              <li>Retro-tech enthusiast</li>
-            </ul>
-          </fieldset>
-        </div>
-      </div>
-      <footer>
-        <a href="//cbax.dev"><img src="/res/img/cbax.gif"/></a>
-        <a href="//ssi.fyi"><img src="/res/img/ssi.gif"/></a>
-        <a href="//adryd.com"><img src="/res/img/adryd.png"/></a>
-        <a href="//matdoes.dev"><img src="/res/img/mat.png"/></a>
-        <a href="//shrecked.dev"><img src="/res/img/shwecky.png"/></a>
-        <a href="//honbra.com"><img src="/res/img/honbra.png"/></a>
-        <a href="//notnite.com"><img src="/res/img/notnite.gif"/></a>
-	<a href="//damcraft.de"><img src="/res/img/dam.gif"/></a>
-        <a href="//kibty.town"><img src="/res/img/eva.gif"/></a>
-        <a href="//alpinelinux.org"><img src="/res/img/powered_by_alpine.gif"/></a>
-        <a href="//neovim.io"><img src="/res/img/neovim.gif"/></a>
-        <a href="//ublockorigin.com"><img src="/res/img/ublockorigin.png"/></a>
-        <a href="//www.mozilla.org/en-US/firefox/new"><img src="/res/img/abc.gif"/></a>
-        <a href="//ko-fi.com/mrcbax"><img src="/res/img/kofi.gif"/></a>
-      </footer>
-    </div>
-  </body>
-</html>
+{% extends "base.html" %}
+{% block content %}
+<article class="box box-pop">
+<p>This site is currently under construction, you can find the source code <a href="https://git.cbax.dev/cbax/cbax_dev">here</a></p>
+<fieldset>
+  <legend>About Me</legend>
+  <ul>
+    <li>42U homelab owner <a class="fancy" href="/homelab">See Details</a></li>
+    <li>Amateur radio operator</li>
+    <li>AS202239 - 44net member</li>
+    <li>Retro-tech enthusiast</li>
+  </ul>
+</fieldset>
+</article>
+{% endblock %}
diff --git a/templates/nav.html b/templates/nav.html
index 2cc7145..7a9f059 100644
--- a/templates/nav.html
+++ b/templates/nav.html
@@ -1,3 +1,5 @@
-<nav>
-  <a class="fancy" href="/">Home</a>
+<nav class="box box-stealth">
+  <a class="button hover-button button-stealth" href="/">Home</button>
+  <a class="button hover-button button-stealth nav-title" href="/">CBAX.DEV</a>
+  <a class="button hover-button button-stealth" href="/blog">Blog</a>
 </nav>