summaryrefslogtreecommitdiff
path: root/clams-server/src/main/resources/templates
diff options
context:
space:
mode:
authorElias Haugsbakk <[email protected]>2026-07-01 21:18:58 +0200
committerElias Haugsbakk <[email protected]>2026-07-02 00:11:30 +0200
commit19c9cb227b343377853321e2cdc4285b2ea23e3a (patch)
tree697b1784c0e50b7d84a0ef8dcf2cfbba8e4357bc /clams-server/src/main/resources/templates
parent5b1e3672a1e6d9f7b54ed4267e8715f5dc3bb55a (diff)
implement blog index page with featured and all posts
Diffstat (limited to 'clams-server/src/main/resources/templates')
-rw-r--r--clams-server/src/main/resources/templates/404.html51
-rw-r--r--clams-server/src/main/resources/templates/blog.html33
-rw-r--r--clams-server/src/main/resources/templates/home.html53
-rw-r--r--clams-server/src/main/resources/templates/layout.html23
-rw-r--r--clams-server/src/main/resources/templates/post.html23
-rw-r--r--clams-server/src/main/resources/templates/projects.html27
6 files changed, 69 insertions, 141 deletions
diff --git a/clams-server/src/main/resources/templates/404.html b/clams-server/src/main/resources/templates/404.html
index 6bbcecd..bb4c4d5 100644
--- a/clams-server/src/main/resources/templates/404.html
+++ b/clams-server/src/main/resources/templates/404.html
@@ -1,41 +1,14 @@
-<!DOCTYPE html>
-<html>
-<head>
- <meta charset="UTF-8">
- <title>404 - Page Not Found</title>
- <link rel="stylesheet" href="/css/common.css">
- <style>
- .error-container {
- text-align: center;
- margin-top: 100px;
- }
- .error-code {
- font-size: 5rem;
- margin-bottom: 10px;
- opacity: 0.3;
- }
- </style>
-</head>
-<body>
+{% extends "templates/layout.html" %}
- <main class="main-container">
- <div class="error-container">
- <div class="error-code">404</div>
- <h1>Page Not Found</h1>
- <p>The page you are looking for does not exist.</p>
- <p style="margin-top: 40px;">
- <a href="/">Return to Home Page</a>
- </p>
- </div>
- </main>
-
- <footer>
- <p>
- <span class="footer-left"><a href="/">eliashaugsbakk.xyz</a></span>
- <span class="footer-separator">|</span>
- <span class="footer-right"><a href="mailto:[email protected]">[email protected]</a></span>
+{% block content %}
+<main class="main-container">
+ <div class="error-container">
+ <div class="error-code">404</div>
+ <h1>Page Not Found</h1>
+ <p>The page you are looking for does not exist.</p>
+ <p class="error-home-link">
+ <a href="/">Return to Home Page</a>
</p>
- </footer>
-
-</body>
-</html>
+ </div>
+</main>
+{% endblock %}
diff --git a/clams-server/src/main/resources/templates/blog.html b/clams-server/src/main/resources/templates/blog.html
index 168cfe1..200a144 100644
--- a/clams-server/src/main/resources/templates/blog.html
+++ b/clams-server/src/main/resources/templates/blog.html
@@ -1,13 +1,6 @@
-<!DOCTYPE html>
-<html>
-<head>
- <meta charset="UTF-8">
- <title>Elias Haugsbakk's Blog</title>
- <link rel="stylesheet" href="/css/common.css">
- <link rel="stylesheet" href="/css/blog.css">
-</head>
-<body>
+{% extends "templates/layout.html" %}
+{% block content %}
<main class="main-container">
<header>
<h1>Elias Haugsbakk's Blog</h1>
@@ -21,28 +14,18 @@
<div class="content-grid">
<div class="left-column">
- <section id="all">
- <h2>{{ all_posts_title }}</h2>
- <!-- Tells Pebble to trust your pre-grouped HTML links -->
- {{ all_posts_by_year | raw }}
+ <section id="all" class="blog-section">
+ <h2>All Posts</h2>
+ {{ all_posts| raw }}
</section>
</div>
<div class="right-column">
- <section id="recent">
- <h2>Recent</h2>
+ <section id="recent" class="blog-section">
+ <h2>Featured</h2>
{{ recent_posts | raw }}
</section>
</div>
</div>
</main>
-
-<footer>
- <p>
- <span class="footer-left"><a href="/">eliashaugsbakk.xyz</a></span>
- <span class="footer-separator">|</span>
- <span class="footer-right"><a href="mailto:[email protected]">[email protected]</a></span>
- </p>
-</footer>
-</body>
-</html>
+{% endblock %}
diff --git a/clams-server/src/main/resources/templates/home.html b/clams-server/src/main/resources/templates/home.html
index 199ae29..b5ff1d6 100644
--- a/clams-server/src/main/resources/templates/home.html
+++ b/clams-server/src/main/resources/templates/home.html
@@ -1,39 +1,22 @@
-<!DOCTYPE html>
-<html>
-<head>
- <meta charset="UTF-8">
- <title>Elias Haugsbakk</title>
- <link rel="stylesheet" href="/css/common.css">
- <link rel="stylesheet" href="/css/home.css">
-</head>
-<body>
+{% extends "templates/layout.html" %}
- <main class="main-container">
- <h1>Elias Haugsbakk's Webpage</h1>
-
- <div class="content-grid">
- <div class="left-column">
- <img src="/images/elias_haugsbakk.JPEG" alt="Image of Elias Haugsbakk" class="profile-img">
- <p>Hello! I am Elias and this is my webpage.</p>
- </div>
+{% block content %}
+<main class="main-container">
+ <h1>Elias Haugsbakk's Webpage</h1>
- <div class="right-column">
- <ul>
- <li><a href="/blog">Blog</a> <span class="description">-- personal projects and thoughts</span></li>
- <li><a href="https://github.com/eliashaugsbakk">GitHub</a> <span class="description">-- home for my code</span></li>
- <li><a href="/projects">Projects</a> <span class="description">-- the projects I have worked on</span></li>
- </ul>
- </div>
+ <div class="content-grid">
+ <div class="left-column">
+ <img src="/images/elias_haugsbakk.JPEG" alt="Image of Elias Haugsbakk" class="profile-img">
+ <p>Hello! I am Elias and this is my webpage.</p>
</div>
- </main>
- <footer>
- <p>
- <span class="footer-left"><a href="/">eliashaugsbakk.xyz</a></span>
- <span class="footer-separator">|</span>
- <span class="footer-right"><a href="mailto:[email protected]">[email protected]</a></span>
- </p>
- </footer>
-
-</body>
-</html>
+ <div class="right-column">
+ <ul>
+ <li><a href="/blog">Blog</a> <span class="description">-- personal projects and thoughts</span></li>
+ <li><a href="https://github.com/eliashaugsbakk">GitHub</a> <span class="description">-- home for my code</span></li>
+ <li><a href="/projects">Projects</a> <span class="description">-- the projects I have worked on</span></li>
+ </ul>
+ </div>
+ </div>
+</main>
+{% endblock %}
diff --git a/clams-server/src/main/resources/templates/layout.html b/clams-server/src/main/resources/templates/layout.html
new file mode 100644
index 0000000..4c8b8dc
--- /dev/null
+++ b/clams-server/src/main/resources/templates/layout.html
@@ -0,0 +1,23 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+ <meta charset="UTF-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <title>{{ page_title }}</title>
+ <link rel="stylesheet" href="/css/common.css">
+ <link rel="stylesheet" href="/css/{{ page_css }}.css">
+</head>
+<body>
+
+{% block content %}{% endblock %}
+
+<footer>
+ <p>
+ <span class="footer-left"><a href="/">eliashaugsbakk.xyz</a></span>
+ <span class="footer-separator">|</span>
+ <span class="footer-right"><a href="mailto:[email protected]">[email protected]</a></span>
+ </p>
+</footer>
+
+</body>
+</html>
diff --git a/clams-server/src/main/resources/templates/post.html b/clams-server/src/main/resources/templates/post.html
index 85f8977..40444b2 100644
--- a/clams-server/src/main/resources/templates/post.html
+++ b/clams-server/src/main/resources/templates/post.html
@@ -1,13 +1,6 @@
-<!DOCTYPE html>
-<html>
-<head>
- <meta charset="UTF-8">
- <title>{{ title }} - Elias Haugsbakk</title>
- <link rel="stylesheet" href="/css/common.css">
- <link rel="stylesheet" href="/css/post.css">
-</head>
-<body>
+{% extends "templates/layout.html" %}
+{% block content %}
<main class="main-container">
<header class="post-header">
<span class="post-date">{{ published_date }}</span>
@@ -25,14 +18,4 @@
{{ next_post_link | raw }}
</nav>
</main>
-
-<footer>
- <p>
- <span class="footer-left"><a href="/">eliashaugsbakk.xyz</a></span>
- <span class="footer-separator">|</span>
- <span class="footer-right"><a href="mailto:[email protected]">[email protected]</a></span>
- </p>
-</footer>
-
-</body>
-</html>
+{% endblock %}
diff --git a/clams-server/src/main/resources/templates/projects.html b/clams-server/src/main/resources/templates/projects.html
index 8af0538..bab2a05 100644
--- a/clams-server/src/main/resources/templates/projects.html
+++ b/clams-server/src/main/resources/templates/projects.html
@@ -1,13 +1,6 @@
-<!DOCTYPE html>
-<html>
-<head>
- <meta charset="UTF-8">
- <title>Projects - Elias Haugsbakk</title>
- <link rel="stylesheet" href="/css/common.css">
- <link rel="stylesheet" href="/css/projects.css">
-</head>
-<body>
+{% extends "templates/layout.html" %}
+{% block content %}
<main class="main-container">
<header>
<h1>Projects</h1>
@@ -64,24 +57,14 @@
<li>
<strong>Other Project One</strong> - A short one-line description.
<span class="tech-stack-inline">(Bash)</span>
- <a href="#" class="small-link">GitHub</a>
+ <a href="#">GitHub</a>
</li>
<li>
<strong>Other Project Two</strong> - A short one-line description.
<span class="tech-stack-inline">(Python, PostgreSQL)</span>
- <a href="#" class="small-link">GitHub</a>
+ <a href="#">GitHub</a>
</li>
</ul>
</section>
</main>
-
-<footer>
- <p>
- <span class="footer-left"><a href="/">eliashaugsbakk.xyz</a></span>
- <span class="footer-separator">|</span>
- <span class="footer-right"><a href="mailto:[email protected]">[email protected]</a></span>
- </p>
-</footer>
-
-</body>
-</html>
+{% endblock %}
generated by cgit v1.2.3 (git 2.39.1) at 2026-07-28 08:36:55 +0000