Make the web version use svg images which work in both light and dark mode, while keeping extlink.png for IE/.chm support.

ISHelp/ISHelpGen/ISHelpGen.dpr

@@ -13,7 +13,7 @@ uses
   UIsxclassesParser in 'UIsxclassesParser.pas';
 
 const
-  Version = '1.16';
+  Version = '1.17';
 
   XMLFileVersion = '1';
 
@@ -404,7 +404,7 @@ begin
           if Pos('ms-its:', S) = 1 then
             Result := Result + Format('<a href="%s">%s</a>', [S, ParseFormattedText(Node)])
           else
-            Result := Result + Format('<a href="%s" target="_blank" title="%s">%s</a><img src="images/extlink.png" alt=" [external link]" />',
+            Result := Result + Format('<a href="%s" target="_blank" title="%s">%s</a><img src="images/extlink.png" srcset="images/extlink.svg" alt=" [external link]" />',
               [S, S, ParseFormattedText(Node)]);
         end;
       elHeading:
@@ -696,7 +696,7 @@ var
 
   procedure AddLeaf(const Title, TopicName: String);
   begin
-    SL.Add(Format('<tr><td><img src="images/contentstopic.png" alt="" /></td>' +
+    SL.Add(Format('<tr><td><img src="images/contentstopic.svg" alt="" /></td>' +
       '<td><a href="%s" target="bodyframe">%s</a></td></tr>',
       [EscapeHTML(GenerateTopicLink(TopicName, '')), EscapeHTML(Title)]));
   end;

ISHelp/Staging/contents.js

@@ -80,7 +80,7 @@ function toggle_node(id)
 	objContent.style.display = expanding ? "" : "none";
 
 	document.getElementById("nodeimg_" + id).src =
-		expanding ? "images/contentsheadopen.png" : "images/contentsheadclosed.png";
+		expanding ? "images/contentsheadopen.svg" : "images/contentsheadclosed.svg";
 
 	if (expanding) {
 		// Scroll expanded items into view. This is similar to calling scrollIntoView() but

ISHelp/Staging/images/contentsheadclosed.svg

@@ -0,0 +1,7 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="16px" height="16px" viewBox="0 0 16 16" enable-background="new 0 0 16 16" xml:space="preserve">
+  <g id="icon">
+    <path d="M4.779,1.455l6.442,6.524l-6.442,6.524" fill="none" stroke="#7A7672" stroke-width="1.1" stroke-miterlimit="50"/>
+  </g>
+</svg>

ISHelp/Staging/images/contentsheadopen.svg

@@ -0,0 +1,7 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="16px" height="16px" viewBox="0 0 16 16" enable-background="new 0 0 16 16" xml:space="preserve">
+  <g id="icon">
+    <path d="M14.524,4.758L8,11.2L1.476,4.758" fill="none" stroke="#7A7672" stroke-width="1.1" stroke-miterlimit="50"/>
+  </g>
+</svg>

ISHelp/Staging/images/contentstopic.svg

@@ -0,0 +1,9 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="16px" height="16px" viewBox="0 0 16 16" enable-background="new 0 0 16 16" xml:space="preserve">
+  <g id="icon">
+    <circle cx="7.5" cy="7.5" r="7" fill="none" stroke="#228BCB" stroke-width="1" stroke-miterlimit="50"/>
+    <path d="M4.977,4.908C5.357,4.107,6.165,3.5,7.4,3.5c1.754,0,2.723,1.133,2.7,2.381c-0.023,1.225,-0.796,1.659,-1.488,2.026c-0.588,0.309,-1.12,0.561,-1.108,1.27v0.815" fill="none" stroke="#228BCB" stroke-width="1" stroke-miterlimit="50"/>
+    <rect x="6.7" y="11" width="1.6" height="1.3" fill="#238BCB"/>
+  </g>
+</svg>

ISHelp/Staging/images/extlink.svg

@@ -0,0 +1,8 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="16px" height="16px" viewBox="0 0 16 16" enable-background="new 0 0 16 16" xml:space="preserve">
+  <g id="icon">
+    <path d="M12.45,12.45c-2.734,2.734,-7.166,2.734,-9.899,0s-2.734,-7.166,0,-9.899s7.166,-2.734,9.899,0S15.183,9.716,12.45,12.45z" fill="none" stroke="#228BCB" stroke-width="1" stroke-miterlimit="50"/>
+    <path d="M5,4.5h5.5v5.5M4.406,10.594L10.25,4.75" fill="none" stroke="#228BCB" stroke-width="1" stroke-miterlimit="50"/>
+  </g>
+</svg>