Compare commits
9 Commits
4f78224ca6
...
main
@@ -49,6 +49,15 @@ The Blowfish theme is fully **decoupled/vendored** into this project's root fold
|
||||
* No theme submodules are used, protecting the site from upstream updates breaking the build.
|
||||
* Custom styling and layouts can be edited directly in the root directories.
|
||||
|
||||
### Global Background Injection
|
||||
The framework injects a diffused global background image natively into `layouts/_default/baseof.html` using a conditional logic block directly in the body template.
|
||||
|
||||
- It pulls the image source from `defaultBackgroundImage` in `config/_default/params.toml`.
|
||||
- It dynamically applies a `has-global-bg` CSS class to the `<body>` element. This class forces the standard Blowfish solid background colors to become transparent (handled in `assets/css/custom.css`), allowing the background div to show through.
|
||||
- **Bypass Logic**: The template logic automatically bypasses rendering the global background if the page is explicitly configured to use the Blowfish `background` or `hero` layouts (e.g. `layout = "background"` on the homepage or `heroStyle = "background"` on an article). This ensures the framework's native full-page feature images are never broken or layered incorrectly.
|
||||
- The global background mimics the exact structure of the native homepage `background` layout, utilizing a `h-[1000px]` fixed height container with `object-cover` and honoring the `imagePosition` parameter from `params.toml` for pixel-perfect consistency.
|
||||
- Project cards (using `layout: card`) have their styling overridden in `assets/css/custom.css` to use a darker, semi-transparent "dark web" palette to contrast nicely with the diffused background.
|
||||
|
||||
---
|
||||
|
||||
## 🚀 CI/CD Pipeline & Deployment
|
||||
|
||||
@@ -5,8 +5,6 @@
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
|
||||
|
||||
/* --- 2. Absolute Isolation Layout --- */
|
||||
.single-post-wrapper {
|
||||
display: flex;
|
||||
@@ -49,6 +47,30 @@ img[src$='#floatleft']{ float:left; margin: 0.7rem; }
|
||||
img[src$='#floatright']{ float:right; margin: 0.7rem; }
|
||||
.homepage .content { text-align: left; }
|
||||
|
||||
/* Force transparency so global-background shows */
|
||||
body.has-global-bg,
|
||||
body.has-global-bg .bg-neutral,
|
||||
body.has-global-bg .bg-neutral-50,
|
||||
body.has-global-bg .dark\:bg-neutral-800,
|
||||
body.has-global-bg .dark\:bg-neutral-900 {
|
||||
background-color: transparent !important;
|
||||
}
|
||||
|
||||
#main-content {
|
||||
background-color: transparent !important;
|
||||
}
|
||||
|
||||
/* Card styling (Dark Web) */
|
||||
article.relative.flex.flex-col.h-full.overflow-hidden.rounded-lg.border.border-neutral-300 {
|
||||
background-image: none !important;
|
||||
background-color: rgba(26, 26, 26, 0.9) !important;
|
||||
border: 1px solid rgba(255, 255, 255, 0.1) !important;
|
||||
}
|
||||
|
||||
.dark article.relative.flex.flex-col.h-full.overflow-hidden.rounded-lg.border.border-neutral-300 {
|
||||
background-color: rgba(13, 17, 23, 0.9) !important;
|
||||
border: 1px solid rgba(255, 255, 255, 0.05) !important;
|
||||
}
|
||||
|
||||
/* Hide any TOC link that points to an element with the 'no-toc' class */
|
||||
.toc-right a.no-toc-link,
|
||||
|
||||
BIN
assets/me/bjw3071o7xi21.gif
Normal file
BIN
assets/me/bjw3071o7xi21.gif
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 179 KiB |
8788
card-test.html
Normal file
8788
card-test.html
Normal file
File diff suppressed because it is too large
Load Diff
@@ -85,8 +85,8 @@ enableEmoji = true
|
||||
source = "/srv/configs"
|
||||
target = "assets/configs"
|
||||
[[module.mounts]]
|
||||
source = "/srv/dev/hugo/website"
|
||||
target = "assets/dev/hugo/website"
|
||||
source = "/srv/dev/hugo/wiki"
|
||||
target = "assets/dev/hugo/wiki"
|
||||
|
||||
[security]
|
||||
[security.funcs]
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
languageCode = "en"
|
||||
languageName = "English"
|
||||
locale = "en"
|
||||
label = "English"
|
||||
weight = 1
|
||||
title = "wiki.wompmacho.com"
|
||||
|
||||
|
||||
@@ -12,6 +12,7 @@ autoSwitchAppearance = true
|
||||
enableSearch = true
|
||||
enableCodeCopy = true
|
||||
customCSS = true
|
||||
defaultBackgroundImage = "me/bjw3071o7xi21.gif"
|
||||
|
||||
# mainSections = ["section1", "section2"]
|
||||
# robots = ""
|
||||
@@ -28,7 +29,7 @@ customCSS = true
|
||||
|
||||
[homepage]
|
||||
layout = "background" # valid options: page, profile, hero, card, background, custom
|
||||
homepageImage = "me/me_stream_doom.PNG" # used in: hero, and card
|
||||
homepageImage = "me/bjw3071o7xi21.gif" # used in: hero, and card
|
||||
showRecent = false
|
||||
showRecentItems = 5
|
||||
showMoreLink = false
|
||||
@@ -49,7 +50,7 @@ customCSS = true
|
||||
showLikes = false
|
||||
showDateUpdated = true
|
||||
showHero = true
|
||||
heroStyle = "basic" # valid options: basic, big, background
|
||||
heroStyle = "background" # valid options: basic, big, background
|
||||
showBreadcrumbs = true
|
||||
showDraftLabel = true
|
||||
seriesOpened = true
|
||||
|
||||
@@ -85,8 +85,8 @@ enableEmoji = true
|
||||
source = "/srv/configs"
|
||||
target = "assets/configs"
|
||||
[[module.mounts]]
|
||||
source = "/srv/dev/hugo/website"
|
||||
target = "assets/dev/hugo/website"
|
||||
source = "/srv/dev/hugo/wiki"
|
||||
target = "assets/dev/hugo/wiki"
|
||||
|
||||
[security]
|
||||
[security.funcs]
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
languageCode = "en"
|
||||
languageName = "English"
|
||||
locale = "en"
|
||||
label = "English"
|
||||
weight = 1
|
||||
title = "wiki.wompmacho.com"
|
||||
|
||||
|
||||
831
homepage-test.html
Normal file
831
homepage-test.html
Normal file
@@ -0,0 +1,831 @@
|
||||
|
||||
<!doctype html>
|
||||
<html
|
||||
lang="en"
|
||||
dir="ltr"
|
||||
class="scroll-smooth"
|
||||
data-default-appearance="dark"
|
||||
data-auto-appearance="true"><head>
|
||||
<meta name="generator" content="Hugo 0.162.1"><script src="/absproxy/1313/livereload.js?mindelay=10&v=2&port=443&path=absproxy/1313/livereload" data-no-instant defer></script>
|
||||
<meta charset="utf-8">
|
||||
|
||||
<meta http-equiv="content-language" content="en">
|
||||
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
||||
<meta name="theme-color">
|
||||
|
||||
|
||||
|
||||
<title>wiki.wompmacho.com</title>
|
||||
<meta name="title" content="wiki.wompmacho.com">
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<meta name="description" content="This is just the beginning...">
|
||||
|
||||
|
||||
|
||||
|
||||
<link rel="canonical" href="https://dev.wompmacho.com/absproxy/1313/">
|
||||
|
||||
|
||||
|
||||
<link rel="alternate" type="application/rss+xml" href="/absproxy/1313/index.xml" title="wiki.wompmacho.com" />
|
||||
|
||||
|
||||
<link rel="alternate" type="application/json" href="/absproxy/1313/index.json" title="wiki.wompmacho.com" />
|
||||
|
||||
|
||||
|
||||
|
||||
<meta name="author" content="Michael">
|
||||
|
||||
|
||||
|
||||
|
||||
<meta property="og:url" content="https://dev.wompmacho.com/absproxy/1313/">
|
||||
<meta property="og:site_name" content="wiki.wompmacho.com">
|
||||
<meta property="og:title" content="HOME">
|
||||
<meta property="og:description" content="This is just the beginning...">
|
||||
<meta property="og:locale" content="en">
|
||||
<meta property="og:type" content="website">
|
||||
|
||||
|
||||
<meta name="twitter:card" content="summary">
|
||||
<meta name="twitter:title" content="HOME">
|
||||
<meta name="twitter:description" content="This is just the beginning...">
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<link
|
||||
type="text/css"
|
||||
rel="stylesheet"
|
||||
href="/absproxy/1313/css/main.bundle.min.18308e5a2f023ba8f00e0d110e318859fd733149ffb9c27475a386e95cd63ec5bf43522b73295c7b9beec5abfdce6cdfd44567beb3e2d4d8fcddc6f1bb303ed6.css"
|
||||
integrity="sha512-GDCOWi8CO6jwDg0RDjGIWf1zMUn/ucJ0daOG6VzWPsW/Q1Ircylce5vuxav9zmzf1EVnvrPi1Nj83cbxuzA+1g==">
|
||||
|
||||
|
||||
|
||||
<script
|
||||
type="text/javascript"
|
||||
src="/absproxy/1313/js/appearance.min.6f41174b3a05b680820fe08cadbfa5fb7a7ca347b76a0955cdc68b9d8aca1ce24f0547e138cea33bcc7904d551a90afcb1cc7f2d9fe8557075d501419046c08c.js"
|
||||
integrity="sha512-b0EXSzoFtoCCD+CMrb+l+3p8o0e3aglVzcaLnYrKHOJPBUfhOM6jO8x5BNVRqQr8scx/LZ/oVXB11QFBkEbAjA=="></script>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<script src="/absproxy/1313/lib/zoom/zoom.min.umd.a527109b68c082a70f3697716dd72a9d5aa8b545cf800cecbbc7399f2ca6f6e0ce3e431f2062b48bbfa47c9ea42822714060bef309be073f49b9c0e30d318d7b.js" integrity="sha512-pScQm2jAgqcPNpdxbdcqnVqotUXPgAzsu8c5nyym9uDOPkMfIGK0i7+kfJ6kKCJxQGC+8wm+Bz9JucDjDTGNew=="></script>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<script
|
||||
defer
|
||||
type="text/javascript"
|
||||
id="script-bundle"
|
||||
src="/absproxy/1313/js/main.bundle.min.8f75559c3b0987cc436337d462a0b075ebdd214d92a8eac880da424282daeece8759e586481872b873dc2eaa92c6a66f083e3be96ab847d926aea25777dfb292.js"
|
||||
integrity="sha512-j3VVnDsJh8xDYzfUYqCwdevdIU2SqOrIgNpCQoLa7s6HWeWGSBhyuHPcLqqSxqZvCD476Wq4R9kmrqJXd9+ykg=="
|
||||
data-copy="Copy"
|
||||
data-copied="Copied"></script>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<link rel="icon" type="image/svg+xml" href="/icons/icon.svg">
|
||||
<link rel="apple-touch-icon" href="/icons/icon.svg">
|
||||
|
||||
|
||||
|
||||
<script type="application/ld+json">
|
||||
{
|
||||
"@context": "https://schema.org",
|
||||
"@type": "WebSite",
|
||||
"@id": "https://dev.wompmacho.com/absproxy/1313/",
|
||||
"name": "wiki.wompmacho.com",
|
||||
"description": "my personal wiki",
|
||||
"inLanguage": "en",
|
||||
"url": "https://dev.wompmacho.com/absproxy/1313/",
|
||||
|
||||
"publisher" : {
|
||||
"@type": "Person",
|
||||
"name": "Michael"
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</head>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<body class="flex flex-col h-screen m-auto leading-7 max-w-7xl px-6 sm:px-14 md:px-24 lg:px-32 text-lg bg-neutral text-neutral-900 dark:bg-neutral-800 dark:text-neutral bf-scrollbar">
|
||||
|
||||
|
||||
|
||||
<div id="the-top" class="absolute flex self-center">
|
||||
<a
|
||||
class="px-3 py-1 text-sm -translate-y-8 rounded-b-lg bg-primary-200 focus:translate-y-0 dark:bg-neutral-600"
|
||||
href="#main-content">
|
||||
<span class="font-bold text-primary-600 pe-2 dark:text-primary-400">↓</span>
|
||||
Skip to main content
|
||||
</a>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="min-h-[148px]"></div>
|
||||
<div class="fixed inset-x-0 z-100">
|
||||
<div
|
||||
id="menu-blur"
|
||||
class="absolute opacity-0 inset-x-0 top-0 h-full single_hero_background nozoom backdrop-blur-2xl shadow-2xl bg-neutral/25 dark:bg-neutral-800/25"></div>
|
||||
<div class="relative m-auto leading-7 max-w-7xl px-6 sm:px-14 md:px-24 lg:px-32">
|
||||
<div class="main-menu flex items-center w-full gap-2 p-1 pl-0">
|
||||
|
||||
|
||||
<a href="/absproxy/1313/" class="text-base font-medium truncate min-w-0 shrink">
|
||||
wiki.wompmacho.com
|
||||
</a>
|
||||
|
||||
<div class="flex items-center ms-auto">
|
||||
<div class="hidden md:flex">
|
||||
<nav class="flex items-center gap-x-5 h-12">
|
||||
|
||||
|
||||
|
||||
|
||||
<a
|
||||
href="/absproxy/1313/projects/"
|
||||
|
||||
class="flex items-center bf-icon-color-hover"
|
||||
aria-label="projects"
|
||||
title="Projects">
|
||||
|
||||
|
||||
<span class="text-base font-medium break-normal">
|
||||
projects
|
||||
</span>
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<a
|
||||
href="/absproxy/1313/posts/"
|
||||
|
||||
class="flex items-center bf-icon-color-hover"
|
||||
aria-label="posts"
|
||||
title="Posts">
|
||||
|
||||
|
||||
<span class="text-base font-medium break-normal">
|
||||
posts
|
||||
</span>
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<a
|
||||
href="/absproxy/1313/stream/"
|
||||
|
||||
class="flex items-center bf-icon-color-hover"
|
||||
aria-label="stream"
|
||||
title="Stream">
|
||||
|
||||
|
||||
<span class="text-base font-medium break-normal">
|
||||
stream
|
||||
</span>
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<button
|
||||
id="search-button"
|
||||
aria-label="Search"
|
||||
class="text-base bf-icon-color-hover"
|
||||
title="Search (/)">
|
||||
<span class="relative block icon"><svg aria-hidden="true" focusable="false" data-prefix="fas" data-icon="search" class="svg-inline--fa fa-search fa-w-16" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="currentColor" d="M505 442.7L405.3 343c-4.5-4.5-10.6-7-17-7H372c27.6-35.3 44-79.7 44-128C416 93.1 322.9 0 208 0S0 93.1 0 208s93.1 208 208 208c48.3 0 92.7-16.4 128-44v16.3c0 6.4 2.5 12.5 7 17l99.7 99.7c9.4 9.4 24.6 9.4 33.9 0l28.3-28.3c9.4-9.4 9.4-24.6.1-34zM208 336c-70.7 0-128-57.2-128-128 0-70.7 57.2-128 128-128 70.7 0 128 57.2 128 128 0 70.7-57.2 128-128 128z"/></svg>
|
||||
</span>
|
||||
</button>
|
||||
|
||||
|
||||
|
||||
<div class="flex items-center">
|
||||
<button
|
||||
id="appearance-switcher"
|
||||
aria-label="Dark mode switcher"
|
||||
type="button"
|
||||
class="text-base bf-icon-color-hover">
|
||||
<div class="flex items-center justify-center dark:hidden">
|
||||
<span class="relative block icon"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="currentColor" d="M32 256c0-123.8 100.3-224 223.8-224c11.36 0 29.7 1.668 40.9 3.746c9.616 1.777 11.75 14.63 3.279 19.44C245 86.5 211.2 144.6 211.2 207.8c0 109.7 99.71 193 208.3 172.3c9.561-1.805 16.28 9.324 10.11 16.95C387.9 448.6 324.8 480 255.8 480C132.1 480 32 379.6 32 256z"/></svg>
|
||||
</span>
|
||||
</div>
|
||||
<div class="items-center justify-center hidden dark:flex">
|
||||
<span class="relative block icon"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="currentColor" d="M256 159.1c-53.02 0-95.1 42.98-95.1 95.1S202.1 351.1 256 351.1s95.1-42.98 95.1-95.1S309 159.1 256 159.1zM509.3 347L446.1 255.1l63.15-91.01c6.332-9.125 1.104-21.74-9.826-23.72l-109-19.7l-19.7-109c-1.975-10.93-14.59-16.16-23.72-9.824L256 65.89L164.1 2.736c-9.125-6.332-21.74-1.107-23.72 9.824L121.6 121.6L12.56 141.3C1.633 143.2-3.596 155.9 2.736 164.1L65.89 256l-63.15 91.01c-6.332 9.125-1.105 21.74 9.824 23.72l109 19.7l19.7 109c1.975 10.93 14.59 16.16 23.72 9.824L256 446.1l91.01 63.15c9.127 6.334 21.75 1.107 23.72-9.822l19.7-109l109-19.7C510.4 368.8 515.6 356.1 509.3 347zM256 383.1c-70.69 0-127.1-57.31-127.1-127.1c0-70.69 57.31-127.1 127.1-127.1s127.1 57.3 127.1 127.1C383.1 326.7 326.7 383.1 256 383.1z"/></svg>
|
||||
</span>
|
||||
</div>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
</nav>
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
<div class="flex md:hidden">
|
||||
<div class="flex items-center h-14 gap-4">
|
||||
|
||||
<button
|
||||
id="search-button-mobile"
|
||||
aria-label="Search"
|
||||
class="flex items-center justify-center bf-icon-color-hover"
|
||||
title="Search (/)">
|
||||
<span class="relative block icon"><svg aria-hidden="true" focusable="false" data-prefix="fas" data-icon="search" class="svg-inline--fa fa-search fa-w-16" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="currentColor" d="M505 442.7L405.3 343c-4.5-4.5-10.6-7-17-7H372c27.6-35.3 44-79.7 44-128C416 93.1 322.9 0 208 0S0 93.1 0 208s93.1 208 208 208c48.3 0 92.7-16.4 128-44v16.3c0 6.4 2.5 12.5 7 17l99.7 99.7c9.4 9.4 24.6 9.4 33.9 0l28.3-28.3c9.4-9.4 9.4-24.6.1-34zM208 336c-70.7 0-128-57.2-128-128 0-70.7 57.2-128 128-128 70.7 0 128 57.2 128 128 0 70.7-57.2 128-128 128z"/></svg>
|
||||
</span>
|
||||
</button>
|
||||
|
||||
|
||||
|
||||
<button
|
||||
id="appearance-switcher-mobile"
|
||||
type="button"
|
||||
aria-label="Dark mode switcher"
|
||||
class="flex items-center justify-center text-neutral-900 hover:text-primary-600 dark:text-neutral-200 dark:hover:text-primary-400">
|
||||
<div class="dark:hidden">
|
||||
<span class="relative block icon"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="currentColor" d="M32 256c0-123.8 100.3-224 223.8-224c11.36 0 29.7 1.668 40.9 3.746c9.616 1.777 11.75 14.63 3.279 19.44C245 86.5 211.2 144.6 211.2 207.8c0 109.7 99.71 193 208.3 172.3c9.561-1.805 16.28 9.324 10.11 16.95C387.9 448.6 324.8 480 255.8 480C132.1 480 32 379.6 32 256z"/></svg>
|
||||
</span>
|
||||
</div>
|
||||
<div class="hidden dark:block">
|
||||
<span class="relative block icon"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="currentColor" d="M256 159.1c-53.02 0-95.1 42.98-95.1 95.1S202.1 351.1 256 351.1s95.1-42.98 95.1-95.1S309 159.1 256 159.1zM509.3 347L446.1 255.1l63.15-91.01c6.332-9.125 1.104-21.74-9.826-23.72l-109-19.7l-19.7-109c-1.975-10.93-14.59-16.16-23.72-9.824L256 65.89L164.1 2.736c-9.125-6.332-21.74-1.107-23.72 9.824L121.6 121.6L12.56 141.3C1.633 143.2-3.596 155.9 2.736 164.1L65.89 256l-63.15 91.01c-6.332 9.125-1.105 21.74 9.824 23.72l109 19.7l19.7 109c1.975 10.93 14.59 16.16 23.72 9.824L256 446.1l91.01 63.15c9.127 6.334 21.75 1.107 23.72-9.822l19.7-109l109-19.7C510.4 368.8 515.6 356.1 509.3 347zM256 383.1c-70.69 0-127.1-57.31-127.1-127.1c0-70.69 57.31-127.1 127.1-127.1s127.1 57.3 127.1 127.1C383.1 326.7 326.7 383.1 256 383.1z"/></svg>
|
||||
</span>
|
||||
</div>
|
||||
</button>
|
||||
|
||||
|
||||
|
||||
<input type="checkbox" id="mobile-menu-toggle" autocomplete="off" class="hidden peer">
|
||||
<label for="mobile-menu-toggle" class="flex items-center justify-center cursor-pointer bf-icon-color-hover">
|
||||
<span class="relative block icon"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path fill="currentColor" d="M0 96C0 78.33 14.33 64 32 64H416C433.7 64 448 78.33 448 96C448 113.7 433.7 128 416 128H32C14.33 128 0 113.7 0 96zM0 256C0 238.3 14.33 224 32 224H416C433.7 224 448 238.3 448 256C448 273.7 433.7 288 416 288H32C14.33 288 0 273.7 0 256zM416 448H32C14.33 448 0 433.7 0 416C0 398.3 14.33 384 32 384H416C433.7 384 448 398.3 448 416C448 433.7 433.7 448 416 448z"/></svg>
|
||||
</span>
|
||||
</label>
|
||||
|
||||
<div
|
||||
role="dialog"
|
||||
aria-modal="true"
|
||||
style="scrollbar-gutter: stable;"
|
||||
class="fixed inset-0 z-50 invisible overflow-y-auto px-6 py-20 opacity-0 transition-[opacity,visibility] duration-300 peer-checked:visible peer-checked:opacity-100 bg-neutral-50/97 dark:bg-neutral-900/99
|
||||
bf-scrollbar">
|
||||
<label
|
||||
for="mobile-menu-toggle"
|
||||
class="fixed end-8 top-5 flex items-center justify-center z-50 h-12 w-12 cursor-pointer select-none rounded-full bf-icon-color-hover border bf-border-color bf-border-color-hover bg-neutral-50 dark:bg-neutral-900">
|
||||
<span class="relative block icon"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><path fill="currentColor" d="M310.6 361.4c12.5 12.5 12.5 32.75 0 45.25C304.4 412.9 296.2 416 288 416s-16.38-3.125-22.62-9.375L160 301.3L54.63 406.6C48.38 412.9 40.19 416 32 416S15.63 412.9 9.375 406.6c-12.5-12.5-12.5-32.75 0-45.25l105.4-105.4L9.375 150.6c-12.5-12.5-12.5-32.75 0-45.25s32.75-12.5 45.25 0L160 210.8l105.4-105.4c12.5-12.5 32.75-12.5 45.25 0s12.5 32.75 0 45.25l-105.4 105.4L310.6 361.4z"/></svg>
|
||||
</span>
|
||||
</label>
|
||||
<nav class="mx-auto max-w-md space-y-6">
|
||||
|
||||
|
||||
|
||||
<div class="px-2">
|
||||
<a
|
||||
href="/absproxy/1313/projects/"
|
||||
aria-label="projects"
|
||||
|
||||
class="flex items-center gap-4 group bf-icon-color-hover text-neutral-700 dark:text-neutral-200">
|
||||
|
||||
<span title="Projects" class="text-2xl font-bold tracking-tight">
|
||||
projects
|
||||
</span>
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
<div class="px-2">
|
||||
<a
|
||||
href="/absproxy/1313/posts/"
|
||||
aria-label="posts"
|
||||
|
||||
class="flex items-center gap-4 group bf-icon-color-hover text-neutral-700 dark:text-neutral-200">
|
||||
|
||||
<span title="Posts" class="text-2xl font-bold tracking-tight">
|
||||
posts
|
||||
</span>
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
<div class="px-2">
|
||||
<a
|
||||
href="/absproxy/1313/stream/"
|
||||
aria-label="stream"
|
||||
|
||||
class="flex items-center gap-4 group bf-icon-color-hover text-neutral-700 dark:text-neutral-200">
|
||||
|
||||
<span title="Stream" class="text-2xl font-bold tracking-tight">
|
||||
stream
|
||||
</span>
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
<div class="flex flex-wrap gap-4 mt-8 pt-8 border-t bf-border-color">
|
||||
|
||||
<a
|
||||
href="/absproxy/1313/projects/homelab/homelab_infra/"
|
||||
aria-label="homelab"
|
||||
class="inline-flex items-center gap-2 px-2 py-2 bf-icon-color-hover rounded-full text-sm">
|
||||
|
||||
<span title="Homelab Infrastructure">homelab</span>
|
||||
</a>
|
||||
|
||||
<a
|
||||
href="/absproxy/1313/quotes/"
|
||||
aria-label="quotes"
|
||||
class="inline-flex items-center gap-2 px-2 py-2 bf-icon-color-hover rounded-full text-sm">
|
||||
|
||||
<span title="Quotes">quotes</span>
|
||||
</a>
|
||||
|
||||
<a
|
||||
href="/absproxy/1313/resume/"
|
||||
aria-label="resume"
|
||||
class="inline-flex items-center gap-2 px-2 py-2 bf-icon-color-hover rounded-full text-sm">
|
||||
|
||||
<span title="Resume">resume</span>
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</nav>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div
|
||||
class="main-menu flex pb-3 flex-col items-end justify-between md:justify-start space-x-3 ">
|
||||
<div class="hidden md:flex items-center space-x-5">
|
||||
|
||||
<a
|
||||
href="/absproxy/1313/projects/homelab/homelab_infra/"
|
||||
|
||||
class="flex items-center bf-icon-color-hover">
|
||||
|
||||
<span class="text-xs font-light" title="Homelab Infrastructure">
|
||||
homelab
|
||||
</span>
|
||||
</a>
|
||||
|
||||
<a
|
||||
href="/absproxy/1313/quotes/"
|
||||
|
||||
class="flex items-center bf-icon-color-hover">
|
||||
|
||||
<span class="text-xs font-light" title="Quotes">
|
||||
quotes
|
||||
</span>
|
||||
</a>
|
||||
|
||||
<a
|
||||
href="/absproxy/1313/resume/"
|
||||
|
||||
class="flex items-center bf-icon-color-hover">
|
||||
|
||||
<span class="text-xs font-light" title="Resume">
|
||||
resume
|
||||
</span>
|
||||
</a>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<script
|
||||
type="text/javascript"
|
||||
src="/absproxy/1313/js/background-blur.min.605b3b942818f0ab5a717ae446135ec46b8ee5a2ad12ae56fb90dc2a76ce30c388f9fec8bcc18db15bd47e3fa8a09d779fa12aa9c184cf614a315bc72c6c163d.js"
|
||||
integrity="sha512-YFs7lCgY8KtacXrkRhNexGuO5aKtEq5W+5DcKnbOMMOI+f7IvMGNsVvUfj+ooJ13n6EqqcGEz2FKMVvHLGwWPQ=="
|
||||
data-blur-id="menu-blur"></script>
|
||||
|
||||
|
||||
<div class="relative flex flex-col grow">
|
||||
<main id="main-content" class="grow">
|
||||
|
||||
|
||||
|
||||
|
||||
<article class="prose dark:prose-invert max-w-full">
|
||||
<div class="relative">
|
||||
<div class="absolute inset-x-0 bottom-0 h-1/2"></div>
|
||||
<div class="mx-auto max-w-7xl p-0">
|
||||
<div class="relative sm:overflow-hidden">
|
||||
<div class="fixed inset-x-0 top-0 -z-10">
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<img
|
||||
id="background-image"
|
||||
class="nozoom mt-0 mr-0 mb-0 ml-0 h-[1000px] w-full object-cover"
|
||||
src="/absproxy/1313/me/bjw3071o7xi21.gif"
|
||||
role="presentation"
|
||||
>
|
||||
<div
|
||||
class="absolute inset-0 bg-neutral/60 dark:bg-neutral-800/60 mix-blend-normal"></div>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="relative flex flex-col items-center justify-center px-1 py-1 text-center">
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<img
|
||||
class="mb-2 h-36 w-36 rounded-full"
|
||||
width="144"
|
||||
height="144"
|
||||
alt="Michael"
|
||||
src="/absproxy/1313/me/wampyDance_hu_69da3be68ac1013b.gif"
|
||||
data-zoom-src="/absproxy/1313/me/wampyDance_hu_d23924b08cd0700b.gif">
|
||||
|
||||
|
||||
<h1 class="mb-2 text-4xl font-extrabold text-neutral-800 dark:text-neutral-200">
|
||||
Michael
|
||||
</h1>
|
||||
|
||||
<h2 class="mt-0 mb-0 text-xl text-neutral-800 dark:text-neutral-300">
|
||||
aka <code>Mitch</code> / aka <code>WompMacho</code>
|
||||
</h2>
|
||||
|
||||
<div class="mt-3 mb-10 text-2xl">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="relative flex flex-col w-full px-1 py-1 text-left">
|
||||
<section class="prose dark:prose-invert mx-auto w-full">
|
||||
|
||||
<h1 class="relative group">Hi there 👋
|
||||
<div id="hi-there-" class="anchor"></div>
|
||||
|
||||
<span
|
||||
class="absolute top-0 w-6 transition-opacity opacity-0 -start-6 not-prose group-hover:opacity-100 select-none">
|
||||
<a class="text-primary-300 dark:text-neutral-700 !no-underline" href="#hi-there-" aria-label="Anchor">#</a>
|
||||
</span>
|
||||
|
||||
</h1>
|
||||
<p>The goal of this site is to document my home apps, services, infrastructure and other projects I am working on. Additionally I am using it as a learning tool, to document things I already know, fill in some gaps, add to that knowledge and further refine my understanding on complicated topics. I find its much easier to master something if you are forced to explain it to someone else. With that spirit in mind, lemme see what I can float your way.</p>
|
||||
<div class="admonition relative overflow-hidden rounded-lg border-l-4 my-3 px-4 py-3 shadow-sm" data-type="success">
|
||||
<div class="flex items-center gap-2 font-semibold text-inherit">
|
||||
<div class="flex shrink-0 h-5 w-5 items-center justify-center text-lg"><span class="relative block icon"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path fill="currentColor" d="M438.6 105.4C451.1 117.9 451.1 138.1 438.6 150.6L182.6 406.6C170.1 419.1 149.9 419.1 137.4 406.6L9.372 278.6C-3.124 266.1-3.124 245.9 9.372 233.4C21.87 220.9 42.13 220.9 54.63 233.4L159.1 338.7L393.4 105.4C405.9 92.88 426.1 92.88 438.6 105.4H438.6z"/></svg>
|
||||
</span></div>
|
||||
<div class="grow">
|
||||
Favorite Quote
|
||||
</div>
|
||||
</div><div class="admonition-content mt-3 text-base leading-relaxed text-inherit"><p>Never attribute to malice what can be explained by incompetence</p></div></div>
|
||||
</section>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
<section>
|
||||
|
||||
|
||||
|
||||
|
||||
</section>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<div
|
||||
id="scroll-to-top"
|
||||
class="fixed bottom-6 end-6 z-50 transform translate-y-4 opacity-0 duration-200">
|
||||
<a
|
||||
href="#the-top"
|
||||
class="pointer-events-auto flex h-12 w-12 items-center justify-center rounded-full bg-neutral/50 text-xl text-neutral-700 hover:text-primary-600 dark:bg-neutral-800/50 dark:text-neutral dark:hover:text-primary-400"
|
||||
aria-label="Scroll to top"
|
||||
title="Scroll to top">
|
||||
↑
|
||||
</a>
|
||||
</div>
|
||||
|
||||
</main><footer id="site-footer" class="py-10 print:hidden">
|
||||
|
||||
|
||||
|
||||
|
||||
<div class="flex items-center justify-between">
|
||||
|
||||
|
||||
<p class="text-sm text-neutral-500 dark:text-neutral-400">
|
||||
©
|
||||
2026
|
||||
Michael
|
||||
</p>
|
||||
|
||||
|
||||
|
||||
|
||||
<p class="text-xs text-neutral-500 dark:text-neutral-400">
|
||||
Powered by <a class="hover:underline hover:decoration-primary-400 hover:text-primary-500"
|
||||
href="https://gohugo.io/" target="_blank" rel="noopener noreferrer">Your Mom</a>
|
||||
</p>
|
||||
|
||||
</div>
|
||||
|
||||
<script>
|
||||
mediumZoom(document.querySelectorAll("img:not(.nozoom)"), {
|
||||
margin: 24,
|
||||
background: "rgba(0,0,0,0.5)",
|
||||
scrollOffset: 0,
|
||||
});
|
||||
</script>
|
||||
|
||||
|
||||
|
||||
</footer>
|
||||
<div
|
||||
id="search-wrapper"
|
||||
class="invisible fixed inset-0 flex h-screen w-screen cursor-default flex-col bg-neutral-500/50 p-4 backdrop-blur-sm dark:bg-neutral-900/50 sm:p-6 md:p-[10vh] lg:p-[12vh] z-500"
|
||||
data-url="https://dev.wompmacho.com/absproxy/1313/">
|
||||
<div
|
||||
id="search-modal"
|
||||
class="flex flex-col w-full max-w-3xl min-h-0 mx-auto border rounded-md shadow-lg top-20 border-neutral-200 bg-neutral dark:border-neutral-700 dark:bg-neutral-800">
|
||||
<header class="relative z-10 flex items-center justify-between flex-none px-2">
|
||||
<form class="flex items-center flex-auto min-w-0">
|
||||
<div class="flex items-center justify-center w-8 h-8 text-neutral-400">
|
||||
<span class="relative block icon"><svg aria-hidden="true" focusable="false" data-prefix="fas" data-icon="search" class="svg-inline--fa fa-search fa-w-16" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="currentColor" d="M505 442.7L405.3 343c-4.5-4.5-10.6-7-17-7H372c27.6-35.3 44-79.7 44-128C416 93.1 322.9 0 208 0S0 93.1 0 208s93.1 208 208 208c48.3 0 92.7-16.4 128-44v16.3c0 6.4 2.5 12.5 7 17l99.7 99.7c9.4 9.4 24.6 9.4 33.9 0l28.3-28.3c9.4-9.4 9.4-24.6.1-34zM208 336c-70.7 0-128-57.2-128-128 0-70.7 57.2-128 128-128 70.7 0 128 57.2 128 128 0 70.7-57.2 128-128 128z"/></svg>
|
||||
</span>
|
||||
</div>
|
||||
<input
|
||||
type="search"
|
||||
id="search-query"
|
||||
class="flex flex-auto h-12 mx-1 bg-transparent appearance-none focus:outline-dotted focus:outline-2 focus:outline-transparent"
|
||||
placeholder="Search"
|
||||
tabindex="0">
|
||||
</form>
|
||||
<button
|
||||
id="close-search-button"
|
||||
class="flex items-center justify-center w-8 h-8 text-neutral-700 hover:text-primary-600 dark:text-neutral dark:hover:text-primary-400"
|
||||
title="Close (Esc)">
|
||||
<span class="relative block icon"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><path fill="currentColor" d="M310.6 361.4c12.5 12.5 12.5 32.75 0 45.25C304.4 412.9 296.2 416 288 416s-16.38-3.125-22.62-9.375L160 301.3L54.63 406.6C48.38 412.9 40.19 416 32 416S15.63 412.9 9.375 406.6c-12.5-12.5-12.5-32.75 0-45.25l105.4-105.4L9.375 150.6c-12.5-12.5-12.5-32.75 0-45.25s32.75-12.5 45.25 0L160 210.8l105.4-105.4c12.5-12.5 32.75-12.5 45.25 0s12.5 32.75 0 45.25l-105.4 105.4L310.6 361.4z"/></svg>
|
||||
</span>
|
||||
</button>
|
||||
</header>
|
||||
<section class="flex-auto px-2 overflow-auto">
|
||||
<ul id="search-results">
|
||||
|
||||
</ul>
|
||||
</section>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
@@ -9,8 +9,57 @@
|
||||
{{- partialCached "init.html" . -}}
|
||||
|
||||
{{ $bodyLayout := "flex flex-col h-screen m-auto leading-7 max-w-7xl px-6 sm:px-14 md:px-24 lg:px-32" }}
|
||||
|
||||
{{/* Global Background Logic */}}
|
||||
{{ $useGlobalBg := false }}
|
||||
{{ $bgImage := "" }}
|
||||
{{ if site.Params.defaultBackgroundImage }}
|
||||
{{ $useGlobalBg = true }}
|
||||
{{ $bgImage = site.Params.defaultBackgroundImage }}
|
||||
{{ if .IsHome }}
|
||||
{{ if or (eq .Site.Params.homepage.layout "background") (eq .Site.Params.homepage.layout "hero") }}
|
||||
{{ if .Site.Params.homepage.homepageImage }}{{ $useGlobalBg = false }}{{ end }}
|
||||
{{ end }}
|
||||
{{ else if .IsPage }}
|
||||
{{ $heroStyle := .Params.heroStyle | default (.Site.Params.article.heroStyle | default "basic") }}
|
||||
{{ if or (eq $heroStyle "background") (eq $heroStyle "hero") }}
|
||||
{{ if .Params.featureimage }}{{ $useGlobalBg = false }}{{ end }}
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
|
||||
{{ $bodyColor := "text-lg bg-neutral text-neutral-900 dark:bg-neutral-800 dark:text-neutral" }}
|
||||
<body class="{{ $bodyLayout }} {{ $bodyColor }} {{ if site.Params.enableStyledScrollbar | default true }}bf-scrollbar{{ end }}">
|
||||
{{ if $useGlobalBg }}
|
||||
{{ $bodyColor = "text-lg text-neutral-900 dark:text-neutral" }}
|
||||
{{ end }}
|
||||
|
||||
{{ $globalBgClass := cond $useGlobalBg "has-global-bg" "" }}
|
||||
|
||||
<body class="{{ $bodyLayout }} {{ $bodyColor }} {{ with .Params.bodyClass }}{{ . }}{{ end }} {{ $globalBgClass }} {{ if site.Params.enableStyledScrollbar | default true }}bf-scrollbar{{ end }}">
|
||||
|
||||
{{ if $useGlobalBg }}
|
||||
{{ $bgURL := "" }}
|
||||
{{ if or (strings.HasPrefix $bgImage "http:") (strings.HasPrefix $bgImage "https:") }}
|
||||
{{ $bgURL = $bgImage }}
|
||||
{{ else }}
|
||||
{{ $bgResource := resources.Get $bgImage }}
|
||||
{{ if $bgResource }}
|
||||
{{ $bgURL = $bgResource.RelPermalink }}
|
||||
{{ else }}
|
||||
{{ $bgURL = $bgImage | relURL }}
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
<div id="global-background" class="fixed inset-0 overflow-hidden pointer-events-none single_hero_background nozoom" style="z-index: -1;">
|
||||
{{ $style := "" }}
|
||||
{{ $defaultPosition := site.Params.imagePosition | default false }}
|
||||
{{ if $defaultPosition }}
|
||||
{{ $style = printf "object-position: %s;" $defaultPosition }}
|
||||
{{ end }}
|
||||
<img src="{{ $bgURL }}" class="absolute inset-0 w-full h-[1000px] md:h-[1200px] object-cover" role="presentation" {{ if $style }}style="{{ $style | safeCSS }}"{{ end }}>
|
||||
<div class="absolute inset-0 h-[1000px] md:h-[1200px] bg-neutral/60 dark:bg-neutral-800/60 mix-blend-normal"></div>
|
||||
</div>
|
||||
{{ end }}
|
||||
|
||||
<div id="the-top" class="absolute flex self-center">
|
||||
<a
|
||||
class="px-3 py-1 text-sm -translate-y-8 rounded-b-lg bg-primary-200 focus:translate-y-0 dark:bg-neutral-600"
|
||||
|
||||
@@ -36,9 +36,7 @@
|
||||
role="presentation"
|
||||
{{ if $style }}style="{{ $style | safeCSS }}"{{ end }}>
|
||||
<div
|
||||
class="from-neutral absolute inset-0 h-[1000px] bg-gradient-to-t to-transparent mix-blend-normal dark:from-neutral-800"></div>
|
||||
<div
|
||||
class="from-neutral absolute inset-0 h-[1000px] bg-gradient-to-t to-neutral-100 opacity-60 mix-blend-normal dark:from-neutral-800 dark:to-neutral-800"></div>
|
||||
class="absolute inset-0 bg-neutral/60 dark:bg-neutral-800/60 mix-blend-normal"></div>
|
||||
{{ end }}
|
||||
</div>
|
||||
|
||||
|
||||
1
test-bg.sh
Normal file
1
test-bg.sh
Normal file
@@ -0,0 +1 @@
|
||||
# quick script to test logic
|
||||
Reference in New Issue
Block a user