Obey browser color scheme and created renderHead function for reuse in SQL companion views

footer.php

@@ -0,0 +1 @@
+

head.php

@@ -1,3 +1,8 @@
+<?php
+    function renderHead()
+    {
+        ?>
+
             <meta name="viewport" content="initial-scale=1, width=device-width" />
 
             <link rel="stylesheet" href="/files/bootstrap-5.3.8-dist/css/bootstrap.min.css" />
@@ -13,6 +18,14 @@
 
             <script>
                 $(function() {
-        $("body").attr("data-bs-theme", "");
+                    const colorSchemeQuery = window.matchMedia("(prefers-color-scheme: dark)").matches;
+
+                    if (colorSchemeQuery)
+                        $("body").attr("data-bs-theme", "dark");
                 });
             </script>
+        <?php
+    }
+?>
+
+<?php renderHead(); ?>

pages/run.php

@@ -216,7 +216,7 @@
     </div>
 </div>
 
-        <div class="navbar navbar-expand bg-light navbar-light d-print-none" id="title-navbar">
+        <div class="navbar navbar-expand bg-secondary-subtle navbar-light d-print-none" id="title-navbar">
             <div class="container-fluid justify-content-between">
                 <div class="d-inline-flex align-items-center">
                     <span class="navbar-brand text-wrap"><?= $strTitle; ?></span>
@@ -438,7 +438,7 @@
                         <div class="mb-3">
                             <label>Source</label>
                             <div class="w-100">
-                                <textarea class="w-100 border-0 bg-light p-3" id="source-preview" readonly><?= $strFileDataSource; ?></textarea>
+                                <textarea class="w-100 border-0 bg-secondary-subtle p-3" id="source-preview" readonly><?= $strFileDataSource; ?></textarea>
                             </div>
                         </div>
                     </div>