Initial Release

This commit is contained in:
2026-05-24 19:52:45 -07:00
commit 8242fdbbb3
181 changed files with 10119 additions and 0 deletions
@@ -0,0 +1,84 @@
{{ define "ArticleContent" }}
<p class="element-header">Introduction</p>
<p class="element-paragraph">
If you're reading this... I haven't written the article yet :P
</p>
<p class="element-paragraph">
Luctus montes donec mauris. Vehicula suspendisse condimentum massa fringilla at conubia.
Senectus laoreet praesent in, porttitor sollicitudin luctus orci scelerisque egestas malesuada faucibus a.
Arcu imperdiet libero imperdiet nulla libero natoque eu fusce ultricies vehicula nisi.
Torquent lacus sodales inceptos dignissim sed, mauris feugiat erat.
Phasellus at tincidunt sociosqu potenti risus aliquam non litora.
Commodo mi fermentum, id arcu dictum convallis.
Vehicula convallis, proin fames molestie potenti congue penatibus feugiat porttitor.
Habitant justo lacinia, curabitur nascetur!
Dolor nunc accumsan imperdiet penatibus?
Amet cursus faucibus dui vestibulum nascetur quam.
</p>
<div class="element-divider"></div>
<p class="element-header">Prerequisites</p>
<p class="element-paragraph">
Praesent augue ligula amet nisl. Litora lectus consectetur aliquet.
Sociis iaculis dolor nostra pulvinar felis condimentum netus.
Suscipit enim habitant sed eros etiam, ut odio sed.
Fringilla quam tempus nisl natoque parturient dolor curabitur tellus.
Lacus conubia quis inceptos tristique ultricies cum consequat.
Consequat phasellus proin dolor molestie nec quam cursus mollis vel?
Eros tempor sollicitudin tortor litora nunc.
Sem scelerisque semper id ac auctor fusce quis erat imperdiet convallis donec eget!
Pellentesque tempor nunc ipsum imperdiet quam ipsum habitant feugiat.
</p>
<p class="element-subheader">Hosting</p>
<p class="element-paragraph">
Odio nibh penatibus erat sociosqu eget iaculis. Ante curabitur bibendum ligula?
Netus aliquet cursus interdum pharetra. Magnis elementum nunc luctus eu nam sit habitant etiam vestibulum in.
Lacus nisl ullamcorper molestie! Dignissim, vulputate porta pulvinar duis posuere.
</p>
<p class="element-subheader">Domains</p>
<p class="element-paragraph">
Curae; laoreet cum duis turpis, feugiat per integer.
Sit in blandit himenaeos. Penatibus fringilla imperdiet, luctus dapibus elementum.
Felis senectus pulvinar a natoque risus.
</p>
<p class="element-subheader">Credentials</p>
<p class="element-paragraph">
Mauris habitasse nulla accumsan fermentum fermentum.
Magnis amet amet risus senectus in curae;.
Elementum ac montes sagittis vivamus malesuada elementum senectus ultrices scelerisque fusce.
In nulla platea.
</p>
<div class="element-divider"></div>
<p class="element-header">Setup DNS</p>
<p class="element-paragraph">
Nisi vitae vehicula etiam nam auctor, accumsan purus ridiculus molestie.
Ante malesuada condimentum aliquam etiam auctor arcu porttitor parturient nullam accumsan bibendum?
Vitae arcu at mattis. Volutpat himenaeos class vitae elit, luctus sociosqu semper?
Praesent taciti lobortis tortor laoreet magnis tortor sagittis porta facilisi vivamus dictum scelerisque.
Consectetur elit enim malesuada commodo proin facilisi sagittis!
Malesuada quam duis non elit himenaeos sem.
Luctus suspendisse senectus mollis aliquet aliquam pellentesque conubia condimentum suspendisse aptent litora potenti.
Curabitur sociis lacus turpis, laoreet ligula consequat luctus eu auctor auctor sagittis.
Turpis nibh feugiat lorem donec quis bibendum.
Himenaeos sapien interdum aptent.
</p>
<p class="element-header">Setup Linux</p>
<p class="element-paragraph">
Convallis pharetra vitae tincidunt phasellus bibendum porta, praesent dictum aliquet volutpat.
Lobortis semper eget consectetur elementum elit hendrerit natoque mauris taciti ante ac augue.
Ullamcorper viverra vestibulum vehicula nisi metus vestibulum curabitur vehicula et.
Phasellus ligula vitae posuere penatibus ullamcorper lorem phasellus metus.
Scelerisque ac lobortis gravida primis?
Lacus porttitor ullamcorper quisque viverra molestie.
Lacinia bibendum facilisi tempor cubilia felis eros!
Etiam blandit lacinia leo urna.
</p>
{{ end }}
@@ -0,0 +1,48 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="theme-color" content="{{ .Site.Color }}">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="A small corner of the web for odd tech experiments and the occasional questionable idea. Enjoy in moderation!">
<link rel="stylesheet" href="/public/styles/default.css?v={{ .Version }}">
<link rel="stylesheet" href="/public/styles/font_poppins.css?v={{ .Version }}">
{{ block "PageStyles" . }}{{ end }}
<title>{{ .Title }} - {{ .Site.Name }}</title>
<meta property="og:locale" content="{{ .Site.Locale }}">
{{ block "PageHead" . }}{{ end }}
</head>
<body style="--rgb-accent: {{ if .Article }}{{ .Article.Color }}{{ else }}{{ .Site.Color }}{{ end }}">
<div class="layout-wrapper">
<!-- Navigation -->
<div class="layout-navigation effect-caution">
<div class="navigation-header">
<a class="navigation-title effect-docked" href="/">{{ .Site.Name }}</a>
<p class="navigation-description">{{ .Site.Description }}</p>
</div>
<div class="navigation-links" style="--background: url('/public/anchors.gif?v={{ .Version}}');">
<a style="background-position-y: 0%;" class="navigation-item" href="/blog">Blog</a>
<a style="background-position-y: 50%;" class="navigation-item" href="http://git.panca.kz/">Codebase</a>
<a style="background-position-y: 100%;" class="navigation-item" href="http://stickers.panca.kz/">Stickerboard</a>
</div>
<div class="navigation-content">
{{ block "NavContent" . }}{{ end }}
</div>
<div class="navigation-footer">
<a class="footer-item" href="/rss.xml">RSS</a>
</div>
</div>
<!-- Content -->
<div class="layout-content effect-caution">
{{ block "PageContent" . }}{{ end }}
</div>
</div>
{{ block "PageBody" . }}{{ end }}
</body>
</html>
@@ -0,0 +1,82 @@
{{ define "PageStyles" }}
<link rel="stylesheet" href="/public/styles/blog_article.css?v={{ .Version }}">
{{ end }}
{{ define "PageHead" }}
<meta property="og:type" content="article">
<meta property="og:title" content="{{ .Article.Title }}">
<meta property="og:image" content="{{ .Site.Host }}{{ .Article.BaseBanner }}">
<meta property="og:url" content="{{ .Site.Host }}/blog/{{ .Article.Slug }}">
<meta property="og:description" content="{{ .Article.Description }}">
{{ end }}
{{ define "PageBody" }}
<dialog class="layout-dialog">
<div class="layout-modal effect-caution">
<div class="modal-header">
<p>Share</p>
<form method="dialog" autofocus>
<button>&#10005;</button>
</form>
</div>
<div class="modal-content">
<input type="text" value="{{ .Site.Host }}/blog/{{ .Article.Slug }}" onclick="this.select()" readonly>
<a title="Share on X" target="_blank" href="https://twitter.com/intent/tweet?url={{ .Site.Host }}/blog/{{ .Article.Slug }}&text={{ .Article.Title }}&via={{ .Site.Owner }}">
{{ template "logo_x.svg" . }}
</a>
<a title="Share on Facebook" target="_blank" href="https://www.facebook.com/sharer/sharer.php?u={{ .Site.Host }}/blog/{{ .Article.Slug }}">
{{ template "logo_facebook.svg" . }}
</a>
<a title="Share on LinkedIn" target="_blank" href="https://www.linkedin.com/shareArticle?url={{ .Site.Host }}/blog/{{ .Article.Slug }}">
{{ template "logo_linkedin.svg" . }}
</a>
</div>
</div>
</dialog>
<script src="/public/scripts/blog_article.js?v={{ .Version }}"></script>
{{ end }}
{{ define "NavContent" }}
<div class="article-actions">
<a title="Visit Homepage" href="/blog">
{{ template "icon_home.svg" . }}
</a>
<a title="Return To Top" href="#" class="mobile-hide">
{{ template "icon_top.svg" . }}
</a>
<a title="Share Article" href="{{ .Site.Host }}/blog/{{ .Article.Slug }}" id="button-share">
{{ template "icon_share.svg" . }}
</a>
</div>
<div class="article-chapters">
<!-- To Be Generated by Article Script -->
</div>
{{ end }}
{{ define "PageContent" }}
<h1 id="#" hidden><!-- Top Anchor --></h1>
<div class="article-header">
<img class="header-banner" alt="Article Banner" src="/public/articles/{{ .Article.BaseResources }}/{{ .Article.BaseBanner }}?v={{ $.Version }}">
<p class="header-title effect-docked">{{ .Article.Title }}</p>
<div class="header-chevrons">
<div class="effect-chevron-container header-about">
<span class="effect-chevron-point-right">{{ .Article.Author }}</span>
<span class="effect-chevron-point-right">{{ .Article.Date.Format "Jan 02 2006" }}</span>
</div>
<div class="effect-chevron-container header-tags">
{{ range .Article.Tags }}
<span class="effect-chevron-point-left">{{ . }}</span>
{{ end }}
</div>
</div>
</div>
<div class="article-content">
{{ block "ArticleContent" . }}{{ end }}
</div>
{{ end }}
@@ -0,0 +1,71 @@
{{ template "base.html" . }}
{{ define "PageStyles" }}
<link rel="stylesheet" href="/public/styles/blog_browser.css?v={{ .Version }}">
<link rel="stylesheet" href="/public/styles/blog_article.css?v={{ .Version }}">
{{ end }}
{{ define "PageContent" }}
<!-- Introduction & Disclaimer -->
<div class="browser-introduction">
<p class="intro-header effect-rhombus-right">Welcome to my blog!</p>
<img class="intro-banner" src="/public/banner_blog.gif?v={{ .Version }}" alt="Blog Banner" width="520" height="292">
<p class="intro-paragraph">
This corner of the internet contains ramblings about random experiments
that more than likely occured on a bright sunday afternoon. Nothing here
is meant to be perfect, but I do hope to provide the odd spark of insight.
<br><br>
I assume no responsibility for bodily harm, wasted time, or raised eyebrows
that may result from consuming these articles. Enjoy in Moderation! Have fun!
</p>
<div class="element-divider"></div>
<div class="intro-dots">
<span class="effect-dot" style="--color: 94, 167, 1;"></span>
<p>Personal</p>
<span class="effect-dot" style="--color: 0, 167, 170;"></span>
<p>Update</p>
<span class="effect-dot" style="--color: 255, 0, 91;"></span>
<p>Guide</p>
</div>
</div>
<!-- Article List -->
<div class="browser-content">
{{ range $.Articles }}
<a class="browser-item" href="/blog/{{ .Slug }}" style="--rgb-accent: {{ .Color }};">
<div class="item-background" style="--background: url('/public/articles/{{ .BaseResources }}/{{ .BaseBanner }}?v={{ $.Version }}');"></div>
<div class="item-foreground">
<p class="effect-rhombus-left effect-rhombus-animated">{{ .Title }}</p>
<div class="item-tags effect-chevron-container">
{{ range .Tags }}
<span class="effect-chevron-point-left">{{ . }}</span>
{{ end }}
<span class="effect-chevron-point-left">{{ .Date.Format "Jan 02 2006" }}</span>
</div>
</div>
</a>
{{ end }}
</div>
<!-- Fortune Cookie -->
<div class="browser-footer">
<p id="browser-message">If you're reading this, you have JavaScript disabled. Paranoid much? :P</p>
<script>
const monitor = document.querySelector("p#browser-message")
const messages = [
"Did you eat something sweet today? Everybody deserves a sweet treat, especially you. :)",
"Make sure you clean your keyboard, it's amazingly disgusting what you can find in there.",
"Religion aside even God rested on the 7th day, are you treating yourself well?",
"If bored try learning about how your favorite Game Console OS works, or is that weird?",
"Your projects miss you... maybe poke around? You might rediscover something!",
"If somebody has done it before, you can too! And if they got close, you can get closer!",
"Bad Idea Counter -> {{ len .Articles }}",
]
monitor.textContent = messages[Math.floor(Math.random() * messages.length)]
</script>
</div>
{{ end }}
@@ -0,0 +1,76 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="robots" content="noindex">
<title>Page Not Found</title>
<style>
:root{
--color: {{ .Site.Color }};
}
body {
background-color: black;
margin: 0;
}
a,
p {
font-family: "MS Gothic", monospace;
line-height: 16px;
}
p {
color: #f0f0f0;
margin: 4px 0;
}
a,
a:visited {
color: rgba(var(--color), 1);
display: inline-block;
text-align: center;
width: 50%;
text-decoration: none;
}
a:hover,
a:focus-visible {
text-decoration: underline;
outline: none;
}
div {
width: 200px;
text-align: center;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
}
</style>
</head>
<body>
<div>
<p>404: Page Not Found </p>
<br>
<p>.-.</p>
<br>
<a href="javascript:window.history.back()">Go Back</a><a href="/">Homepage</a>
</div>
<script>
// Note: In MS Gothic, backslash shows as ¥ on Windows
const catalog = [
".(^Д^)/", "(・.・)", "(°Δ°)b", "(・_・)", "(^_^)", "(>_<)",
"(o^^)o", "(;-;)", ".(≧o≦)/", "(o_o)", "(^-^*)", "(='X'=)",
"( ̄へ ̄)", "(★ω★)", "ᓚᘏᗢ", "✿◠‿◠", "(●'◡'●)", "◑﹏◐"
];
const kaomoji = catalog[Math.floor(Math.random() * catalog.length)];
document.querySelectorAll("p")[1].textContent = kaomoji;
</script>
</body>
</html>
@@ -0,0 +1,26 @@
<?xml version="1.0" encoding="utf-8" ?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom">
<channel>
<atom:link href="{{ .Site.Host}}/rss.xml" rel="self" type="application/rss+xml"></atom:link>
<link>{{ .Site.Host }}</link>
<title><![CDATA[{{ .Site.Name }}]]></title>
<description><![CDATA[{{ .Site.Description }}]]></description>
<category>{{ .Site.Category }}</category>
<language>{{ .Site.Locale }} </language>
<generator>teto</generator>
<copyright>Copyright 2025 {{ .Site.Owner }}</copyright>
<lastBuildDate>{{ .BuildDate.UTC.Format .RFC1123 }}</lastBuildDate>
</channel>
{{ range $index, $elem := .Articles }}
<item>
<link>{{ $.Site.Host }}/{{ $elem.Slug }}</link>
<guid isPermaLink="true">{{ $.Site.Host }}/{{ $elem.Slug }}</guid>
<title><![CDATA[{{ $elem.Title }}]]></title>
<description><![CDATA[{{ $elem.Description }}]]></description>
<pubDate>{{ $elem.Date.UTC.Format $.RFC1123 }}</pubDate>
{{ range $i, $tag := $elem.Tags }}
<category>{{ $tag }}</category>
{{ end }}
</item>
{{ end }}
</rss>
@@ -0,0 +1,21 @@
{{ template "base.html" . }}
{{ define "PageContent" }}
<style>
div.placeholder {
width: 100%;
height: 100%;
min-height: 480px;
display: grid;
justify-content: center;
justify-items: center;
align-content: center;
gap: 32px;
}
</style>
<div class="placeholder" style="text-align: center;">
<img style="image-rendering: pixelated;" src="/public/banner_home.gif?v={{ .Version }}" alt="Lost Sprite">
<p>I intended to put something here, but I couldn't come up with anything....</p>
<p>So check out my <a href="/blog">blog</a>, <a href="https://git.panca.kz/">code</a> or <a href="https://stickers.panca.kz/">stickerboard</a>!</p>
</div>
{{ end }}
@@ -0,0 +1,4 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 40 32">
<!-- @bakonpancakz -->
<polygon points="20 0 0 14 6 14 6 32 16 32 16 21 24 21 24 32 34 32 34 14 40 14 20 0" />
</svg>

After

Width:  |  Height:  |  Size: 186 B

@@ -0,0 +1,5 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 30.99 30.99">
<!-- @bakonpancakz -->
<polygon points="26.22 14.92 26.22 27.25 3.73 27.25 3.73 4.75 16.05 4.75 12.31 1.01 0 1.01 0 1.03 0 3.82 0 28.18 0 30.97 0 30.99 29.95 30.99 29.95 30.97 29.98 30.97 29.98 18.68 26.22 14.92" />
<polygon points="14.99 0 21.57 6.59 13.57 14.59 16.4 17.41 24.4 9.41 30.99 16 30.99 0 14.99 0" />
</svg>

After

Width:  |  Height:  |  Size: 399 B

@@ -0,0 +1,6 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 18 17.51">
<!-- @bakonpancakz -->
<polygon points="15 17.51 3 17.51 0 8.01 18 8.01 15 17.51" />
<rect y="4" width="18" height="3" />
<rect width="18" height="3" />
</svg>

After

Width:  |  Height:  |  Size: 239 B

@@ -0,0 +1,5 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32">
<!-- @bakonpancakz -->
<polygon points="4.69 20.68 13 20.69 13 32 18.99 31.99 18.99 20.68 27.31 20.68 16 6.74 4.69 20.68" />
<rect width="32" height="3.74" />
</svg>

After

Width:  |  Height:  |  Size: 238 B

@@ -0,0 +1,7 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 500 500">
<mask id="icon">
<path fill="white" d="M500,250C500,111.93,388.07,0,250,0S0,111.93,0,250c0,117.24,80.72,215.62,189.61,242.64v-166.24h-51.55v-76.4h51.55v-32.92c0-85.09,38.51-124.53,122.05-124.53,15.84,0,43.17,3.11,54.35,6.21v69.25c-5.9-.62-16.15-.93-28.88-.93-40.99,0-56.83,15.53-56.83,55.9v27.02h81.66l-14.03,76.4h-67.63v171.77c123.79-14.95,219.71-120.35,219.71-248.17Z" />
<path fill="black" d="M347.92,326.4l14.03-76.4h-81.66v-27.02c0-40.37,15.84-55.9,56.83-55.9,12.73,0,22.98.31,28.88.93v-69.25c-11.18-3.11-38.51-6.21-54.35-6.21-83.54,0-122.05,39.44-122.05,124.53v32.92h-51.55v76.4h51.55v166.24c19.34,4.8,39.57,7.36,60.39,7.36,10.25,0,20.36-.63,30.29-1.83v-171.77h67.63Z" />
</mask>
<rect mask="url(#icon)" width="500" height="500" />
</svg>

After

Width:  |  Height:  |  Size: 835 B

@@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 382 382">
<path d="M347.445,0H34.555C15.471,0,0,15.471,0,34.555v312.889C0,366.529,15.471,382,34.555,382h312.889 C366.529,382,382,366.529,382,347.444V34.555C382,15.471,366.529,0,347.445,0z M118.207,329.844c0,5.554-4.502,10.056-10.056,10.056 H65.345c-5.554,0-10.056-4.502-10.056-10.056V150.403c0-5.554,4.502-10.056,10.056-10.056h42.806 c5.554,0,10.056,4.502,10.056,10.056V329.844z M86.748,123.432c-22.459,0-40.666-18.207-40.666-40.666S64.289,42.1,86.748,42.1 s40.666,18.207,40.666,40.666S109.208,123.432,86.748,123.432z M341.91,330.654c0,5.106-4.14,9.246-9.246,9.246H286.73 c-5.106,0-9.246-4.14-9.246-9.246v-84.168c0-12.556,3.683-55.021-32.813-55.021c-28.309,0-34.051,29.066-35.204,42.11v97.079 c0,5.106-4.139,9.246-9.246,9.246h-44.426c-5.106,0-9.246-4.14-9.246-9.246V149.593c0-5.106,4.14-9.246,9.246-9.246h44.426 c5.106,0,9.246,4.14,9.246,9.246v15.655c10.497-15.753,26.097-27.912,59.312-27.912c73.552,0,73.131,68.716,73.131,106.472 L341.91,330.654L341.91,330.654z"/>
</svg>

After

Width:  |  Height:  |  Size: 1.0 KiB

@@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 300 300.251">
<path d="M178.57 127.15 290.27 0h-26.46l-97.03 110.38L89.34 0H0l117.13 166.93L0 300.25h26.46l102.4-116.59 81.8 116.59h89.34M36.01 19.54H76.66l187.13 262.13h-40.66"/>
</svg>

After

Width:  |  Height:  |  Size: 243 B