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
@@ -238,4 +271,4 @@ Write-Host "`nBuild complete! HTML files are in the wiki/ folder." -ForegroundCo
 if ($host.Name -match 'ConsoleHost|Windows PowerShell ISE') {
     Write-Host "`nPress Enter to close this window..." -ForegroundColor Yellow
     Read-Host | Out-Null
-}
+}

build.sh

@@ -85,7 +85,7 @@ if [ "$DOWNLOAD_SVG" = true ]; then
     # Extract filename from URL
     filename=$(basename "$url")
     local_path="docs/images/orcaslicer-icons/$filename"
-    
+
     # Download if not already cached
     if [ ! -f "$local_path" ]; then
       # Convert blob URL to raw URL
@@ -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)"
@@ -102,21 +115,26 @@ find docs -name "*.md" -type f | while read md_file; do
   # Calculate relative path to images based on file depth
   depth=$(echo "$md_file" | tr -cd '/' | wc -c)
   depth=$((depth - 1))  # Subtract 1 for "docs/"
-  
+
   prefix=""
   for ((i=0; i<depth; i++)); do
     prefix="../$prefix"
   done
-  
+
   # Replace OrcaSlicer_WIKI GitHub URLs with relative paths
   sed -i '' "s|https://github.com/OrcaSlicer/OrcaSlicer_WIKI/blob/main/images/\([^?]*\)?raw=true|${prefix}images/\1|g" "$md_file" 2>/dev/null || \
   sed -i "s|https://github.com/OrcaSlicer/OrcaSlicer_WIKI/blob/main/images/\([^?]*\)?raw=true|${prefix}images/\1|g" "$md_file"
-  
+
   # Replace OrcaSlicer main repo icon URLs with local paths
   sed -i '' "s|https://github.com/OrcaSlicer/OrcaSlicer/blob/main/resources/images/\([^?]*\)?raw=true|${prefix}images/orcaslicer-icons/\1|g" "$md_file" 2>/dev/null || \
   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
 
@@ -127,35 +145,35 @@ create_redirects() {
   find wiki -name "*.html" -type f ! -name "index.html" | while read html_file; do
     # Get the relative path from wiki/
     rel_path="${html_file#wiki/}"
-    
+
     # Extract the filename without .html extension
     filename=$(basename "$rel_path" .html)
-    
+
     # Skip files already at root level
     dir_of_file=$(dirname "$rel_path")
     if [ "$dir_of_file" = "." ]; then
       continue
     fi
-    
+
     # Create redirect directory at root level (for clean URLs without .html)
     redirect_dir="wiki/${filename}"
-    
+
     # Skip if directory already exists (could be a real content directory)
     if [ -d "$redirect_dir" ]; then
       continue
     fi
-    
+
     mkdir -p "$redirect_dir"
     redirect_file="${redirect_dir}/index.html"
-    
+
     # Calculate relative path from redirect directory to target
     # Redirect is at wiki/filename/, target is at wiki/rel_path
     # So we need to go up one level (../) then to rel_path
     relative_url="../${rel_path}"
-    
+
     # URL encode spaces in the path
     encoded_url=$(python3 -c "import urllib.parse, sys; print(urllib.parse.quote(sys.argv[1]))" "${relative_url}" 2>/dev/null || echo "${relative_url}" | sed 's/ /%20/g')
-    
+
     # Create redirect HTML content
     cat > "$redirect_file" <<EOF
 <!DOCTYPE html>
@@ -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

@@ -34,10 +34,13 @@ theme:
         name: Switch to light mode
   font: false # default font only pulls font with 300, 400, 400i and 700 weight
               # pulled fonts with CSS method. Fonts are pulled from Google and its same for Defaut behaviour
-  
+
 extra_css:
   - assets/stylesheets/extra.css
 
+extra_javascript:
+  - assets/javascripts/icon-theme.js
+
 plugins:
   - search
   - gh-admonitions   # converts github annotions to admonition
@@ -59,13 +62,13 @@ markdown_extensions:
   - admonition
   - pymdownx.details  # For collapsible admonitions
   - pymdownx.superfences
-  
+
 extra:
   generator: false # hides "Made with Material for MkDocs" from footer
   social:          # adds links tofooter
-    - icon: fontawesome/brands/github 
+    - icon: fontawesome/brands/github
       link: https://github.com/OrcaSlicer/OrcaSlicer
-    - icon: fontawesome/brands/discord 
+    - icon: fontawesome/brands/discord
       link: https://discord.gg/P4VE9UY9gJ
 
 copyright: Copyright © 2022-2025 Li Jiang. All rights reserved.

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'] });
+  }
+})();