From 67a6fe21f37f8644e7ef45028168b1e4932ac654 Mon Sep 17 00:00:00 2001
From: Mitja Felicijan <mitja.felicijan@gmail.com>
Date: Fri, 19 Sep 2025 23:22:30 +0200
Subject: Cleaned up theme

---
 templates/base.html | 171 +++++++++++++++++++---------------------------------
 1 file changed, 63 insertions(+), 108 deletions(-)

(limited to 'templates/base.html')

diff --git a/templates/base.html b/templates/base.html
index d449492..ccbf4f4 100644
--- a/templates/base.html
+++ b/templates/base.html
@@ -11,150 +11,105 @@
 		<link href="data:image/x-icon;base64,AAABAAEAEBAAAAEAIABoBAAAFgAAACgAAAAQAAAAIAAAAAEAIAAAAAAAAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAL69vf8AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAv76+/8LBwQkAAAAAAAAAAAAAAAC+vb3/AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAL+9vf/Bv78JAAAAAAAAAAAAAAAAu7q6/wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAC7ubr/vr29CAAAAAAAAAAAy8nJAZ6foP8AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAnqGj/6GipAoAAAAAHLjU/xcXHf/BwsL/I8XY/yPK3v8XGiD/IbjL/yPF2f8XGiD/Fxkf/yLF2f8gnK3/Fxog/62ztv8fwNf/FRcd/x271v8mz93/GRsi/xkXHf8p097/GiIp/xobIv8p0t3/KdPe/xocIv8fYmr/KNPe/xoZH/8aHCL/J87c/xy81/8VFxz/IsPZ/8zS0/8XGiD/Ir/R/yPH2/8XGiD/Fxkf/yPH2/8dd4T/GBog/yPJ3f8jyNr/uru9/xcUGv8cudb/EhITDKi5vRKlvMP/RUpOERwcHRAdOj4QHTk8EBwdHRAdNTgQHTo/EBwcHRAcHB0QSGduEKW4vf+koqQfHzg+EBqz0ewSFRv7EyMr/xq51vsTERb7ExUb+xq41fsau9j7ExUb+xiPp/sZudb7ExUb+xMVG/sZuNX/GKvI/BIUGfMdvdn/IrfL/xcaIP8n1eb/J9Dh/xkcIf8ZGR7/J8/f/xxCSv8ZGyH/J9Dg/ybQ4P8ZHCL/FSQs/yPK3/8UExj/GE1b/ybS5P8ZGB7/Ghwj/ynW5P8p2Ob/Ghwi/yWrtv8p1eH/Ghwi/xocIv8p1uT/J8XT/xkcIv8m1un/Hb7d/xUYH/8hzOr/HtHu/xcaIf8XGB//I8vi/xgxOv8XGSD/I8rg/yPK4P8XGiD/GUFL/yPP6f8SERj/Fhkh/x3A4f8AAAAAJ2f9/ydr//8mZPH/AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAlYu38J2v//ydo/f8AAAAAAAAAAAd8/fkFqf//Iob8sAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAMY39awWr//8FfP3/AAAAAAAAAAAFm/7/SfD//wR+/f8AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAOB/f9B7v//BaX+/wAAAAAAAAAAQ878SAyZ/v9n1v4KAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAADu9v8DDJb+/z3N/XgAAAAA3/sAAN/7AADf+wAA3/sAAAAAAAAAAAAAAAAAAN/7AAAAAAAAAAAAAAAAAAAAAAAAj/EAAI/5AACP8QAA3/sAAA==" rel="icon" type="image/x-icon" />
 
 		<style>
+			* { box-sizing: border-box; }
+
 			:root {
-				--base-background: white;
-				--base-color: black;
-				--link-color: blue;
-				--first-child-width: 150px;
-				--primary-color: gainsboro;
-				--secondary-color: black;
-				--tertiary-color: #eee;
-				--code-color: #f9f9f9;
-				--border-width: 1px;
-				--header-color: black;
-				--header-border-width: 2px;
+				--border-color: gainsboro;
 				--content-width: 840px;
+				--primary-color: blue;
 			}
 
-			* { box-sizing: border-box; }
+			::selection { 
+				background: var(--primary-color);
+				color: #ffffff;
+			}
 
-			html { scroll-padding-top: 1.5em; }
-			body { font-family: sans-serif; padding: 0 1em; line-height: 160%; display: flex; flex-direction: column; gap: 4em; background: var(--base-background); color: var(--base-color); }
-			table { width: 100%; border: var(--border-width) solid var(--primary-color); border-collapse: collapse; }
-			table thead { background: var(--primary-color); border: var(--border-width) solid var(--secondary-color); color: var(--header-color); }
-			table td, table th { text-align: left; padding: 0.3em 0.5em; }
-			table tbody tr { border-bottom: var(--border-width) solid var(--primary-color); vertical-align: middle; }
-			table tr td:first-child { width: var(--first-child-width); }
-			table.normal tr td:first-child { width: auto; }
-			table td.tags { display: flex; gap: 0.5em; justify-content: flex-end; align-items: center; }
-			table td.tags mark { padding: 0 0.4em; background: var(--primary-color); font-size: small; }
-
-			a { color: var(--link-color); text-decoration: none; }
-			a:hover { text-decoration: underline; }
+			body { font-family: sans-serif; max-width: var(--content-width); margin: 0 auto; line-height: 160%; }
+
+			header { margin-block-start: 1em; margin-block-end: 4em; }
+			header nav { display: flex; gap: 1em; align-items: center; padding: 0.5em 0; border-bottom: 2px solid black; }
+			header nav a { color: black; }
+			header nav span.title { font-weight: bold; }
 
-			header { border-bottom: var(--header-border-width) solid var(--secondary-color); padding: 0.5em 0; }
-			header div { min-width: var(--content-width); max-width: var(--content-width); display: flex; }
-			header div nav:first-child { display: flex; width: var(--first-child-width); }
-			header div nav:nth-child(2) { display: flex; gap: 1.5em; }
-			header div nav:nth-child(2) a { color: var(--base-color); }
-			header div nav:last-child { text-align: right; margin-left: auto; display: flex; }
+			section { margin-block-start: 3em; margin-block-end: 3em; }
 
-			footer { color: gray; }
-			footer div { min-width: var(--content-width); max-width: var(--content-width); }
-			footer a { color: gray; text-decoration: underline; }
+			footer { font-size: small; }
+
+			ul.post-list { padding: 0em; }
+			ul.post-list li { display: flex; gap: 1em; align-items: center; padding: 0.25em 0; }
+			ul.post-list li time { min-width: 50px; }
+
+			a { color: var(--primary-color); text-decoration: none; }
+			a:hover { text-decoration: underline; }
 
-			main {  min-width: var(--content-width); max-width: var(--content-width); display: flex; gap: 2em; flex-direction: column; }
 			h1, h2, h3, h4 { font-size: initial; }
 			article h2, article h3, article h4 { margin-block-start: 2.5em; }
 			article h1 { font-size: 130%; line-height: 110%; }
+			article code { background: yellow; padding: 0 0.2em; }
+			article pre { border: 1px solid var(--border-color); padding: 1em; line-height: 140%; text-wrap: nowrap; overflow-x: auto; }
+			article pre > code { background: initial; }
 
 			img, video, audio { max-width: 100%; }
-			figure { display: flex; justify-content: center; margin: 2.5em 0; }
-			img, video { border: var(--border-width) solid var(--primary-color); padding: 0.5em; }
-			img.no-border, video.no-border, img[src$="?no-border"] { border: 0; padding: 0; }
+			figure { display: flex; justify-content: center; margin: 1.5em 0; }
 
-			pre { background: var(--code-color)!important; border: var(--border-width) solid var(--primary-color); text-wrap: wrap; padding: 1.0em; line-height: 170%; text-wrap: nowrap; overflow-x: auto; }
-			code { background: var(--code-color); padding: 0 0.2em; }
-			pre code { padding: 0; }
+			table { width: 100%; border: 1px solid var(--border-color); border-collapse: collapse; }
+			table thead { background: var(--border-color); border: 1px solid black; }
+			table td, table th { text-align: left; padding: 0.4em 0.6em; }
+			table tbody tr { border-bottom: 1px solid var(--border-color); }
 
-			.capitalize { text-transform: capitalize; }
-			
-			.text-left { text-align: left; }
-			.text-center { text-align: center; }
-			.text-right { text-align: right; }
+			.tags mark { font-family: monospace; padding: 0 0.2em; }
+			.static-prefix { width: 7em; }
 
-			.content-center { margin: 0 auto; }
+			.multicolumn-list { column-count: 3; column-gap: 3em; }
+			.multicolumn-list a { display: block; margin-bottom: 0.5rem; break-inside: avoid; }
 
-			#content_align_button { display: none; }
+			.project-release table tr td:last-child { text-align: right; }
+			.project-release table tr th:last-child { text-align: right; }
+			.project-list ul { column-count: 3; column-gap: 3em; }
+			.github-link p { display: flex; align-items: center; gap: 0.3em; }
+			.github-link p img { border: 0; padding: 0; height: 15px; }
 
 			/* Hotfixes for strange behaviour. */
 			article iframe { margin: 0!important; }
 			pre code span { display: initial !important; }
 
+			@media only screen and (max-width: 860px) {
+				body { margin: auto; padding: 1em; }
+				ul.post-list li time { display: none; }
+				.multicolumn-list { column-count: 2; }
+				.project-list ul { column-count: 2; }
+				.hide-on-mobile { display: none; }
+			}
+
 			@media print {
 				header, footer { display: none; }
 			}
 		</style>
-		<script defer src="https://app.tinyanalytics.io/pixel/isfRNEahfHiS2Ttp"></script>
+
+		<!-- <script defer src="https://app.tinyanalytics.io/pixel/isfRNEahfHiS2Ttp"></script> -->
 	</head>
 
 	<body>
 		<header>
-			<div class="content">
-				<nav>
-					<span><strong>Navigation</strong></span>
-				</nav>
-				<nav>
-					<span><a href="/">Home</a></span>
-					<span><a href="/projects.html">Projects</a></span>
-					<span><a href="https://github.com/mitjafelicijan/probe" target="_blank">Probe</a></span>
-					<span><a href="https://github.com/mitjafelicijan" target="_blank">Code</a></span>
-					<span><a href="https://github.com/mitjafelicijan/dotfiles" target="_blank">Dotfiles</a></span>
-					<span><a href="/curriculum-vitae.html">CV</a></span>
-					<span><a href="/feed.xml">RSS</a></span>
-				</nav>
-				<nav>
-					<button id="content_align_button">center</button>
-					<script>content_align_button.style.display = "block";</script>
-				</nav>
-			</div>
+			<nav>
+				<span class="title hide-on-mobile static-prefix">Navigation</span>
+				<a href="/">Home</a>
+				<a href="/projects.html">Projects</a>
+				<a href="https://github.com/mitjafelicijan/probe" target="_blank">Probe</a>
+				<a href="https://github.com/mitjafelicijan" target="_blank">Code</a>
+				<a href="https://github.com/mitjafelicijan/dotfiles" target="_blank" class="hide-on-mobile">Dotfiles</a>
+				<a href="/curriculum-vitae.html">CV</a>
+				<a href="/feed.xml" class="hide-on-mobile">RSS</a>
+			</nav>
 		</header>
 
-		<main class="content">
+		<main>
 			{{ block "content" . }}{{ end }}
 		</main>
 
 		<footer>
-			<div class="content">
-				<p>You can write me an email at <a href="mailto:mitja.felicijan@gmail.com">mitja.felicijan@gmail.com</a> or catch up with me <a href="https://telegram.me/mitjafelicijan" target="_blank">on Telegram</a>.</p>
-				<p>This page's is also available as <a href="/feed.xml" target="_blank">RSS feed</a>. Page was built with <a href="https://github.com/mitjafelicijan/jbmafp" target="_blank">jbmafp</a>.</p>
-			</div>
+			<p>You can write me an email at <a href="mailto:mitja.felicijan@gmail.com">mitja.felicijan@gmail.com</a> or catch up with me <a href="https://telegram.me/mitjafelicijan" target="_blank">on Telegram</a>.</p>
+			<p>This page's is also available as <a href="/feed.xml" target="_blank">RSS feed</a>. Page was built with <a href="https://github.com/mitjafelicijan/jbmafp" target="_blank">jbmafp</a>.</p>
 		</footer>
-
-		<script>
-			function align_content_left() {
-				document.querySelectorAll(".content").forEach(el => {
-					el.classList.remove("content-center");
-				});
-				content_align_button.innerText = "center";
-				localStorage.setItem("content-align", "left");
-			}
-
-			function align_content_center() {
-				document.querySelectorAll(".content").forEach(el => {
-					el.classList.add("content-center");
-				});
-				content_align_button.innerText = "left";
-				localStorage.setItem("content-align", "center");
-			}
-
-			{
-				let initial_align = localStorage.getItem("content-align");
-				if (!initial_align) {
-					localStorage.setItem("content-align", "left");
-					initial_align = localStorage.getItem("content-align");
-				}
-
-				if (initial_align == "center") {
-					align_content_center();
-				}
-			}
-
-			content_align_button.onclick = function(e) {
-				const align = localStorage.getItem("content-align");
-				if (align == "center") { align_content_left(); }
-				if (align == "left") { align_content_center(); }
-			}
-		</script>
 	</body>
 </html>
-- 
cgit v1.2.3