jekyll-theme-zer0 0.22.0 → 0.22.19

data/_layouts/setup.html

@@ -0,0 +1,73 @@
+---
+layout: root
+---
+<!--
+  ===================================================================
+  SETUP LAYOUT - Onboarding and configuration pages
+  ===================================================================
+
+  File: setup.html
+  Path: _layouts/setup.html
+  Inherits: root.html
+  Purpose: Clean single-column layout for setup, onboarding, and
+           configuration guide pages. No sidebar clutter.
+
+  Features:
+  - Centered, readable content column
+  - Optional progress indicator via page.setup_step frontmatter
+  - Setup banner when site is unconfigured
+  - Minimal chrome — lets the user focus on getting configured
+
+  Usage:
+    layout: setup
+    setup_step: 2        # optional, highlights step in progress bar
+    setup_total: 4       # optional, total number of steps
+  ===================================================================
+-->
+
+{% include components/setup-check.html %}
+
+<div class="container-lg py-4">
+  <div class="row justify-content-center">
+    <div class="col-lg-9">
+
+      {% if site_needs_setup %}
+      <div class="alert alert-warning d-flex align-items-center mb-4" role="alert">
+        <i class="bi bi-exclamation-triangle-fill me-2"></i>
+        <div>
+          <strong>Setup required.</strong>
+          Your <code>_config.yml</code> still has default values.
+          Follow the instructions on this page or see the
+          <a href="{{ '/404.html' | relative_url }}" class="alert-link">setup guide</a>.
+        </div>
+      </div>
+      {% endif %}
+
+      {% if page.setup_step and page.setup_total %}
+      <!-- Progress indicator -->
+      <div class="mb-4">
+        <div class="d-flex justify-content-between small text-body-secondary mb-1">
+          <span>Step {{ page.setup_step }} of {{ page.setup_total }}</span>
+          <span>{{ page.setup_step | times: 100 | divided_by: page.setup_total }}% complete</span>
+        </div>
+        <div class="progress" style="height: 6px;">
+          <div class="progress-bar bg-primary"
+               role="progressbar"
+               style="width: {{ page.setup_step | times: 100 | divided_by: page.setup_total }}%"
+               aria-valuenow="{{ page.setup_step }}"
+               aria-valuemin="0"
+               aria-valuemax="{{ page.setup_total }}">
+          </div>
+        </div>
+      </div>
+      {% endif %}
+
+      {% if page.title %}
+      <h1 class="mb-3">{{ page.title }}</h1>
+      {% endif %}
+
+      {{ content }}
+
+    </div>
+  </div>
+</div>

data/_plugins/preview_image_generator.rb

@@ -50,23 +50,31 @@ module Jekyll
       preview = doc.data['preview']
       return false if preview.nil? || preview.to_s.strip.empty?
       
+      # Reject non-path values (text descriptions used as preview)
+      return false unless preview.match?(/\.(png|jpe?g|gif|svg|webp)$/i) || preview.start_with?('http')
+      
       # Check if the preview file actually exists
       site = doc.site
       config = self.config(site)
       
+      # External URL — assume it exists
+      return true if preview.start_with?('http')
+      
       # Normalize the preview path using assets_prefix
       normalized_preview = normalize_preview_path(preview, config)
       
-      # Build the full path
-      preview_path = if normalized_preview.start_with?('/')
-                       File.join(site.source, normalized_preview.sub(/^\//, ''))
-                     elsif normalized_preview.start_with?('http')
-                       return true  # External URL, assume it exists
-                     else
-                       File.join(site.source, config['output_dir'], normalized_preview)
-                     end
+      # Build candidate file paths to check
+      candidates = []
+      if normalized_preview.start_with?('/')
+        candidates << File.join(site.source, normalized_preview.sub(/^\//, ''))
+        candidates << File.join(site.source, 'assets', normalized_preview.sub(/^\//, ''))
+      else
+        candidates << File.join(site.source, 'assets', normalized_preview)
+        candidates << File.join(site.source, normalized_preview)
+        candidates << File.join(site.source, config['output_dir'], normalized_preview)
+      end
       
-      File.exist?(preview_path)
+      candidates.any? { |path| File.exist?(path) }
     end
 
     # Normalize a preview path by adding assets_prefix if needed
@@ -90,6 +98,9 @@ module Jekyll
       preview = doc.data['preview']
       return nil if preview.nil? || preview.to_s.strip.empty?
       
+      # Reject non-path values
+      return nil unless preview.match?(/\.(png|jpe?g|gif|svg|webp)$/i) || preview.start_with?('http')
+      
       site = doc.site
       config = self.config(site)
       
@@ -162,7 +173,9 @@ module Jekyll
       # Handle both Hash (from assign) and Document objects
       if doc.is_a?(Hash)
         preview = doc['preview']
-        !preview.nil? && !preview.to_s.strip.empty?
+        return false if preview.nil? || preview.to_s.strip.empty?
+        # Only consider values that look like image paths or URLs
+        preview.to_s.match?(/\.(png|jpe?g|gif|svg|webp)$/i) || preview.to_s.start_with?('http')
       else
         PreviewImageGenerator.has_preview?(doc)
       end
@@ -176,12 +189,13 @@ module Jekyll
       if doc.is_a?(Hash)
         preview = doc['preview']
         return nil if preview.nil? || preview.to_s.strip.empty?
+        return nil unless preview.to_s.match?(/\.(png|jpe?g|gif|svg|webp)$/i) || preview.to_s.start_with?('http')
+        
+        return preview if preview.start_with?('/') || preview.start_with?('http')
         
         # Get config from context if available
         site_config = @context.registers[:site].config['preview_images'] || {}
         output_dir = site_config['output_dir'] || 'assets/images/previews'
-        
-        return preview if preview.start_with?('/') || preview.start_with?('http')
         "#{output_dir}/#{preview}"
       else
         PreviewImageGenerator.preview_path(doc)

data/_sass/core/_navbar.scss

@@ -743,7 +743,7 @@
 }
 
 // -----------------------------------------------------------------------------
-// Info Section Modal Tabs
+// Info Section Offcanvas Tabs
 // -----------------------------------------------------------------------------
 
 #info-section {
@@ -775,7 +775,7 @@
     padding-top: 1rem;
   }
 
-  // Theme switcher (halfmoon): avoid stretched static menu inside scrollable modal; Popper uses strategy fixed from markup
+  // Theme switcher (halfmoon): keep dropdown positioned within offcanvas panel
   .bd-theme-dropdown {
     position: relative;
   }

data/_sass/custom.scss

@@ -35,6 +35,28 @@ html, body {
     box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, .35), inset 0 -1px 0 rgba(0, 0, 0, .15);
 }
 
+// Vendored Bootstrap build may omit vh utilities; landing hero uses this for stable min height
+.min-vh-50 {
+    min-height: 50vh;
+}
+
+// Landing layout: stable hero media slot (ratio) + no reliance on scroll script for first paint
+.landing-hero {
+    .landing-hero-media {
+        max-width: min(100%, 28rem);
+    }
+
+    .landing-hero-media.ratio > img {
+        object-position: center;
+    }
+}
+
+@media (prefers-reduced-motion: reduce) {
+    .landing-hero .landing-hero-media {
+        transition: none;
+    }
+}
+
 #TableOfContents {
     overflow: hidden;
     text-overflow: ellipsis;
@@ -160,10 +182,7 @@ html, body {
     border-left-color: var(--bs-primary) !important;
 }
 
-// Smooth scroll behavior
-html {
-    scroll-behavior: smooth;
-}
+// Smooth scroll behavior is declared once below (see "Smooth Scroll Enhancement")
 
 // Category active state
 .btn-toggle-nav a.active {
@@ -454,7 +473,8 @@ img {
 // ==============================================================================
 
 // Hero Section Enhancements
-.bg-primary {
+// NOTE: Exclude .zer0-bg-hero so skin-specific gradients from _backgrounds.scss take precedence
+.bg-primary:not(.zer0-bg-hero) {
   position: relative;
   overflow: hidden;
   
@@ -617,8 +637,10 @@ html {
 }
 
 // Section Spacing Improvements
+// Ensure anchored elements clear the fixed navbar when scrolled to
 section,
-.py-5 {
+.py-5,
+[id] {
   scroll-margin-top: 80px;
 }
 

data/_sass/theme/_background-mixins.scss

@@ -0,0 +1,95 @@
+// ==========================================================================
+// Background Mixins — reusable fffuel-style layered backgrounds
+// ==========================================================================
+// Usage:
+//   @include zer0-bg-gradient;     → applies gradient layer
+//   @include zer0-bg-noise;        → applies noise texture overlay
+//   @include zer0-bg-pattern;      → applies pattern overlay
+//   @include zer0-bg-layered;      → combines gradient + noise
+// ==========================================================================
+
+/// Gradient background layer (hero / header areas)
+@mixin zer0-bg-gradient {
+  position: relative;
+  overflow: hidden;
+
+  &::before {
+    content: "";
+    position: absolute;
+    inset: 0;
+    background-image: var(--zer0-bg-gradient);
+    background-size: cover;
+    background-position: center;
+    opacity: var(--zer0-bg-gradient-opacity, 0.6);
+    mix-blend-mode: var(--zer0-bg-blend, overlay);
+    pointer-events: none;
+    z-index: 0;
+  }
+}
+
+/// Noise texture overlay (body / footer areas)
+@mixin zer0-bg-noise {
+  position: relative;
+
+  &::after {
+    content: "";
+    position: absolute;
+    inset: 0;
+    background-image: var(--zer0-bg-noise);
+    background-repeat: repeat;
+    background-size: 300px 300px;
+    opacity: var(--zer0-bg-texture-opacity, 0.04);
+    mix-blend-mode: var(--zer0-bg-blend, overlay);
+    pointer-events: none;
+    z-index: 0;
+  }
+}
+
+/// Pattern overlay (surface / card areas)
+@mixin zer0-bg-pattern {
+  position: relative;
+
+  &::after {
+    content: "";
+    position: absolute;
+    inset: 0;
+    background-image: var(--zer0-bg-pattern);
+    background-repeat: repeat;
+    background-size: var(--zer0-bg-pattern-size, 60px 60px);
+    opacity: var(--zer0-bg-pattern-opacity, 0.08);
+    mix-blend-mode: var(--zer0-bg-blend, overlay);
+    pointer-events: none;
+    z-index: 0;
+  }
+}
+
+/// Layered: gradient + noise (for hero sections with depth)
+@mixin zer0-bg-layered {
+  position: relative;
+  overflow: hidden;
+
+  &::before {
+    content: "";
+    position: absolute;
+    inset: 0;
+    background-image: var(--zer0-bg-gradient);
+    background-size: cover;
+    background-position: center;
+    opacity: var(--zer0-bg-gradient-opacity, 0.6);
+    mix-blend-mode: var(--zer0-bg-blend, overlay);
+    pointer-events: none;
+    z-index: 0;
+  }
+
+  &::after {
+    content: "";
+    position: absolute;
+    inset: 0;
+    background-image: var(--zer0-bg-noise);
+    background-repeat: repeat;
+    background-size: 300px 300px;
+    opacity: var(--zer0-bg-texture-opacity, 0.04);
+    pointer-events: none;
+    z-index: 0;
+  }
+}

data/_sass/theme/_backgrounds.scss

@@ -0,0 +1,156 @@
+// ==========================================================================
+// Backgrounds — fffuel-style SVG background system for zer0-mistakes theme
+// ==========================================================================
+// Each skin maps to gradient, pattern, and noise SVGs.
+// CSS custom properties drive the layering; mixins in _background-mixins.scss
+// apply them to layout zones.
+// ==========================================================================
+
+@import "background-mixins";
+
+// --------------------------------------------------------------------------
+// Default custom properties (no skin / fallback)
+// --------------------------------------------------------------------------
+:root {
+  --zer0-bg-gradient: none;
+  --zer0-bg-pattern: none;
+  --zer0-bg-noise: none;
+  --zer0-bg-gradient-opacity: 0.6;
+  --zer0-bg-texture-opacity: 0.04;
+  --zer0-bg-pattern-opacity: 0.08;
+  --zer0-bg-blend: overlay;
+  --zer0-bg-pattern-size: 60px 60px;
+  --zer0-bg-enabled: 1; // 1 = on, 0 = off
+}
+
+// --------------------------------------------------------------------------
+// Per-skin custom properties
+// Use #{} interpolation so legacy sass-converter passes url() through as-is.
+// Paths are relative to assets/css/main.css so they resolve correctly under
+// any baseurl (e.g. /zer0-pages-remote/ on GitHub Pages subdirectory deploys).
+// --------------------------------------------------------------------------
+
+[data-theme-skin="air"] {
+  --zer0-bg-gradient: #{"url('../backgrounds/gradients/air.svg')"};
+  --zer0-bg-pattern: #{"url('../backgrounds/patterns/air.svg')"};
+  --zer0-bg-noise: #{"url('../backgrounds/noise/air.svg')"};
+  --zer0-bg-pattern-size: 50px 50px;
+}
+
+[data-theme-skin="aqua"] {
+  --zer0-bg-gradient: #{"url('../backgrounds/gradients/aqua.svg')"};
+  --zer0-bg-pattern: #{"url('../backgrounds/patterns/aqua.svg')"};
+  --zer0-bg-noise: #{"url('../backgrounds/noise/aqua.svg')"};
+  --zer0-bg-pattern-size: 48px 48px;
+}
+
+[data-theme-skin="contrast"] {
+  --zer0-bg-gradient: #{"url('../backgrounds/gradients/contrast.svg')"};
+  --zer0-bg-pattern: #{"url('../backgrounds/patterns/contrast.svg')"};
+  --zer0-bg-noise: #{"url('../backgrounds/noise/contrast.svg')"};
+  --zer0-bg-pattern-size: 40px 40px;
+}
+
+[data-theme-skin="dark"] {
+  --zer0-bg-gradient: #{"url('../backgrounds/gradients/dark.svg')"};
+  --zer0-bg-pattern: #{"url('../backgrounds/patterns/dark.svg')"};
+  --zer0-bg-noise: #{"url('../backgrounds/noise/dark.svg')"};
+  --zer0-bg-pattern-size: 60px 60px;
+}
+
+[data-theme-skin="dirt"] {
+  --zer0-bg-gradient: #{"url('../backgrounds/gradients/dirt.svg')"};
+  --zer0-bg-pattern: #{"url('../backgrounds/patterns/dirt.svg')"};
+  --zer0-bg-noise: #{"url('../backgrounds/noise/dirt.svg')"};
+  --zer0-bg-pattern-size: 50px 50px;
+}
+
+[data-theme-skin="neon"] {
+  --zer0-bg-gradient: #{"url('../backgrounds/gradients/neon.svg')"};
+  --zer0-bg-pattern: #{"url('../backgrounds/patterns/neon.svg')"};
+  --zer0-bg-noise: #{"url('../backgrounds/noise/neon.svg')"};
+  --zer0-bg-pattern-size: 48px 48px;
+}
+
+[data-theme-skin="mint"] {
+  --zer0-bg-gradient: #{"url('../backgrounds/gradients/mint.svg')"};
+  --zer0-bg-pattern: #{"url('../backgrounds/patterns/mint.svg')"};
+  --zer0-bg-noise: #{"url('../backgrounds/noise/mint.svg')"};
+  --zer0-bg-pattern-size: 50px 50px;
+}
+
+[data-theme-skin="plum"] {
+  --zer0-bg-gradient: #{"url('../backgrounds/gradients/plum.svg')"};
+  --zer0-bg-pattern: #{"url('../backgrounds/patterns/plum.svg')"};
+  --zer0-bg-noise: #{"url('../backgrounds/noise/plum.svg')"};
+  --zer0-bg-pattern-size: 55px 55px;
+}
+
+[data-theme-skin="sunrise"] {
+  --zer0-bg-gradient: #{"url('../backgrounds/gradients/sunrise.svg')"};
+  --zer0-bg-pattern: #{"url('../backgrounds/patterns/sunrise.svg')"};
+  --zer0-bg-noise: #{"url('../backgrounds/noise/sunrise.svg')"};
+  --zer0-bg-pattern-size: 50px 50px;
+}
+
+// --------------------------------------------------------------------------
+// Utility classes — apply these to layout zones
+// --------------------------------------------------------------------------
+
+.zer0-bg-hero {
+  @include zer0-bg-layered;
+
+  > * { position: relative; z-index: 1; }
+}
+
+.zer0-bg-body {
+  @include zer0-bg-noise;
+
+  // Elevate children above the ::before / ::after pseudo-element backgrounds,
+  // but exclude fixed-position, offcanvas, and modal elements whose
+  // positioning must not be overridden.
+  > *:not(.fixed-top):not(.offcanvas):not(.modal) { position: relative; z-index: 1; }
+}
+
+.zer0-bg-surface {
+  @include zer0-bg-pattern;
+
+  > * { position: relative; z-index: 1; }
+}
+
+.zer0-bg-footer {
+  @include zer0-bg-noise;
+
+  > * { position: relative; z-index: 1; }
+}
+
+// --------------------------------------------------------------------------
+// Accessibility: respect reduced-motion
+// --------------------------------------------------------------------------
+@media (prefers-reduced-motion: reduce) {
+  .zer0-bg-hero,
+  .zer0-bg-body,
+  .zer0-bg-surface,
+  .zer0-bg-footer {
+    &::before,
+    &::after {
+      animation: none !important;
+      transition: none !important;
+    }
+  }
+}
+
+// --------------------------------------------------------------------------
+// Kill switch: when backgrounds are disabled
+// --------------------------------------------------------------------------
+[data-zer0-bg="off"] {
+  .zer0-bg-hero,
+  .zer0-bg-body,
+  .zer0-bg-surface,
+  .zer0-bg-footer {
+    &::before,
+    &::after {
+      display: none !important;
+    }
+  }
+}

data/_sass/theme/_color-modes.scss

@@ -1,3 +1,4 @@
-// Barrel: wizard Sass/CSS overrides, then shared --bd-* tokens.
+// Barrel: wizard Sass/CSS overrides, then shared --bd-* tokens, then fffuel backgrounds.
 @import "theme/wizard-mode";
 @import "theme/css-variables";
+@import "theme/backgrounds";

data/assets/backgrounds/gradients/air.svg

@@ -0,0 +1,15 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="800" height="400" viewBox="0 0 800 400">
+  <defs>
+    <linearGradient id="g1" x1="0%" y1="0%" x2="100%" y2="100%">
+      <stop offset="0%" stop-color="#e8f4f8"/>
+      <stop offset="50%" stop-color="#b8d4e3"/>
+      <stop offset="100%" stop-color="#6fa8dc"/>
+    </linearGradient>
+    <filter id="f1">
+      <feTurbulence type="fractalNoise" baseFrequency="0.006" numOctaves="4" seed="2"/>
+      <feDisplacementMap in="SourceGraphic" scale="60"/>
+    </filter>
+  </defs>
+  <rect width="100%" height="100%" fill="url(#g1)"/>
+  <rect width="100%" height="100%" fill="url(#g1)" filter="url(#f1)" opacity="0.5"/>
+</svg>

data/assets/backgrounds/gradients/aqua.svg

@@ -0,0 +1,15 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="800" height="400" viewBox="0 0 800 400">
+  <defs>
+    <linearGradient id="g1" x1="0%" y1="0%" x2="100%" y2="100%">
+      <stop offset="0%" stop-color="#0077b6"/>
+      <stop offset="50%" stop-color="#00b4d8"/>
+      <stop offset="100%" stop-color="#90e0ef"/>
+    </linearGradient>
+    <filter id="f1">
+      <feTurbulence type="fractalNoise" baseFrequency="0.008" numOctaves="4" seed="5"/>
+      <feDisplacementMap in="SourceGraphic" scale="70"/>
+    </filter>
+  </defs>
+  <rect width="100%" height="100%" fill="url(#g1)"/>
+  <rect width="100%" height="100%" fill="url(#g1)" filter="url(#f1)" opacity="0.5"/>
+</svg>

data/assets/backgrounds/gradients/contrast.svg

@@ -0,0 +1,15 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="800" height="400" viewBox="0 0 800 400">
+  <defs>
+    <linearGradient id="g1" x1="0%" y1="0%" x2="100%" y2="100%">
+      <stop offset="0%" stop-color="#111111"/>
+      <stop offset="50%" stop-color="#333333"/>
+      <stop offset="100%" stop-color="#ffcc00"/>
+    </linearGradient>
+    <filter id="f1">
+      <feTurbulence type="fractalNoise" baseFrequency="0.005" numOctaves="3" seed="8"/>
+      <feDisplacementMap in="SourceGraphic" scale="50"/>
+    </filter>
+  </defs>
+  <rect width="100%" height="100%" fill="url(#g1)"/>
+  <rect width="100%" height="100%" fill="url(#g1)" filter="url(#f1)" opacity="0.4"/>
+</svg>

data/assets/backgrounds/gradients/dark.svg

@@ -0,0 +1,15 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="800" height="400" viewBox="0 0 800 400">
+  <defs>
+    <linearGradient id="g1" x1="0%" y1="0%" x2="100%" y2="100%">
+      <stop offset="0%" stop-color="#1a1a2e"/>
+      <stop offset="50%" stop-color="#16213e"/>
+      <stop offset="100%" stop-color="#0f3460"/>
+    </linearGradient>
+    <filter id="f1">
+      <feTurbulence type="fractalNoise" baseFrequency="0.007" numOctaves="4" seed="12"/>
+      <feDisplacementMap in="SourceGraphic" scale="55"/>
+    </filter>
+  </defs>
+  <rect width="100%" height="100%" fill="url(#g1)"/>
+  <rect width="100%" height="100%" fill="url(#g1)" filter="url(#f1)" opacity="0.5"/>
+</svg>

data/assets/backgrounds/gradients/dirt.svg

@@ -0,0 +1,15 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="800" height="400" viewBox="0 0 800 400">
+  <defs>
+    <linearGradient id="g1" x1="0%" y1="0%" x2="100%" y2="100%">
+      <stop offset="0%" stop-color="#5c4033"/>
+      <stop offset="50%" stop-color="#8b6914"/>
+      <stop offset="100%" stop-color="#d4a574"/>
+    </linearGradient>
+    <filter id="f1">
+      <feTurbulence type="fractalNoise" baseFrequency="0.009" numOctaves="4" seed="20"/>
+      <feDisplacementMap in="SourceGraphic" scale="65"/>
+    </filter>
+  </defs>
+  <rect width="100%" height="100%" fill="url(#g1)"/>
+  <rect width="100%" height="100%" fill="url(#g1)" filter="url(#f1)" opacity="0.5"/>
+</svg>

data/assets/backgrounds/gradients/mint.svg

@@ -0,0 +1,15 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="800" height="400" viewBox="0 0 800 400">
+  <defs>
+    <linearGradient id="g1" x1="0%" y1="0%" x2="100%" y2="100%">
+      <stop offset="0%" stop-color="#2d6a4f"/>
+      <stop offset="50%" stop-color="#52b788"/>
+      <stop offset="100%" stop-color="#95d5b2"/>
+    </linearGradient>
+    <filter id="f1">
+      <feTurbulence type="fractalNoise" baseFrequency="0.007" numOctaves="4" seed="30"/>
+      <feDisplacementMap in="SourceGraphic" scale="60"/>
+    </filter>
+  </defs>
+  <rect width="100%" height="100%" fill="url(#g1)"/>
+  <rect width="100%" height="100%" fill="url(#g1)" filter="url(#f1)" opacity="0.5"/>
+</svg>

data/assets/backgrounds/gradients/neon.svg

@@ -0,0 +1,15 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="800" height="400" viewBox="0 0 800 400">
+  <defs>
+    <linearGradient id="g1" x1="0%" y1="0%" x2="100%" y2="100%">
+      <stop offset="0%" stop-color="#ff006e"/>
+      <stop offset="50%" stop-color="#8338ec"/>
+      <stop offset="100%" stop-color="#3a86ff"/>
+    </linearGradient>
+    <filter id="f1">
+      <feTurbulence type="fractalNoise" baseFrequency="0.006" numOctaves="5" seed="42"/>
+      <feDisplacementMap in="SourceGraphic" scale="80"/>
+    </filter>
+  </defs>
+  <rect width="100%" height="100%" fill="url(#g1)"/>
+  <rect width="100%" height="100%" fill="url(#g1)" filter="url(#f1)" opacity="0.6"/>
+</svg>

data/assets/backgrounds/gradients/plum.svg

@@ -0,0 +1,15 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="800" height="400" viewBox="0 0 800 400">
+  <defs>
+    <linearGradient id="g1" x1="0%" y1="0%" x2="100%" y2="100%">
+      <stop offset="0%" stop-color="#4a0e4e"/>
+      <stop offset="50%" stop-color="#812f85"/>
+      <stop offset="100%" stop-color="#c77dff"/>
+    </linearGradient>
+    <filter id="f1">
+      <feTurbulence type="fractalNoise" baseFrequency="0.006" numOctaves="4" seed="15"/>
+      <feDisplacementMap in="SourceGraphic" scale="65"/>
+    </filter>
+  </defs>
+  <rect width="100%" height="100%" fill="url(#g1)"/>
+  <rect width="100%" height="100%" fill="url(#g1)" filter="url(#f1)" opacity="0.5"/>
+</svg>

data/assets/backgrounds/gradients/sunrise.svg

@@ -0,0 +1,15 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="800" height="400" viewBox="0 0 800 400">
+  <defs>
+    <linearGradient id="g1" x1="0%" y1="0%" x2="100%" y2="100%">
+      <stop offset="0%" stop-color="#ff6b35"/>
+      <stop offset="50%" stop-color="#f7c59f"/>
+      <stop offset="100%" stop-color="#efefd0"/>
+    </linearGradient>
+    <filter id="f1">
+      <feTurbulence type="fractalNoise" baseFrequency="0.008" numOctaves="4" seed="7"/>
+      <feDisplacementMap in="SourceGraphic" scale="60"/>
+    </filter>
+  </defs>
+  <rect width="100%" height="100%" fill="url(#g1)"/>
+  <rect width="100%" height="100%" fill="url(#g1)" filter="url(#f1)" opacity="0.5"/>
+</svg>

data/assets/backgrounds/noise/air.svg

@@ -0,0 +1,8 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="300" height="300" viewBox="0 0 300 300">
+  <filter id="n1">
+    <feTurbulence type="fractalNoise" baseFrequency="0.65" numOctaves="3" stitchTiles="stitch"/>
+    <feColorMatrix type="saturate" values="0"/>
+  </filter>
+  <rect width="100%" height="100%" fill="transparent"/>
+  <rect width="100%" height="100%" filter="url(#n1)" opacity="0.04"/>
+</svg>

data/assets/backgrounds/noise/aqua.svg

@@ -0,0 +1,8 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="300" height="300" viewBox="0 0 300 300">
+  <filter id="n1">
+    <feTurbulence type="fractalNoise" baseFrequency="0.7" numOctaves="3" stitchTiles="stitch"/>
+    <feColorMatrix type="saturate" values="0"/>
+  </filter>
+  <rect width="100%" height="100%" fill="transparent"/>
+  <rect width="100%" height="100%" filter="url(#n1)" opacity="0.05"/>
+</svg>