Add some better logic to the resizing, add a better contacts page. sidebar hiding still in the works

This commit is contained in:
Bun 2025-07-02 21:44:35 -04:00
parent d8893f0463
commit 67de08a5b8
19 changed files with 180 additions and 99 deletions

View file

@ -3,6 +3,7 @@ compile_sass = true
build_search_index = true
taxonomies = [
{name = "authors", feed = true, rss = true },
{name = "tags", feed = true, rss = true },
]

6
content/art/_index.md Normal file
View file

@ -0,0 +1,6 @@
+++
title = "art and doodles"
sort_by = "date"
template = "blog.html"
page_template = "blog-page.html"
+++

View file

@ -1,10 +1,10 @@
+++
authors = [ "aubun" ]
title = "about me"
title = "about me, the aubun creature"
date = 2025-07-02
description = "a page all about me!"
[taxonomies]
authors = [ "aubun" ]
tags = [ "info", "personal" ]
+++

View file

@ -1,10 +1,26 @@
+++
authors = [ "aubun" ]
title = "contact info"
title = "contact info and socials"
date = 2025-07-02
description = "a page with all my contact details"
description = "all my contact details"
[taxonomies]
authors = [ "aubun" ]
tags = [ "info", "personal" ]
+++
i'm not on too many platforms,
but the best way to reach me today is email and matrix!
#### main platforms
- **✉️ email:** [bun@nixfox.ca](mailto:bun@nixfox.ca)
- **💬 matrix:** [@bun:nixfox.ca](https://matrix.to/#/@bun:nixfox.ca)
here are my other socials,
which i'm active on from time to time.
#### social platforms
- **💬 discord:** [viceebun](https://discordapp.com/users/1324248157307146290)
- **🖼️ instagram:** [viceebun](https://www.instagram.com/viceebun)
- **🐦 twitter:** [viceebun](https://x.com/viceebun)
- **🎵 spotify:** [bun](https://open.spotify.com/user/31vdhyhqi3kw7f6n6hgddu44mm5a)

View file

@ -1,11 +1,11 @@
+++
authors = [ "aubun" ]
title = "defense / priorities"
date = 2025-06-26
description = "a little rant about my own defense mechanisms"
[taxonomies]
authors = [ "aubun" ]
tags = [ "rants", "personal" ]
+++

View file

@ -1,11 +1,11 @@
+++
authors = [ "aubun" ]
title = "new website!"
date = 2025-07-02
description = "rebuilding the nixfox site"
[taxonomies]
authors = [ "aubun" ]
tags = [ "software", "nixfox" ]
+++

View file

@ -22,6 +22,8 @@
padding: 0;
font-size: 1.6em;
transition: 0.3s;
background-color: var(--sb-color);
}
@ -75,7 +77,6 @@
display: inline-block;
}
.personal { color:#fc3f5b; }
.nixfox { color:#2abafc; }

View file

@ -61,21 +61,43 @@ h1 {
font-size: 16px;
}
.sidebar-toggle-button {
position: fixed;
bottom: 1rem;
right: .8rem;
z-index: 9;
width: 25px;
height: 25px;
cursor: crosshair;
z-index: 2;
font-size: 18px;
}
@media (max-width: 980px) {
html, body {
margin: 0;
height: 100%;
padding: 1.5em;
}
#main {
width: 70%;
min-height: 100%;
padding-left: 7em;
padding: 0;
top: 0;
}
.container {
max-width: 30em;
max-width: 35em;
}
[data-theme="light"] {
--bg-color: #EFF1F5;
}
[data-theme="dark"] {
--bg-color: #1F2223;
}
}

View file

@ -11,7 +11,7 @@ function calculateSettingAsThemeString({ localStorageTheme, systemSettingDark })
return "light";
}
function updateButton({ buttonEl, isDark }) {
function updateThemeButton({ buttonEl, isDark }) {
const newCta = isDark ? "toggle light" : "toggle dark";
buttonEl.setAttribute("aria-label", newCta);
buttonEl.innerText = newCta;
@ -22,20 +22,20 @@ function updateThemeOnHtmlEl({ theme }) {
}
const button = document.querySelector("[data-theme-toggle]");
const themeToggleButton = document.querySelector("[data-theme-toggle]");
const localStorageTheme = localStorage.getItem("theme");
const systemSettingDark = window.matchMedia("(prefers-color-scheme: dark)");
let currentThemeSetting = calculateSettingAsThemeString({ localStorageTheme, systemSettingDark });
updateButton({ buttonEl: button, isDark: currentThemeSetting === "dark" });
updateThemeButton({ buttonEl: themeToggleButton, isDark: currentThemeSetting === "dark" });
updateThemeOnHtmlEl({ theme: currentThemeSetting });
button.addEventListener("click", (event) => {
themeToggleButton.addEventListener("click", () => {
const newTheme = currentThemeSetting === "dark" ? "light" : "dark";
localStorage.setItem("theme", newTheme);
updateButton({ buttonEl: button, isDark: newTheme === "dark" });
updateThemeButton({ buttonEl: themeToggleButton, isDark: newTheme === "dark" });
updateThemeOnHtmlEl({ theme: newTheme });
currentThemeSetting = newTheme;

View file

@ -0,0 +1,21 @@
{% extends "base.html" %}
{%- block title -%}
{{ title_macros::title(page_title="Tags", main_title=config.title) }}
{%- endblock -%}
{% block content %}
<div class="post">
<h1 class="post-title">all tags</h1>
<ul>
{% for term in terms %}
<li class="tag-list">
<a href="{{ term.permalink | safe }}">
{{ term.name }} ({{ term.pages | length }} post{{ term.pages | length | pluralize }})
</a>
</li>
{% endfor %}
</ul>
</div>
{% endblock content %}

View file

@ -0,0 +1,18 @@
{% extends "base.html" %}
{% block content %}
<h2>
author: {{ term.name }}
({{ term.pages | length }} post{{ term.pages | length | pluralize }})
</h2>
<div class="page-intro">
<p class="larger">view all <a href="/authors">authors</a>.</p>
</div>
<ul class="postlist">
{% for page in term.pages | sort(attribute="date") | reverse %}
{% include "blog-entry.html" %}
{% endfor %}
</ul>
{% endblock content %}

View file

@ -1,5 +1,5 @@
<!DOCTYPE html>
<html lang="en" data-theme="light">
<html lang="en" data-theme="light" data-sidebar="shown">
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<meta charset="UTF-8">
@ -12,36 +12,7 @@
</head>
<body>
<div id="sidebar" class="column">
<a href="/" class="sb_img"><img src="https://art.pixilart.com/sr2a62fc9ed2173.png" alt="teto creature"></a>
<button type="button" class="theme-toggle-button" data-theme-toggle aria-label="Toggle to dark"></button>
<script src="/darkmode.js"></script>
<div class="sb_header personal"><b>personal</b></div>
<a href="/blog" class="sb_link pers">📰 blog</a><br>
<a href="/images" class="sb_link pers">🖼️ images</a><br>
<a href="/hardware" class="sb_link pers">🖥️ hardware</a><br>
<a href="/software" class="sb_link pers">💾 software</a><br>
<a href="/tags" class="sb_link pers">🔎 all tags</a><br>
<br>
<div class="sb_header nixfox"><b>nixfox</b></div>
<a href="/nixfox" class="sb_link pers">📰 nixfox</a><br>
<a href="https://uptime.nixfox.ca/status/nixfox" class="sb_link fox">⬆️ uptime</a><br>
<a href="https://mail.nixfox.ca" class="sb_link fox">📧 email</a><br>
<a href="https://files.nixfox.ca" class="sb_link fox">☁️ nextcloud</a><br>
<a href="https://pass.nixfox.ca" class="sb_link fox">🔒 vaultwarden</a><br>
<a href="https://git.nixfox.ca" class="sb_link fox">🗄️ forgejo</a><br>
<a href="https://hedgedoc.nixfox.ca" class="sb_link fox">🗒️ hedgedoc</a><br>
<a href="https://jelly.nixfox.ca" class="sb_link fox">📼 jellyfin</a><br>
<a href="https://live.nixfox.ca" class="sb_link fox">📹 owncast</a><br>
<a href="https://radio.nixfox.ca" class="sb_link fox">📻 icecast</a><br>
<a href="https://chat.nixfox.ca" class="sb_link fox">💬 matrix</a><br>
<a href="https://tor.nixfox.ca" class="sb_link fox">🗃️ transmission</a><br>
<a href="https://git.nixfox.ca/Bun/nixfox-reborn.git" class="sb_link fox">💽 page code</a><br>
</div>
{% include "sidebar.html" %}
<div id="main" class="column">
<div class="container">

15
templates/blog-entry.html Normal file
View file

@ -0,0 +1,15 @@
<li class="postlist-item">
<a href="{{ page.permalink | safe }}">{{ page.title }}</a>
<br>
{{ page.description }}
<br>
authors: {%- for tag in page.taxonomies.authors | sort | unique(case_sensitive=false) %}
<a class="post-author" href="{{ get_taxonomy_url(kind='authors', name=tag) | safe }}">{{ tag }}</a>
{% endfor -%}
<br>
written: {{ page.date }}
<br>
tags: {%- for tag in page.taxonomies.tags | sort | unique(case_sensitive=false) %}
<a class="post-tag" href="{{ get_taxonomy_url(kind='tags', name=tag) | safe }}">#{{ tag }}</a>
{% endfor -%}
</li>

View file

@ -1,14 +1,14 @@
{% extends "base.html" %}
{% block content %}
<h1 class="title">
<h1 class="title">
{{ page.title }}
</h1>
<p class="subtitle"><strong>
</h1>
<p class="subtitle"><strong>
{{ page.date }},
tags: {%- for tag in page.taxonomies.tags | sort | unique(case_sensitive=false) %}
<a class="post-tag" href="{{ get_taxonomy_url(kind='tags', name=tag) | safe }}">#{{ tag }}</a>
{% endfor -%}
</strong></p>
{{ page.content | safe }}
</strong></p>
{{ page.content | safe }}
{% endblock content %}

View file

@ -1,27 +1,17 @@
{% extends "base.html" %}
{% block content %}
<h1 class="title">
<h1 class="title">
{{ section.title }}
</h1>
</h1>
<p class="larger">sort by <a href="/tags">tags</a>.</p>
<p class="larger">sort by <a href="/tags">tags</a>.</p>
<ul>
<ul>
<!-- If you are using pagination, section.pages will be empty.
You need to use the paginator object -->
{% for page in section.pages %}
<li>
<a href="{{ page.permalink | safe }}">{{ page.title }}</a> - by {{ page.authors }}
<br>
{{ page.description }}
<br>
written: {{ page.date }}
<br>
tags: {%- for tag in page.taxonomies.tags | sort | unique(case_sensitive=false) %}
<a class="post-tag" href="{{ get_taxonomy_url(kind='tags', name=tag) | safe }}">#{{ tag }}</a>
{% endfor -%}
</li>
{% include "blog-entry.html" %}
{% endfor %}
</ul>
</ul>
{% endblock content %}

View file

@ -1,8 +1,7 @@
{% extends "base.html" %}
{% block content %}
<h1 class="title">
{% block content %}
<h1 class="title">
{{ section.title }}
</h1>
{{ section.content | safe }}
</h1>
{{ section.content | safe }}
{% endblock content %}

31
templates/sidebar.html Normal file
View file

@ -0,0 +1,31 @@
<div id="sidebar" class="column">
<a href="/" class="sb_img"><img src="https://art.pixilart.com/sr2a62fc9ed2173.png" alt="teto creature"></a>
<button type="button" class="theme-toggle-button" data-theme-toggle aria-label="Toggle to dark"></button>
<script src="/darkmode.js"></script>
<div class="sb_header personal"><b>personal</b></div>
<a href="/blog" class="sb_link pers">📰 blog</a><br>
<a href="/art" class="sb_link pers">🎨 art</a><br>
<a href="/images" class="sb_link pers">🖼️ images</a><br>
<a href="/hardware" class="sb_link pers">🖥️ hardware</a><br>
<a href="/software" class="sb_link pers">💾 software</a><br>
<a href="/tags" class="sb_link pers">🔎 all tags</a><br>
<br>
<div class="sb_header nixfox"><b>nixfox</b></div>
<a href="/nixfox" class="sb_link pers">📰 news</a><br>
<a href="https://uptime.nixfox.ca/status/nixfox" class="sb_link fox">⬆️ uptime</a><br>
<a href="https://mail.nixfox.ca" class="sb_link fox">📧 email</a><br>
<a href="https://files.nixfox.ca" class="sb_link fox">☁️ nextcloud</a><br>
<a href="https://pass.nixfox.ca" class="sb_link fox">🔒 vaultwarden</a><br>
<a href="https://git.nixfox.ca" class="sb_link fox">🗄️ forgejo</a><br>
<a href="https://hedgedoc.nixfox.ca" class="sb_link fox">🗒️ hedgedoc</a><br>
<a href="https://jelly.nixfox.ca" class="sb_link fox">📼 jellyfin</a><br>
<a href="https://live.nixfox.ca" class="sb_link fox">📹 owncast</a><br>
<a href="https://radio.nixfox.ca" class="sb_link fox">📻 icecast</a><br>
<a href="https://chat.nixfox.ca" class="sb_link fox">💬 matrix</a><br>
<a href="https://tor.nixfox.ca" class="sb_link fox">🗃️ transmission</a><br>
<a href="https://git.nixfox.ca/Bun/nixfox-reborn.git" class="sb_link fox">💽 page code</a><br>
</div>

View file

@ -1,7 +1,7 @@
{% extends "base.html" %}
{%- block title -%}
{{ title_macros::title(page_title="Tags", main_title=config.title) }}
{{ title_macros::title(page_title="Tags", main_title=config.title) }}
{%- endblock -%}
{% block content %}

View file

@ -12,17 +12,7 @@
<ul class="postlist">
{% for page in term.pages | sort(attribute="date") | reverse %}
<li class="postlist-item">
<a href="{{ page.permalink | safe }}">{{ page.title }}</a> - by {{ page.authors }}
<br>
{{ page.description }}
<br>
written: {{ page.date }}
<br>
tags: {%- for tag in page.taxonomies.tags | sort | unique(case_sensitive=false) %}
<a class="post-tag" href="{{ get_taxonomy_url(kind='tags', name=tag) | safe }}">#{{ tag }}</a>
{% endfor -%}
</li>
{% include "blog-entry.html" %}
{% endfor %}
</ul>
{% endblock content %}