jekyll-theme-zer0 0.10.0 → 0.10.4

data/_layouts/sitemap-collection.html

@@ -1,5 +1,5 @@
 ---
-layout: default
+layout: root
 ---
 <!--
   ===================================================================
@@ -8,9 +8,9 @@ layout: default
   
   File: sitemap-collection.html
   Path: _layouts/sitemap-collection.html
-  Inherits: default.html
+  Inherits: root.html
   Purpose: Unified layout combining collection display with site statistics
-           and comprehensive site structure overview
+           and comprehensive site structure overview (full-width, no sidebars)
   
   Features:
   - Complete site overview with statistics
@@ -419,29 +419,6 @@ document.addEventListener('DOMContentLoaded', function() {
     });
   });
   
-  // Add fade-in animation to cards
-  const observerOptions = {
-    threshold: 0.1,
-    rootMargin: '0px 0px -50px 0px'
-  };
-  
-  const observer = new IntersectionObserver(function(entries) {
-    entries.forEach(entry => {
-      if (entry.isIntersecting) {
-        entry.target.style.opacity = '1';
-        entry.target.style.transform = 'translateY(0)';
-      }
-    });
-  }, observerOptions);
-  
-  // Observe all cards for animation
-  document.querySelectorAll('.card').forEach(card => {
-    card.style.opacity = '0';
-    card.style.transform = 'translateY(20px)';
-    card.style.transition = 'opacity 0.6s ease, transform 0.6s ease';
-    observer.observe(card);
-  });
-  
   // Add click tracking for analytics (optional)
   document.querySelectorAll('a[href]').forEach(link => {
     link.addEventListener('click', function() {

data/_sass/custom.scss

@@ -177,23 +177,31 @@ img {
     height: auto;
 }
 
+// ============================================
+// NAVBAR - Fixed positioning with auto-hide
+// ============================================
+// Uses Bootstrap's fixed-top class for positioning (z-index: 1030)
+// JavaScript adds/removes .navbar-hidden class on scroll
+
 #navbar {
-    // position: fixed;
-    top: 0;
-    width: 100%;
-    transition: transform 0.3s;
+    // Transition for smooth hide/show animation
+    transition: transform 0.3s ease-in-out !important;
+    
+    // Ensure navbar background is opaque
+    background-color: var(--bs-body-bg);
 }
 
-.fixed-navbar {
-    position: fixed;
-    top: 0;
-    width: 100%;
-    transition: transform 0.3s;
+// Hidden state - slides up out of view
+// Using higher specificity to override Bootstrap's fixed-top
+#navbar.navbar-hidden {
+    transform: translateY(-100%) !important;
 }
 
-.hide-navbar {
-    transform: translateY(-100%);
-    top: 0px;
+// Respect user's motion preferences
+@media (prefers-reduced-motion: reduce) {
+    #navbar {
+        transition: none !important;
+    }
 }
 
 $enable-cssgrid: true;

data/assets/js/auto-hide-nav.js

@@ -1,18 +1,81 @@
-// Hides the navbar when scrolling down half a page and shows it when scrolling up
-window.onload = function() {
-    let lastScrollTop = 0;
-    const navbar = document.getElementById('navbar');
-
-    window.addEventListener('scroll', function() {
-        let scrollTop = window.pageYOffset || document.documentElement.scrollTop;
-        let halfPageHeight = window.innerHeight / 2;
-
-        if (scrollTop > lastScrollTop && scrollTop > halfPageHeight) {
-            navbar.classList.add('hide-navbar');
-            navbar.classList.add('fixed-navbar');
-        } else {
-            navbar.classList.remove('hide-navbar');
+/**
+ * Auto-hide navbar on scroll
+ * 
+ * Behavior:
+ * - Navbar is fixed at top and visible by default
+ * - Hides when scrolling DOWN past a threshold (100px)
+ * - Reappears when scrolling UP
+ * - Respects prefers-reduced-motion accessibility setting
+ * - Adds body padding to prevent content jump
+ */
+(function() {
+    'use strict';
+
+    // Configuration
+    const SCROLL_THRESHOLD = 100; // Pixels before hide/show triggers
+    const SCROLL_DELTA = 5; // Minimum scroll distance to trigger change
+
+    document.addEventListener('DOMContentLoaded', function() {
+        const navbar = document.getElementById('navbar');
+        if (!navbar) return;
+
+        let lastScrollTop = 0;
+        let ticking = false;
+
+        // Check for reduced motion preference
+        const prefersReducedMotion = window.matchMedia('(prefers-reduced-motion: reduce)').matches;
+
+        // Calculate and set body padding to prevent content jump
+        function updateBodyPadding() {
+            const navbarHeight = navbar.offsetHeight;
+            document.body.style.paddingTop = navbarHeight + 'px';
+        }
+
+        // Initial padding setup
+        updateBodyPadding();
+
+        // Update padding on window resize
+        window.addEventListener('resize', updateBodyPadding, { passive: true });
+
+        // Scroll handler
+        function handleScroll() {
+            const scrollTop = window.pageYOffset || document.documentElement.scrollTop;
+            const scrollDelta = scrollTop - lastScrollTop;
+
+            // Only trigger if scroll delta exceeds minimum threshold
+            if (Math.abs(scrollDelta) < SCROLL_DELTA) {
+                ticking = false;
+                return;
+            }
+
+            if (scrollDelta > 0 && scrollTop > SCROLL_THRESHOLD) {
+                // Scrolling DOWN past threshold - hide navbar
+                navbar.classList.add('navbar-hidden');
+            } else if (scrollDelta < 0) {
+                // Scrolling UP - show navbar
+                navbar.classList.remove('navbar-hidden');
+            }
+
+            // Always show navbar when at top of page
+            if (scrollTop <= 0) {
+                navbar.classList.remove('navbar-hidden');
+            }
+
+            lastScrollTop = Math.max(0, scrollTop);
+            ticking = false;
+        }
+
+        // Optimized scroll listener using requestAnimationFrame
+        window.addEventListener('scroll', function() {
+            if (!ticking) {
+                window.requestAnimationFrame(handleScroll);
+                ticking = true;
+            }
+        }, { passive: true });
+
+        // Disable animations if user prefers reduced motion
+        if (prefersReducedMotion) {
+            navbar.style.transition = 'none';
         }
-        lastScrollTop = scrollTop;
     });
-}
+})();

data/scripts/lib/preview_generator.py

@@ -234,13 +234,13 @@ class PreviewGenerator:
         return safe_name[:50]  # Limit length
     
     def generate_image_openai(self, prompt: str, output_path: Path) -> GenerationResult:
-        """Generate image using OpenAI DALL-E."""
-        if not HAS_OPENAI:
+        """Generate image using OpenAI DALL-E via HTTP API (no SDK required)."""
+        if not HAS_REQUESTS:
             return GenerationResult(
                 success=False,
                 image_path=None,
                 preview_url=None,
-                error="openai package not installed. Run: pip install openai",
+                error="requests package not installed. Run: pip install requests",
                 prompt_used=prompt,
             )
         
@@ -255,8 +255,6 @@ class PreviewGenerator:
             )
         
         try:
-            client = OpenAI(api_key=api_key)
-            
             self.debug(f"Generating with prompt: {prompt[:200]}...")
             
             # Parse size
@@ -267,27 +265,29 @@ class PreviewGenerator:
             }
             size = size_map.get(self.image_size, "1024x1024")
             
-            response = client.images.generate(
-                model="dall-e-3",
-                prompt=prompt,
-                size=size,
-                quality="standard",
-                n=1,
+            # Use HTTP API directly instead of SDK
+            response = requests.post(
+                "https://api.openai.com/v1/images/generations",
+                headers={
+                    "Authorization": f"Bearer {api_key}",
+                    "Content-Type": "application/json",
+                },
+                json={
+                    "model": "dall-e-3",
+                    "prompt": prompt,
+                    "size": size,
+                    "quality": "standard",
+                    "n": 1,
+                },
+                timeout=120,  # 2 minute timeout for image generation
             )
+            response.raise_for_status()
             
-            image_url = response.data[0].url
+            data = response.json()
+            image_url = data['data'][0]['url']
             
             # Download image
-            if not HAS_REQUESTS:
-                return GenerationResult(
-                    success=False,
-                    image_path=None,
-                    preview_url=image_url,
-                    error="requests package not installed. Run: pip install requests",
-                    prompt_used=prompt,
-                )
-            
-            img_response = requests.get(image_url)
+            img_response = requests.get(image_url, timeout=60)
             img_response.raise_for_status()
             
             output_path.write_bytes(img_response.content)
@@ -300,6 +300,21 @@ class PreviewGenerator:
                 prompt_used=prompt,
             )
             
+        except requests.exceptions.HTTPError as e:
+            error_msg = str(e)
+            try:
+                error_data = e.response.json()
+                if 'error' in error_data:
+                    error_msg = error_data['error'].get('message', str(e))
+            except:
+                pass
+            return GenerationResult(
+                success=False,
+                image_path=None,
+                preview_url=None,
+                error=error_msg,
+                prompt_used=prompt,
+            )
         except Exception as e:
             return GenerationResult(
                 success=False,

data/scripts/test-mermaid.sh

@@ -13,7 +13,8 @@
 #   --docker     Test Docker container
 ###############################################################################
 
-set -euo pipefail
+# Note: Removed -e flag to avoid SIGPIPE issues with pipelines (curl | grep)
+set -uo pipefail
 
 # Colors for output
 RED='\033[0;31m'
@@ -132,24 +133,63 @@ test_url() {
 test_mermaid_script() {
     local url="$1"
     local description="$2"
+    local response
+    local count
     
-    run_test "$description" "curl -s '$url' | grep -q 'mermaid.min.js'"
+    TOTAL_TESTS=$((TOTAL_TESTS + 1))
+    response=$(curl -s "$url" 2>/dev/null) || true
+    count=$(echo "$response" | grep -c 'mermaid.min.js' || true)
+    if [ "$count" -gt 0 ]; then
+        TESTS_PASSED=$((TESTS_PASSED + 1))
+        log_success "$description"
+        return 0
+    else
+        TESTS_FAILED=$((TESTS_FAILED + 1))
+        log_error "$description"
+        return 1
+    fi
 }
 
 # Test Mermaid initialization
 test_mermaid_init() {
     local url="$1"
     local description="$2"
+    local response
+    local count
     
-    run_test "$description" "curl -s '$url' | grep -q 'mermaid.initialize'"
+    TOTAL_TESTS=$((TOTAL_TESTS + 1))
+    response=$(curl -s "$url" 2>/dev/null) || true
+    count=$(echo "$response" | grep -c 'mermaid.initialize' || true)
+    if [ "$count" -gt 0 ]; then
+        TESTS_PASSED=$((TESTS_PASSED + 1))
+        log_success "$description"
+        return 0
+    else
+        TESTS_FAILED=$((TESTS_FAILED + 1))
+        log_error "$description"
+        return 1
+    fi
 }
 
 # Test diagram rendering
 test_diagram_rendering() {
     local url="$1"
     local description="$2"
+    local response
+    local count
     
-    run_test "$description" "curl -s '$url' | grep -q 'class=\"mermaid\"'"
+    TOTAL_TESTS=$((TOTAL_TESTS + 1))
+    response=$(curl -s "$url" 2>/dev/null) || true
+    count=$(echo "$response" | grep -c 'class="mermaid"' || true)
+    if [ "$count" -gt 0 ]; then
+        TESTS_PASSED=$((TESTS_PASSED + 1))
+        log_success "$description"
+        return 0
+    else
+        TESTS_FAILED=$((TESTS_FAILED + 1))
+        log_error "$description"
+        return 1
+    fi
 }
 
 # Main test execution
@@ -165,9 +205,9 @@ main() {
     log_info "Testing core files..."
     
     test_file_exists "_includes/components/mermaid.html" "Mermaid include file exists"
-    test_file_exists "pages/_docs/jekyll/mermaid.md" "Main documentation exists"
-    test_file_exists "pages/_docs/jekyll/mermaid-test-suite.md" "Test suite exists"
-    test_file_exists "pages/_docs/jekyll/jekyll-diagram-with-mermaid.md" "Tutorial exists"
+    test_file_exists "docs/jekyll/mermaid.md" "Main documentation exists"
+    test_file_exists "docs/jekyll/mermaid-test-suite.md" "Test suite exists"
+    test_file_exists "docs/jekyll/jekyll-diagram-with-mermaid.md" "Tutorial exists"
     
     # Configuration tests
     log_info "Testing configuration..."
@@ -188,10 +228,10 @@ main() {
     # Documentation tests
     log_info "Testing documentation..."
     
-    test_file_content "pages/_docs/jekyll/mermaid.md" "mermaid: true" "Main docs have front matter"
-    test_file_content "pages/_docs/jekyll/mermaid-test-suite.md" "mermaid: true" "Test suite has front matter"
-    test_file_content "pages/_docs/jekyll/mermaid.md" "graph TD" "Main docs have examples"
-    test_file_content "pages/_docs/jekyll/mermaid-test-suite.md" "graph TD" "Test suite has examples"
+    test_file_content "docs/jekyll/mermaid.md" "mermaid: true" "Main docs have front matter"
+    test_file_content "docs/jekyll/mermaid-test-suite.md" "mermaid: true" "Test suite has front matter"
+    test_file_content "docs/jekyll/mermaid.md" "graph TD" "Main docs have examples"
+    test_file_content "docs/jekyll/mermaid-test-suite.md" "graph TD" "Test suite has examples"
     
     # Server tests (if not quick mode)
     if [ "$QUICK" = false ]; then

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: jekyll-theme-zer0
 version: !ruby/object:Gem::Version
-  version: 0.10.0
+  version: 0.10.4
 platform: ruby
 authors:
 - Amr Abdel
@@ -161,7 +161,24 @@ files:
 - assets/images/gravatar-small.png
 - assets/images/gravatar.png
 - assets/images/info-banner-mountain-wizard.png
+- assets/images/previews/10-ai-tools-that-will-transform-your-productivity-.png
+- assets/images/previews/business.png
+- assets/images/previews/css-grid-mastery-build-any-layout-you-can-imagine.png
+- assets/images/previews/development.png
 - assets/images/previews/git-workflow-best-practices-for-modern-teams.png
+- assets/images/previews/github-setup-deployment.png
+- assets/images/previews/jekyll-setup.png
+- assets/images/previews/machine-setup.png
+- assets/images/previews/published-documentation-library.png
+- assets/images/previews/quantum-computing-explained-from-qubits-to-quantum.png
+- assets/images/previews/science.png
+- assets/images/previews/technology.png
+- assets/images/previews/the-complete-guide-to-startup-funding-in-2025.png
+- assets/images/previews/the-remote-work-revolution-how-global-teams-are-re.png
+- assets/images/previews/tutorial.png
+- assets/images/previews/world-news.png
+- assets/images/previews/zer0-mistakes-news-network-building-dynamic-news-s.png
+- assets/images/previews/zer0-mistakes-quick-start-guide.png
 - assets/images/wizard-on-journey.png
 - assets/images/zer0-checkpoint-1.png
 - assets/images/zer0-checkpoint-2.png