diff --git a/README.md b/README.md index 72ddd00..df62ff4 100644 --- a/README.md +++ b/README.md @@ -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 `` 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 diff --git a/assets/css/custom.css b/assets/css/custom.css index 7a2d9e0..69813a7 100644 --- a/assets/css/custom.css +++ b/assets/css/custom.css @@ -5,8 +5,6 @@ margin: 0 auto; } - - /* --- 2. Absolute Isolation Layout --- */ .single-post-wrapper { display: flex; @@ -49,49 +47,31 @@ img[src$='#floatleft']{ float:left; margin: 0.7rem; } img[src$='#floatright']{ float:right; margin: 0.7rem; } .homepage .content { text-align: left; } - - -/* Page background with Diffusion Layer */ -body::before { - content: ""; - position: fixed; - top: 0; - left: 0; - width: 100%; - height: 100%; - background-image: url('/images/backgrounds/default.gif'); - background-size: cover; - background-position: center; - background-attachment: fixed; - background-repeat: no-repeat; - z-index: -10; - /* Diffusion / Overlay layer */ - background-color: rgba(0, 0, 0, 0.6); - background-blend-mode: overlay; - filter: blur(5px); /* This adds the diffusion */ - transform: scale(1.05); /* Avoid white edges from blur */ +/* 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; } -/* Ensure background sits behind everything */ -body { - position: relative; - z-index: 1; +#main-content { + background-color: transparent !important; } -/* Card background color (Default Dark Web style) */ +/* Card styling (Dark Web) */ article.relative.flex.flex-col.h-full.overflow-hidden.rounded-lg.border.border-neutral-300 { - background-image: none !important; /* Revert gif from cards */ - background-color: rgba(26, 26, 26, 0.9) !important; /* Dark web color */ + background-image: none !important; + background-color: rgba(26, 26, 26, 0.9) !important; border: 1px solid rgba(255, 255, 255, 0.1) !important; } -/* Dark mode adjustment for card background */ .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, .toc-inside a.no-toc-link { diff --git a/card-test.html b/card-test.html new file mode 100644 index 0000000..66e57a1 --- /dev/null +++ b/card-test.html @@ -0,0 +1,8788 @@ + + + + + + + + + + + + + + Projects · wiki.wompmacho.com + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + + + +
+
+ + +
+ + + Skip to main content + +
+ + +
+
+ +
+ + + + + + + + +
+
+ + + + + +
+
+ + + + + + + + + +
+ +
    + + + + + + + + + +
+ + + +

Projects

+
+ + + + + + + + + + + + + + + + + + + + + + +
+ + +
+ + +
+
+ + + + +
+ +
+ +
+
+ + + + + + + + + + + + + +

+ 2026 +

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + + + +
+
+ +

+ Scraping web articles for AI + +

+
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + + ·514 words·3 mins + + + + +
+ + +
+ + + + + + + + + + + +
+ + + + + + + + +
+ + + +
+ +
+ +
+ +
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + + + +
+
+ +

+ Discodrome + +

+
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + + ·277 words·2 mins + + + + +
+ + +
+ + + + + + + + + + + +
+ + + + +
+ + + + + + + + + + + + + + + + + + + + + + + Music + + + + + + + + + + + + + + + + + + + + + Discord + + + + + + + + + + + + + + + + + + + + + Bot + + + + + + + + + + + + + + + + + + + + + Subsonic + + + + + + + + + + + + + + + + + + + + + Self-Hosted + + + + + + + + + +
+ + + +
+ + + +
+ +
+ +
+ +
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + + + +
+
+ +

+ Proxmox + +

+
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + + ·754 words·4 mins + + + + +
+ + +
+ + + + + + + + + + + +
+ + + + + + + + +
+ + + +
+ +
+ +
+ +
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + + + +
+
+ +

+ Self-hosted AI + +

+
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + + ·360 words·2 mins + + + + +
+ + +
+ + + + + + + + + + + +
+ + + + + + + + +
+ + + +
+ +
+ +
+ +
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + + + +
+
+ +

+ MCP on Code-Server + +

+
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + + ·763 words·4 mins + + + + +
+ + +
+ + + + + + + + + + + +
+ + + + + + + + +
+ + + +
+ +
+ +
+ +
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + + + +
+
+ +

+ OPNsense Port Forwarding + +

+
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + + ·410 words·2 mins + + + + +
+ + +
+ + + + + + + + + + + +
+ + + + + + + + +
+ + + +
+ +
+ +
+ +
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + + +

+ 2025 +

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + + +

+ 2024 +

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + + + +
+
+ +

+ NAS + +

+
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + + ··1791 words·9 mins + + + + +
+ + +
+ + + + + + + + + + + +
+ + + + +
+ + + + + + + + + + + + + + + + + + + + + + + Nas + + + + + + + + + + + + + + + + + + + + + Storage + + + + + + + + + + + + + + + + + + + + + Truenas + + + + + + + + + +
+ + + +
+ + + +
+ NAS build and some tips and tricks to get things working with your docker containers +
+ +
+ +
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + + +

+ 2023 +

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + + + +
+
+ +

+ Homelab + +

+
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + + · + + + + +
+ + +
+ + + + + + + + + + + +
+ + + + +
+ + + + + + + + + + + + + + + + + + + + + + + Homelab + + + + + + + + + +
+ + + +
+ + + +
+ +
+ +
+ +
+
+ +
+ + + + + + + + + + + + + + + + + + +
+ + +
+ + + diff --git a/homepage-test.html b/homepage-test.html new file mode 100644 index 0000000..89eee48 --- /dev/null +++ b/homepage-test.html @@ -0,0 +1,831 @@ + + + + + + + + + + + + + + + wiki.wompmacho.com + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + + Skip to main content + +
+ + +
+
+ +
+ + + + + + + + +
+
+ + + + + +
+
+ + + + +
+
+
+
+
+
+ + + + + + + + + + + + + + + + + + +
+ +
+ +
+ + + + + + + + + + + + + + Michael + + +

+ Michael +

+ +

+ aka Mitch / aka WompMacho +

+ +
+ +
+
+ +
+
+ +

Hi there 👋 +
+ + + # + + +

+

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.

+
+
+
+
+
+ Favorite Quote +
+

Never attribute to malice what can be explained by incompetence

+
+
+
+
+
+
+ +
+ + + + +
+ + + + + + + + + + + + + + + + +
+ + +
+ + + diff --git a/layouts/_default/baseof.html b/layouts/_default/baseof.html index 2bfee3e..a102829 100644 --- a/layouts/_default/baseof.html +++ b/layouts/_default/baseof.html @@ -9,8 +9,52 @@ {{- 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" }} - + {{ if $useGlobalBg }} + {{ $bodyColor = "text-lg text-neutral-900 dark:text-neutral" }} + {{ end }} + + {{ $globalBgClass := cond $useGlobalBg "has-global-bg" "" }} + + + + {{ if $useGlobalBg }} + {{ $bgURL := "" }} + {{ if or (strings.HasPrefix $bgImage "http:") (strings.HasPrefix $bgImage "https:") }} + {{ $bgURL = $bgImage }} + {{ else }} + {{ $bgURL = $bgImage | absURL }} + {{ end }} +
+ {{ $style := "" }} + {{ $defaultPosition := site.Params.imagePosition | default false }} + {{ if $defaultPosition }} + {{ $style = printf "object-position: %s;" $defaultPosition }} + {{ end }} + +
+
+ {{ end }} +
-
+ class="absolute inset-0 bg-neutral/60 dark:bg-neutral-800/60 mix-blend-normal">
{{ end }} diff --git a/test-bg.sh b/test-bg.sh new file mode 100644 index 0000000..97a381c --- /dev/null +++ b/test-bg.sh @@ -0,0 +1 @@ +# quick script to test logic