Updated Wiki content

build.ps1

@@ -86,6 +86,18 @@ if (Test-Path Home.md) {
     Copy-Item Home.md docs\index.md
 }
 
+# Make sure MkDocs can see custom CSS/JS during the build
+New-Item -ItemType Directory -Force -Path "docs/assets/stylesheets" | Out-Null
+New-Item -ItemType Directory -Force -Path "docs/assets/javascripts" | Out-Null
+
+if (Test-Path "web_extras\extra.css") {
+    Copy-Item "web_extras\extra.css" "docs/assets/stylesheets/extra.css" -Force
+}
+
+if (Test-Path "web_extras\icon-theme.js") {
+    Copy-Item "web_extras\icon-theme.js" "docs/assets/javascripts/icon-theme.js" -Force
+}
+
 Write-Host "Converting GitHub image URLs to local paths..."
 
 if ($DownloadSvg) {
@@ -103,6 +115,19 @@ if ($DownloadSvg) {
             Write-Host "Downloading: $filename"
             Invoke-WebRequest -Uri $rawUrl -OutFile $localPath -UseBasicParsing
         }
+
+        # If a *_dark.svg is referenced, also download the non-dark variant for light mode
+        if ($filename -match '_dark(\.svg.*)$') {
+            $lightFile = $filename -replace '_dark(\.svg.*)$', '$1'
+            $lightLocalPath = "docs\images\orcaslicer-icons\$lightFile"
+
+            if (-not (Test-Path $lightLocalPath)) {
+                $lightUrl = $url -replace '_dark(\.svg.*)$', '$1'
+                $lightRawUrl = $lightUrl -replace 'github.com/OrcaSlicer/OrcaSlicer/blob/main', 'raw.githubusercontent.com/OrcaSlicer/OrcaSlicer/main'
+                Write-Host "Downloading: $lightFile"
+                Invoke-WebRequest -Uri $lightRawUrl -OutFile $lightLocalPath -UseBasicParsing
+            }
+        }
     }
 } else {
     Write-Host "Skipping SVG icon download (use --download-svg or -d to enable)"
@@ -199,6 +224,7 @@ Write-Host "Copying extra web assets to wiki folder..."
 # Ensure target directories exist
 New-Item -ItemType Directory -Path "wiki\assets\stylesheets" -Force | Out-Null
 New-Item -ItemType Directory -Path "wiki\assets\images" -Force | Out-Null
+New-Item -ItemType Directory -Path "wiki\assets\javascripts" -Force | Out-Null
 
 # Copy extra.css
 if (Test-Path "web_extras\extra.css") {
@@ -223,6 +249,13 @@ if (Test-Path "web_extras\OrcaSlicer.png") {
     Write-Host "Warning: web_extras\OrcaSlicer.png not found - skipping" -ForegroundColor Yellow
 }
 
+if (Test-Path "web_extras\icon-theme.js") {
+    Copy-Item "web_extras\icon-theme.js" "wiki\assets\javascripts\icon-theme.js" -Force
+    Write-Host "Copied icon-theme.js"
+} else {
+    Write-Host "Warning: web_extras\icon-theme.js not found - skipping" -ForegroundColor Yellow
+}
+
 if (Test-Path "web_extras") {
     New-Item -ItemType Directory -Path "wiki\web_extras" -Force | Out-Null
     Copy-Item -Path "web_extras\*" -Destination "wiki\web_extras" -Recurse -Force -ErrorAction SilentlyContinue

build.sh

@@ -93,6 +93,19 @@ if [ "$DOWNLOAD_SVG" = true ]; then
       echo "  Downloading: $filename"
       curl -sL "$raw_url" -o "$local_path" 2>/dev/null || true
     fi
+
+    # If this is a *_dark.svg icon, also fetch the light variant so theme swapping works offline
+    if echo "$filename" | grep -q "_dark\\.svg"; then
+      light_filename=$(echo "$filename" | sed 's/_dark\\(\\.svg.*\\)/\\1/')
+      light_local_path="docs/images/orcaslicer-icons/$light_filename"
+
+      if [ ! -f "$light_local_path" ]; then
+        light_url=$(echo "$url" | sed 's/_dark\\(\\.svg.*\\)/\\1/')
+        light_raw_url=$(echo "$light_url" | sed 's|github.com/OrcaSlicer/OrcaSlicer/blob/main|raw.githubusercontent.com/OrcaSlicer/OrcaSlicer/main|')
+        echo "  Downloading: $light_filename"
+        curl -sL "$light_raw_url" -o "$light_local_path" 2>/dev/null || true
+      fi
+    fi
   done
 else
   echo "Skipping SVG icon download (use --download-svg or -d to enable)"
@@ -117,6 +130,11 @@ find docs -name "*.md" -type f | while read md_file; do
   sed -i "s|https://github.com/OrcaSlicer/OrcaSlicer/blob/main/resources/images/\([^?]*\)?raw=true|${prefix}images/orcaslicer-icons/\1|g" "$md_file"
 done
 
+# Ensure MkDocs can find custom assets during the build
+mkdir -p docs/assets/stylesheets docs/assets/javascripts
+[ -f "web_extras/extra.css" ] && cp "web_extras/extra.css" docs/assets/stylesheets/extra.css
+[ -f "web_extras/icon-theme.js" ] && cp "web_extras/icon-theme.js" docs/assets/javascripts/icon-theme.js
+
 # Build mkdocs and output to wiki folder
 mkdocs build --site-dir wiki
 
@@ -182,6 +200,7 @@ rm -rf docs
 echo "Copying extra web assets to wiki folder..."
 mkdir -p wiki/assets/stylesheets
 mkdir -p wiki/assets/images
+mkdir -p wiki/assets/javascripts
 
 # Copy shared assets that complement MkDocs' static site output
 if [ -f "web_extras/extra.css" ]; then
@@ -202,6 +221,12 @@ else
   echo "Warning: web_extras/OrcaSlicer.png not found - skipping"
 fi
 
+if [ -f "web_extras/icon-theme.js" ]; then
+  cp "web_extras/icon-theme.js" wiki/assets/javascripts/icon-theme.js
+else
+  echo "Warning: web_extras/icon-theme.js not found - skipping"
+fi
+
 if [ -d "web_extras" ]; then
   mkdir -p wiki/web_extras
   cp -r web_extras/* wiki/web_extras/ 2>/dev/null || true

mkdocs.yml

@@ -38,6 +38,9 @@ theme:
 extra_css:
   - assets/stylesheets/extra.css
 
+extra_javascript:
+  - assets/javascripts/icon-theme.js
+
 plugins:
   - search
   - gh-admonitions   # converts github annotions to admonition

web_extras/icon-theme.js

@@ -0,0 +1,55 @@
+(function () {
+  const tracked = new Set();
+
+  const ensureTracked = (img) => {
+    if (img.dataset.lightSrc && img.dataset.darkSrc) {
+      tracked.add(img);
+      return;
+    }
+
+    const src = img.getAttribute('src') || '';
+    const match = src.match(/^(.*)_dark(\.svg(?:\?.*)?)$/i);
+    if (!match) return;
+
+    img.dataset.darkSrc = src;
+    img.dataset.lightSrc = `${match[1]}${match[2]}`;
+    tracked.add(img);
+  };
+
+  const applyTheme = () => {
+    const dark = (document.body?.dataset?.mdColorScheme || '').toLowerCase() === 'slate';
+    tracked.forEach((img) => {
+      const target = dark ? img.dataset.darkSrc : img.dataset.lightSrc;
+      if (target && img.getAttribute('src') !== target) {
+        img.setAttribute('src', target);
+      }
+    });
+  };
+
+  const refresh = () => {
+    document.querySelectorAll('img').forEach(ensureTracked);
+    applyTheme();
+  };
+
+  const onReady = () => refresh();
+
+  if (document.readyState === 'loading') {
+    document.addEventListener('DOMContentLoaded', onReady, { once: true });
+  } else {
+    onReady();
+  }
+
+  if (window.document$ && typeof window.document$.subscribe === 'function') {
+    window.document$.subscribe(onReady);
+  }
+
+  const observer = new MutationObserver((mutations) => {
+    if (mutations.some((m) => m.attributeName === 'data-md-color-scheme')) {
+      applyTheme();
+    }
+  });
+
+  if (document.body) {
+    observer.observe(document.body, { attributes: true, attributeFilter: ['data-md-color-scheme'] });
+  }
+})();