summaryrefslogtreecommitdiff
path: root/clams-server/src/main/resources/templates
diff options
context:
space:
mode:
authorElias Haugsbakk <[email protected]>2026-07-01 14:05:14 +0200
committerElias Haugsbakk <[email protected]>2026-07-01 14:05:14 +0200
commitc4da920843972b6571e978cdc9f9278eb87b7398 (patch)
treef972778f7cab4e4b231f5adc7450d590fa6d0fae /clams-server/src/main/resources/templates
parent5ed99f3c87f0337ffac03dd1e45073fbc7f63b68 (diff)
add HTML, CSS and basic routing
Diffstat (limited to 'clams-server/src/main/resources/templates')
-rw-r--r--clams-server/src/main/resources/templates/404.html41
-rw-r--r--clams-server/src/main/resources/templates/blog.html48
-rw-r--r--clams-server/src/main/resources/templates/home.html39
-rw-r--r--clams-server/src/main/resources/templates/post.html38
-rw-r--r--clams-server/src/main/resources/templates/projects.html87
5 files changed, 253 insertions, 0 deletions
diff --git a/clams-server/src/main/resources/templates/404.html b/clams-server/src/main/resources/templates/404.html
new file mode 100644
index 0000000..6bbcecd
--- /dev/null
+++ b/clams-server/src/main/resources/templates/404.html
@@ -0,0 +1,41 @@
+<!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>
+
+ <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>
+ </p>
+ </footer>
+
+</body>
+</html>
diff --git a/clams-server/src/main/resources/templates/blog.html b/clams-server/src/main/resources/templates/blog.html
new file mode 100644
index 0000000..168cfe1
--- /dev/null
+++ b/clams-server/src/main/resources/templates/blog.html
@@ -0,0 +1,48 @@
+<!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>
+
+<main class="main-container">
+ <header>
+ <h1>Elias Haugsbakk's Blog</h1>
+ <p class="intro-text">This is the home page for my blog. The list of blog posts is a diverse collection of some of my writings; if you're just browsing, this might be a good place to start.</p>
+
+ <form action="/blog" method="GET" class="search-form">
+ <input type="text" name="search" value="{{ search_value }}" placeholder="Search posts..." aria-label="Search blog posts">
+ <button type="submit">Search</button>
+ </form>
+ </header>
+
+ <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>
+ </div>
+
+ <div class="right-column">
+ <section id="recent">
+ <h2>Recent</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>
diff --git a/clams-server/src/main/resources/templates/home.html b/clams-server/src/main/resources/templates/home.html
new file mode 100644
index 0000000..199ae29
--- /dev/null
+++ b/clams-server/src/main/resources/templates/home.html
@@ -0,0 +1,39 @@
+<!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>
+
+ <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>
+
+ <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>
+
+ <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
new file mode 100644
index 0000000..85f8977
--- /dev/null
+++ b/clams-server/src/main/resources/templates/post.html
@@ -0,0 +1,38 @@
+<!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>
+
+<main class="main-container">
+ <header class="post-header">
+ <span class="post-date">{{ published_date }}</span>
+ <span class="post-author">{{ author }}</span>
+ </header>
+
+ <h1>{{ title }}</h1>
+
+ <article class="post-content">
+ {{ content | raw }}
+ </article>
+
+ <nav class="post-nav">
+ {{ previous_post_link | raw }}
+ {{ 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>
diff --git a/clams-server/src/main/resources/templates/projects.html b/clams-server/src/main/resources/templates/projects.html
new file mode 100644
index 0000000..8af0538
--- /dev/null
+++ b/clams-server/src/main/resources/templates/projects.html
@@ -0,0 +1,87 @@
+<!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>
+
+<main class="main-container">
+ <header>
+ <h1>Projects</h1>
+ </header>
+
+ <section class="projects-category">
+ <h2>Featured Projects</h2>
+
+ <div class="project-item">
+ <div class="content-grid">
+ <div class="left-column">
+ <h3>Project One Name</h3>
+ <div class="tech-stack">
+ <span class="tag">Java</span>
+ <span class="tag">SQLite</span>
+ </div>
+ <p>Short project description / introduction.</p>
+ <div class="project-links">
+ <a href="#">GitHub</a> | <a href="#">Live Demo</a>
+ </div>
+ </div>
+ <div class="right-column">
+ <div class="project-placeholder">
+ <span>Image Placeholder</span>
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="project-item">
+ <div class="content-grid">
+ <div class="left-column">
+ <h3>Project Two Name</h3>
+ <div class="tech-stack">
+ <span class="tag">Rust</span>
+ </div>
+ <p>Short project description / introduction.</p>
+ <div class="project-links">
+ <a href="#">GitHub</a> | <a href="#">Read More</a>
+ </div>
+ </div>
+ <div class="right-column">
+ <div class="project-placeholder">
+ <span>Image Placeholder</span>
+ </div>
+ </div>
+ </div>
+ </div>
+ </section>
+
+ <section class="projects-category">
+ <h2>Other Projects</h2>
+ <ul class="simple-project-list">
+ <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>
+ </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>
+ </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>
generated by cgit v1.2.3 (git 2.39.1) at 2026-07-28 08:36:55 +0000