luluslly.xyz/public/posts/index.html
2025-09-15 20:28:44 -04:00

137 lines
4 KiB
HTML

<!DOCTYPE html>
<html lang="en-us">
<head><script src="/livereload.js?mindelay=10&amp;v=2&amp;port=1313&amp;path=livereload" data-no-instant defer></script>
<link rel="apple-touch-icon" sizes="180x180" href="/images/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="/images/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/images/favicon-16x16.png">
<link rel="manifest" href="/images/site.webmanifest">
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="Digital mischief, analog heart.">
<title>Posts | Home</title>
<link rel="stylesheet" href="/css/style.css" />
<link rel="stylesheet" href="/css/fonts.css" />
<link rel="stylesheet" href="http://localhost:1313/css/theme-override.css">
</head>
<body>
<header>
<nav>
<ul>
<li class="pull-left ">
<a href="http://localhost:1313/">~/home</a>
</li>
<li class="pull-left ">
<a href="/categories/">~/categories</a>
</li>
<li class="pull-left ">
<a href="/tags/">~/tags</a>
</li>
<li class="pull-right">
<a href="/donate/">~/donate</a>
</li>
<li class="pull-right">
<a href="/socials/">~/socials</a>
</li>
<li class="pull-right">
<a href="/index.xml">~/rss</a>
</li>
</ul>
</nav>
</header>
<div class="content-wrapper">
<h1>Posts</h1>
<ul>
</ul>
</div>
<footer>
<script>
(function() {
function center_el(tagName) {
var tags = document.getElementsByTagName(tagName), i, tag;
for (i = 0; i < tags.length; i++) {
tag = tags[i];
var parent = tag.parentElement;
if (parent.childNodes.length === 1) {
if (parent.nodeName === 'A') {
parent = parent.parentElement;
if (parent.childNodes.length != 1) continue;
}
if (parent.nodeName === 'P') parent.style.textAlign = 'center';
}
}
}
var tagNames = ['img', 'embed', 'object'];
for (var i = 0; i < tagNames.length; i++) {
center_el(tagNames[i]);
}
})();
</script>
<hr/>
<div style="display: flex; justify-content: center; align-items: center; gap: 10px; flex-wrap: wrap;">
<img src="/images/think_different_powered_by_mac.gif" alt="Think Different Powered by Mac" class="footer-gif">
<img src="/images/linux_powered.gif" alt="Linux Powered" class="footer-gif">
<img src="/images/under_construction.gif" alt="This page is perpetually under construction" class="footer-gif">
<img src="/images/matrix.gif" alt="Matrix numbers scrolling across the screen" class="footer-gif">
<img src="/images/this_page_may_be_hazardous_to_your_health.gif" alt="Warning! This page may be hazardous to your mental health" class="footer-gif">
</div>
<style>
/* Add this to your CSS file or a <style> block */
.footer-gif {
/* Set explicit small dimensions, classic sizes */
width: 120px; /* A very common old-school web button size */
height: 60px; /* A very common old-school web button size */
object-fit: contain; /* Ensures the entire GIF is visible */
flex-shrink: 0; /* Prevents GIFs from shrinking */
flex-grow: 0; /* Prevents GIFs from growing */
}
/* Optional: If some GIFs are naturally different sizes, you could create
specific classes for them, e.g.: */
.footer-gif-large {
width: 100px;
height: 80px;
}
</style>
</footer>
</body>
</html>