[3.12] pythongh-121035: Improve logging flow diagram for dark/light modes. (pythonGH-121254)

(cherry picked from commit bfe0e4d)

Co-authored-by: Vinay Sajip <[email protected]>

Author: vsajip

Doc/howto/logging.rst

@@ -384,6 +384,44 @@ following diagram.
 .. raw:: html
    :file: logging_flow.svg
 
+.. raw:: html
+
+   <script>
+   /*
+    * This snippet is needed to handle the case where a light or dark theme is
+    * chosen via the theme is selected in the page. We call the existing handler
+    * and then add a dark-theme class to the body when the dark theme is selected.
+    * The SVG styling (above) then does the rest.
+    *
+    * If the pydoc theme is updated to set the dark-theme class, this snippet
+    * won't be needed any more.
+    */
+   (function() {
+     var oldActivateTheme = activateTheme;
+
+     function updateBody(theme) {
+        let elem = document.body;
+
+        if (theme === 'dark') {
+            elem.classList.add('dark-theme');
+        }
+        else {
+            elem.classList.remove('dark-theme');
+        }
+     }
+
+     activateTheme = function(theme) {
+        oldActivateTheme(theme);
+        updateBody(theme);
+     };
+     /*
+      * If the page is refreshed, make sure we update the body - the overriding
+      * of activateTheme won't have taken effect yet.
+      */
+      updateBody(localStorage.getItem('currentTheme') || 'auto');
+   })();
+   </script>
+
 Loggers
 ^^^^^^^