diff --git a/content/index.smd b/content/index.smd
index 301eb71..a4912fd 100644
--- a/content/index.smd
+++ b/content/index.smd
@@ -2,8 +2,7 @@
 .title = "Work in Progress",
 .author = "Jakob Speer",
 .date = @date("2025-07-20"),
-.layout = "root.shtml",
+.layout = "home.shtml",
 .draft = false,
 .description = "Work in Progress"
 ---
-
diff --git a/content/notes/markdown-overview.smd b/content/notes/markdown-overview.smd
index 0d56c27..691b7bd 100644
--- a/content/notes/markdown-overview.smd
+++ b/content/notes/markdown-overview.smd
@@ -2,9 +2,12 @@
 .title = "Markdown Overview",
 .author = "Jakob Speer",
 .date = @date("2025-07-22"),
-.layout = "root.shtml",
-.draft = false,
-.description = "An overview over the supported Markdown features"
+.layout = "note.shtml",
+.draft = true,
+.description = "An overview over the supported Markdown features",
+.custom = {
+    .latex = true,
+}
 ---
 
 Learn how to apply basic formatting to your notes, using [Markdown](https://daringfireball.net/projects/markdown/). For more advanced formatting syntax, refer to [Advanced formatting syntax](https://help.obsidian.md/advanced-syntax).
diff --git a/layouts/home.shtml b/layouts/home.shtml
new file mode 100644
index 0000000..cf6c60a
--- /dev/null
+++ b/layouts/home.shtml
@@ -0,0 +1,8 @@
+<extend template="root.shtml">
+
+<title id="title" :text="$page.title.suffix(' | ', $site.title)"></title>
+
+<main id="main">
+  <h1 :text="$page.title"></h1>
+  <div :html="$page.content()"></div>
+</main>
diff --git a/layouts/note.shtml b/layouts/note.shtml
new file mode 100644
index 0000000..3a1102d
--- /dev/null
+++ b/layouts/note.shtml
@@ -0,0 +1,27 @@
+<extend template="root.shtml">
+
+<title id="title" :text="$page.title.suffix(' | ', $site.title)"></title>
+
+<main id="main">
+  <h1 :text="$page.title"></h1>
+  <h5>
+    Created on:
+    <span :text="$page.date.format('2006-01-02')">
+    </span>
+  </h5>
+  <div :html="$page.content()"></div>
+  <ctx :if="$page.footnotes?()">
+    <div class="footnotes">
+      <ol :loop="$if">
+        <li id="$loop.it.def_id">
+          <div class="footnote"><ctx :html="$loop.it.html()"></ctx></div>
+          <ctx :loop="$loop.it.ref_ids">
+            <div class="back">
+              <a href="$loop.it.prefix('#')"><i class="ph-bold ph-arrow-up"></i>Back</a>
+            </div>
+          </ctx>
+        </li>
+      </ol>
+    </div>
+  </ctx>
+</main>
diff --git a/layouts/root.shtml b/layouts/templates/root.shtml
similarity index 64%
rename from layouts/root.shtml
rename to layouts/templates/root.shtml
index 4936790..87c84fe 100644
--- a/layouts/root.shtml
+++ b/layouts/templates/root.shtml
@@ -2,7 +2,7 @@
 <html lang="en">
   <head>
     <meta charset="UTF-8">
-    <title :text="$page.title.suffix(' | ', $site.title)"></title>
+    <title id="title"><super></title>
     <link rel="stylesheet" href="$build.asset('altagos.css').link()">
     <!-- Meta -->
     <meta name="viewport" content="width=device-width, initial-scale=1">
@@ -16,29 +16,12 @@
     <link rel="manifest" href="$site.asset('favicon/site.webmanifest').link()">
     <!-- Phsophor Icons -->
     <link rel="stylesheet" href="$site.asset('phosphor-icons/bold.css').link()">
-    <!-- mathtex -->
-    <link rel="stylesheet" href="$site.asset('math/Temml-Local.css').link()">
   </head>
   <body>
     <header></header>
-    <div class="content">
-      <main>
-        <h1 :text="$page.title"></h1>
-        <div :html="$page.content()"></div>
-        <ctx :if="$page.footnotes?()">
-          <div class="footnotes">
-            <ol :loop="$if">
-              <li id="$loop.it.def_id">
-                <div class="footnote"><ctx :html="$loop.it.html()"></ctx></div>
-                <ctx :loop="$loop.it.ref_ids">
-                  <div class="back">
-                    <a href="$loop.it.prefix('#')"><i class="ph-bold ph-arrow-up"></i>Back</a>
-                  </div>
-                </ctx>
-              </li>
-            </ol>
-          </div>
-        </ctx>
+    <content>
+      <main id="main">
+        <super>
       </main>
       <footer>
         <div>
@@ -65,8 +48,14 @@
           <p>&copy; 2025 Jakob Speer</p>
         </div>
       </footer>
-    </div>
-    <script defer src="$site.asset('math/temml.min.js').link()"></script>
-    <script defer src="$site.asset('math/render-mathtex.js').link()"></script>
+    </content>
+    <ctx :if="$page.custom.get?('latex')">
+      <!-- mathtex -->
+      <div :if="$if">
+        <link rel="stylesheet" href="$site.asset('math/Temml-Local.css').link()">
+        <script defer src="$site.asset('math/temml.min.js').link()"></script>
+        <script defer src="$site.asset('math/render-mathtex.js').link()"></script>
+      </div>
+    </ctx>
   </body>
-</html>
\ No newline at end of file
+</html>
diff --git a/style/base/layout.scss b/style/base/layout.scss
index dd0370d..9ef5232 100644
--- a/style/base/layout.scss
+++ b/style/base/layout.scss
@@ -18,7 +18,7 @@ header {
     background-color: var(--palette10);
 }
 
-.content {
+content {
     margin: auto;
     max-width: var(--content-max-width);
     height: var(--content-height);
