Refactor assets loading (#3295)

DL6ER · web-flow · commit ebb219bff469 · 2025-03-23T19:05:02.000+01:00
diff --git a/gravity.lp b/gravity.lp
@@ -27,5 +27,5 @@ mg.include('scripts/lua/header_authenticated.lp','r')
 <button type="button" id="gravityBtn" class="btn btn-lg btn-primary btn-block">Update</button>
 <pre id="output" style="width: 100%; height: 100%;" hidden></pre>
 
-<script src="<?=pihole.fileversion('scripts/js/gravity.js')?>"></script>
+<script defer src="<?=pihole.fileversion('scripts/js/gravity.js')?>"></script>
 <? mg.include('scripts/lua/footer.lp','r')?>
diff --git a/groups-clients.lp b/groups-clients.lp
@@ -95,10 +95,10 @@ mg.include('scripts/lua/header_authenticated.lp','r')
     </div>
 </div>
 
-<script src="<?=pihole.fileversion('vendor/bootstrap-select/bootstrap-select.min.js')?>"></script>
-<script src="<?=pihole.fileversion('vendor/bootstrap-toggle/bootstrap-toggle.min.js')?>"></script>
-<script src="<?=pihole.fileversion('scripts/js/ip-address-sorting.js')?>"></script>
-<script src="<?=pihole.fileversion('scripts/js/groups-common.js')?>"></script>
-<script src="<?=pihole.fileversion('scripts/js/groups-clients.js')?>"></script>
+<script defer src="<?=pihole.fileversion('vendor/bootstrap-select/bootstrap-select.min.js')?>"></script>
+<script defer src="<?=pihole.fileversion('vendor/bootstrap-toggle/bootstrap-toggle.min.js')?>"></script>
+<script defer src="<?=pihole.fileversion('scripts/js/ip-address-sorting.js')?>"></script>
+<script defer src="<?=pihole.fileversion('scripts/js/groups-common.js')?>"></script>
+<script defer src="<?=pihole.fileversion('scripts/js/groups-clients.js')?>"></script>
 
 <? mg.include('scripts/lua/footer.lp','r')?>
diff --git a/groups-domains.lp b/groups-domains.lp
@@ -156,9 +156,9 @@ mg.include('scripts/lua/header_authenticated.lp','r')
     </div>
 </div>
 
-<script src="<?=pihole.fileversion('vendor/bootstrap-select/bootstrap-select.min.js')?>"></script>
-<script src="<?=pihole.fileversion('vendor/bootstrap-toggle/bootstrap-toggle.min.js')?>"></script>
-<script src="<?=pihole.fileversion('scripts/js/groups-common.js')?>"></script>
-<script src="<?=pihole.fileversion('scripts/js/groups-domains.js')?>"></script>
+<script defer src="<?=pihole.fileversion('vendor/bootstrap-select/bootstrap-select.min.js')?>"></script>
+<script defer src="<?=pihole.fileversion('vendor/bootstrap-toggle/bootstrap-toggle.min.js')?>"></script>
+<script defer src="<?=pihole.fileversion('scripts/js/groups-common.js')?>"></script>
+<script defer src="<?=pihole.fileversion('scripts/js/groups-domains.js')?>"></script>
 
 <? mg.include('scripts/lua/footer.lp','r')?>
diff --git a/groups-lists.lp b/groups-lists.lp
@@ -94,9 +94,9 @@ mg.include('scripts/lua/header_authenticated.lp','r')
     </div>
 </div>
 
-<script src="<?=pihole.fileversion('vendor/bootstrap-select/bootstrap-select.min.js')?>"></script>
-<script src="<?=pihole.fileversion('vendor/bootstrap-toggle/bootstrap-toggle.min.js')?>"></script>
-<script src="<?=pihole.fileversion('scripts/js/groups-common.js')?>"></script>
-<script src="<?=pihole.fileversion('scripts/js/groups-lists.js')?>"></script>
+<script defer src="<?=pihole.fileversion('vendor/bootstrap-select/bootstrap-select.min.js')?>"></script>
+<script defer src="<?=pihole.fileversion('vendor/bootstrap-toggle/bootstrap-toggle.min.js')?>"></script>
+<script defer src="<?=pihole.fileversion('scripts/js/groups-common.js')?>"></script>
+<script defer src="<?=pihole.fileversion('scripts/js/groups-lists.js')?>"></script>
 
 <? mg.include('scripts/lua/footer.lp','r')?>
diff --git a/groups.lp b/groups.lp
@@ -79,9 +79,9 @@ mg.include('scripts/lua/header_authenticated.lp','r')
     </div>
 </div>
 
-<script src="<?=pihole.fileversion('vendor/bootstrap-select/bootstrap-select.min.js')?>"></script>
-<script src="<?=pihole.fileversion('vendor/bootstrap-toggle/bootstrap-toggle.min.js')?>"></script>
-<script src="<?=pihole.fileversion('scripts/js/groups-common.js')?>"></script>
-<script src="<?=pihole.fileversion('scripts/js/groups.js')?>"></script>
+<script defer src="<?=pihole.fileversion('vendor/bootstrap-select/bootstrap-select.min.js')?>"></script>
+<script defer src="<?=pihole.fileversion('vendor/bootstrap-toggle/bootstrap-toggle.min.js')?>"></script>
+<script defer src="<?=pihole.fileversion('scripts/js/groups-common.js')?>"></script>
+<script defer src="<?=pihole.fileversion('scripts/js/groups.js')?>"></script>
 
 <? mg.include('scripts/lua/footer.lp','r')?>
diff --git a/index.lp b/index.lp
@@ -279,7 +279,7 @@ mg.include('scripts/lua/header_authenticated.lp','r')
 </div>
 <!-- /.row -->
 
-<script src="<?=pihole.fileversion('scripts/js/charts.js')?>"></script>
-<script src="<?=pihole.fileversion('scripts/js/index.js')?>"></script>
+<script defer src="<?=pihole.fileversion('scripts/js/charts.js')?>"></script>
+<script defer src="<?=pihole.fileversion('scripts/js/index.js')?>"></script>
 
 <? mg.include('scripts/lua/footer.lp','r')?>
diff --git a/interfaces.lp b/interfaces.lp
@@ -32,5 +32,5 @@ mg.include('scripts/lua/header_authenticated.lp','r')
 
 <pre id="output" style="width: 100%; height: 100%;" hidden></pre>
 
-<script src="<?=pihole.fileversion('scripts/js/interfaces.js')?>"></script>
+<script defer src="<?=pihole.fileversion('scripts/js/interfaces.js')?>"></script>
 <? mg.include('scripts/lua/footer.lp','r')?>
diff --git a/login.lp b/login.lp
@@ -117,7 +117,7 @@ mg.include('scripts/lua/header.lp','r')
         <strong><a href="https://pi-hole.net/donate/" rel="noopener" target="_blank"><i class="fa fa-heart text-red"></i> Donate</a></strong> if you found this useful.
     </div>
 </div>
-<script src="<?=pihole.fileversion('scripts/js/footer.js')?>"></script>
-<script src="<?=pihole.fileversion('scripts/js/login.js')?>"></script>
+<script defer src="<?=pihole.fileversion('scripts/js/footer.js')?>"></script>
+<script defer src="<?=pihole.fileversion('scripts/js/login.js')?>"></script>
 </body>
 </html>
diff --git a/messages.lp b/messages.lp
@@ -41,6 +41,6 @@ mg.include('scripts/lua/header_authenticated.lp','r')
     </div>
 </div>
 
-<script src="<?=pihole.fileversion('scripts/js/messages.js')?>"></script>
+<script defer src="<?=pihole.fileversion('scripts/js/messages.js')?>"></script>
 
 <? mg.include('scripts/lua/footer.lp','r')?>
diff --git a/network.lp b/network.lp
@@ -64,7 +64,7 @@ mg.include('scripts/lua/header_authenticated.lp','r')
 </div>
 <!-- /.row -->
 
-<script src="<?=pihole.fileversion('scripts/js/ip-address-sorting.js')?>"></script>
-<script src="<?=pihole.fileversion('scripts/js/network.js')?>"></script>
+<script defer src="<?=pihole.fileversion('scripts/js/ip-address-sorting.js')?>"></script>
+<script defer src="<?=pihole.fileversion('scripts/js/network.js')?>"></script>
 
 <? mg.include('scripts/lua/footer.lp','r')?>
diff --git a/queries.lp b/queries.lp
@@ -194,9 +194,9 @@ mg.include('scripts/lua/header_authenticated.lp','r')
 </div>
 <!-- /.row -->
 
-<script src="<?=pihole.fileversion('vendor/bootstrap-select/bootstrap-select.min.js')?>"></script>
-<script src="<?=pihole.fileversion('scripts/js/ip-address-sorting.js')?>"></script>
-<script src="<?=pihole.fileversion('vendor/daterangepicker/daterangepicker.min.js')?>"></script>
-<script src="<?=pihole.fileversion('scripts/js/queries.js')?>"></script>
+<script defer src="<?=pihole.fileversion('vendor/bootstrap-select/bootstrap-select.min.js')?>"></script>
+<script defer src="<?=pihole.fileversion('vendor/daterangepicker/daterangepicker.min.js')?>"></script>
+<script defer src="<?=pihole.fileversion('scripts/js/queries.js')?>"></script>
+<script defer src="<?=pihole.fileversion('scripts/js/ip-address-sorting.js')?>"></script>
 
 <? mg.include('scripts/lua/footer.lp','r')?>
diff --git a/scripts/lua/footer.lp b/scripts/lua/footer.lp
@@ -66,7 +66,7 @@ end
 
 </div>
 <!-- ./wrapper -->
-<script src="<?=pihole.fileversion('scripts/js/footer.js')?>"></script>
+<script defer src="<?=pihole.fileversion('scripts/js/footer.js')?>"></script>
 
 <div id="advanced-info-data" style="display: none;" data-starttime="<?=starttime?>" data-endtime="<?=mg.time(true)?>" data-client-ip="<?=mg.request_info.remote_addr?>" data-xff="<?=x_forwarded_for?>"></div>
 </body>
diff --git a/scripts/lua/header.lp b/scripts/lua/header.lp
@@ -64,18 +64,8 @@ is_authenticated = mg.request_info.is_authenticated
     <link rel="shortcut icon" href="<?=webhome?>img/favicons/favicon.ico">
     <meta name="msapplication-TileColor" content="<?=theme.color?>">
     <meta name="msapplication-TileImage" content="<?=webhome?>img/favicons/mstile-150x150.png">
-
-    <!-- Theme styles -->
     <meta name="theme-color" content="<?=theme.color?>">
 
-<? if theme.dark then ?>
-    <style>
-        html { background-color: #000; }
-    </style>
-<? end ?>
-    <script src="<?=pihole.fileversion('vendor/nprogress/nprogress.min.js')?>"></script>
-    <link rel="stylesheet" href="<?=pihole.fileversion('vendor/nprogress/nprogress.min.css')?>">
-
     <!-- Theme fonts -->
 <? if theme.name == 'lcars' then ?>
     <link rel="stylesheet" href="<?=pihole.fileversion('vendor/fonts/ubuntu-mono/ubuntu-mono.css')?>">
@@ -84,13 +74,20 @@ is_authenticated = mg.request_info.is_authenticated
     <link rel="stylesheet" href="<?=pihole.fileversion('vendor/fonts/source-sans-pro/source-sans-pro.css')?>">
 <? end ?>
 
+<? if theme.dark then ?>
+    <style>
+        html { background-color: #000; }
+    </style>
+<? end ?>
+
     <!-- Common styles -->
     <link rel="stylesheet" href="<?=pihole.fileversion('vendor/bootstrap/css/bootstrap.min.css')?>">
     <link rel="stylesheet" href="<?=pihole.fileversion('vendor/animate/animate.min.css')?>">
     <link rel="stylesheet" href="<?=pihole.fileversion('vendor/bstreeview/bstreeview.min.css')?>">
     <link rel="stylesheet" href="<?=pihole.fileversion('vendor/font-awesome/css/all.min.css')?>">
-<?
-if startsWith(scriptname, 'groups') then
+    <link rel="stylesheet" href="<?=pihole.fileversion('vendor/nprogress/nprogress.min.css')?>">
+
+<? if startsWith(scriptname, 'groups') then
     -- Group management styles
 ?>
     <link rel="stylesheet" href="<?=pihole.fileversion('vendor/bootstrap-select/bootstrap-select.min.css')?>">
@@ -102,20 +99,26 @@ if startsWith(scriptname, 'groups') then
     <link rel="stylesheet" href="<?=pihole.fileversion('vendor/daterangepicker/daterangepicker.min.css')?>">
     <link rel="stylesheet" href="<?=pihole.fileversion('vendor/bootstrap-toggle/bootstrap-toggle.min.css')?>">
 <? end ?>
+    <link rel="stylesheet" href="<?=pihole.fileversion('vendor/waitMe/waitMe.min.css')?>">
     <link rel="stylesheet" href="<?=pihole.fileversion('vendor/select2/select2.min.css')?>">
     <link rel="stylesheet" href="<?=pihole.fileversion('vendor/adminLTE/AdminLTE.min.css')?>">
 
-    <!-- Theme styles -->
+    <!-- Theme styles (<?= theme.name ?>) -->
     <link rel="stylesheet" href="<?=pihole.fileversion('style/pi-hole.css')?>">
-    <link rel="stylesheet" href="<?=pihole.fileversion('style/themes/'..theme.name..'.css')?>">
+<? if theme.name == "default-auto" then ?>
+    <link rel="stylesheet" href="<?=pihole.fileversion('style/themes/default-dark.css')?>" media="(prefers-color-scheme: dark)">
+    <link rel="stylesheet" href="<?=pihole.fileversion('style/themes/default-light.css')?>" media="not (prefers-color-scheme: dark)">
+<? else ?>
+    <link rel="stylesheet" href="<?=pihole.fileversion('style/themes/' ..theme.name.. '.css')?>">
+<? end ?>
 
     <noscript><link rel="stylesheet" href="<?=pihole.fileversion('vendor/js-warn/js-warn.css')?>"></noscript>
 
     <!-- scripts -->
-    <script src="<?=pihole.fileversion('vendor/jquery/jquery.min.js')?>"></script>
-    <script src="<?=pihole.fileversion('vendor/bootstrap/js/bootstrap.min.js')?>"></script>
-    <script src="<?=pihole.fileversion('vendor/adminLTE/adminlte.min.js')?>"></script>
-    <script src="<?=pihole.fileversion('vendor/bootstrap-notify/bootstrap-notify.min.js')?>"></script>
-    <script src="<?=pihole.fileversion('scripts/js/utils.js')?>"></script>
-    <script src="<?=pihole.fileversion('vendor/waitMe/waitMe.min.js')?>"></script>
-    <link rel="stylesheet" href="<?=pihole.fileversion('vendor/waitMe/waitMe.min.css')?>">
+    <script defer src="<?=pihole.fileversion('vendor/jquery/jquery.min.js')?>"></script>
+    <script defer src="<?=pihole.fileversion('vendor/bootstrap/js/bootstrap.min.js')?>"></script>
+    <script defer src="<?=pihole.fileversion('vendor/adminLTE/adminlte.min.js')?>"></script>
+    <script defer src="<?=pihole.fileversion('vendor/bootstrap-notify/bootstrap-notify.min.js')?>"></script>
+    <script defer src="<?=pihole.fileversion('vendor/waitMe/waitMe.min.js')?>"></script>
+    <script defer src="<?=pihole.fileversion('vendor/nprogress/nprogress.min.js')?>"></script>
+    <script defer src="<?=pihole.fileversion('scripts/js/utils.js')?>"></script>
diff --git a/scripts/lua/header_authenticated.lp b/scripts/lua/header_authenticated.lp
@@ -9,18 +9,18 @@
 ]]--
 mg.include('header.lp','r')
 ?>
-    <script src="<?=pihole.fileversion('scripts/js/logout.js')?>"></script>
-    <script src="<?=pihole.fileversion('vendor/select2/select2.min.js')?>"></script>
-    <script src="<?=pihole.fileversion('vendor/datatables/datatables.min.js')?>"></script>
-    <script src="<?=pihole.fileversion('vendor/datatables-select/datatables.select.min.js')?>"></script>
-    <script src="<?=pihole.fileversion('vendor/datatables-buttons/datatables.buttons.min.js')?>"></script>
-    <script src="<?=pihole.fileversion('vendor/chartjs/chart.umd.js')?>"></script>
-    <script src="<?=pihole.fileversion('vendor/chartjs-plugin-deferred/chartjs-plugin-deferred.min.js')?>"></script>
-    <script src="<?=pihole.fileversion('vendor/moment/moment.min.js')?>"></script>
-    <script src="<?=pihole.fileversion('vendor/chartjs-adapter-moment/chartjs-adapter-moment.js')?>"></script>
-    <script src="<?=pihole.fileversion('vendor/hammer/hammer.min.js')?>"></script> <!-- Needed for chartjs-plugin-zoom -->
-    <script src="<?=pihole.fileversion('vendor/chartjs-plugin-zoom/chartjs-plugin-zoom.min.js')?>"></script>
-    <script src="<?=pihole.fileversion('vendor/bstreeview/bstreeview.min.js')?>"></script>
+    <script defer src="<?=pihole.fileversion('vendor/select2/select2.min.js')?>"></script>
+    <script defer src="<?=pihole.fileversion('vendor/datatables/datatables.min.js')?>"></script>
+    <script defer src="<?=pihole.fileversion('vendor/datatables-select/datatables.select.min.js')?>"></script>
+    <script defer src="<?=pihole.fileversion('vendor/datatables-buttons/datatables.buttons.min.js')?>"></script>
+    <script defer src="<?=pihole.fileversion('vendor/chartjs/chart.umd.js')?>"></script>
+    <script defer src="<?=pihole.fileversion('vendor/chartjs-plugin-deferred/chartjs-plugin-deferred.min.js')?>"></script>
+    <script defer src="<?=pihole.fileversion('vendor/moment/moment.min.js')?>"></script>
+    <script defer src="<?=pihole.fileversion('vendor/chartjs-adapter-moment/chartjs-adapter-moment.js')?>"></script>
+    <script defer src="<?=pihole.fileversion('vendor/hammer/hammer.min.js')?>"></script> <!-- Needed for chartjs-plugin-zoom -->
+    <script defer src="<?=pihole.fileversion('vendor/chartjs-plugin-zoom/chartjs-plugin-zoom.min.js')?>"></script>
+    <script defer src="<?=pihole.fileversion('vendor/bstreeview/bstreeview.min.js')?>"></script>
+    <script defer src="<?=pihole.fileversion('scripts/js/logout.js')?>"></script>
 </head>
 <body class="<?=theme.name?> hold-transition sidebar-mini <? if pihole.boxedlayout() then ?>layout-boxed<? end ?> logged-in" data-apiurl="<?=pihole.api_url()?>">
 <noscript>
diff --git a/search.lp b/search.lp
@@ -48,5 +48,5 @@ mg.include('scripts/lua/header_authenticated.lp','r')
 
 <pre id="output" style="width: 100%; height: 100%;" hidden></pre>
 
-<script src="<?=pihole.fileversion('scripts/js/search.js')?>"></script>
+<script defer src="<?=pihole.fileversion('scripts/js/search.js')?>"></script>
 <? mg.include('scripts/lua/footer.lp','r')?>
diff --git a/settings-all.lp b/settings-all.lp
@@ -32,8 +32,8 @@ mg.include('scripts/lua/settings_header.lp','r')
         <button type="button" class="btn btn-primary save-button"><i class="fa-solid fa-fw fa-floppy-disk"></i>&nbsp;Save & Apply</button>
     </div>
 </div>
-<script src="<?=pihole.fileversion('vendor/bootstrap-toggle/bootstrap-toggle.min.js')?>"></script>
-<script src="<?=pihole.fileversion('scripts/js/settings-advanced.js')?>"></script>
-<script src="<?=pihole.fileversion('scripts/js/settings.js')?>"></script>
+<script defer src="<?=pihole.fileversion('vendor/bootstrap-toggle/bootstrap-toggle.min.js')?>"></script>
+<script defer src="<?=pihole.fileversion('scripts/js/settings-advanced.js')?>"></script>
+<script defer src="<?=pihole.fileversion('scripts/js/settings.js')?>"></script>
 
 <? mg.include('scripts/lua/footer.lp','r')?>
diff --git a/settings-api.lp b/settings-api.lp
@@ -246,10 +246,10 @@ mg.include('scripts/lua/settings_header.lp','r')
     </div>
 </div>
 
-<script src="<?=pihole.fileversion('vendor/bootstrap-toggle/bootstrap-toggle.min.js')?>"></script>
-<script src="<?=pihole.fileversion('vendor/jquery-confirm/jquery.confirm.min.js')?>"></script>
-<script src="<?=pihole.fileversion('vendor/qrious/qrious.min.js')?>"></script>
-<script src="<?=pihole.fileversion('scripts/js/settings-api.js')?>"></script>
-<script src="<?=pihole.fileversion('scripts/js/settings.js')?>"></script>
+<script defer src="<?=pihole.fileversion('vendor/bootstrap-toggle/bootstrap-toggle.min.js')?>"></script>
+<script defer src="<?=pihole.fileversion('vendor/jquery-confirm/jquery.confirm.min.js')?>"></script>
+<script defer src="<?=pihole.fileversion('vendor/qrious/qrious.min.js')?>"></script>
+<script defer src="<?=pihole.fileversion('scripts/js/settings-api.js')?>"></script>
+<script defer src="<?=pihole.fileversion('scripts/js/settings.js')?>"></script>
 
 <? mg.include('scripts/lua/footer.lp','r')?>
diff --git a/settings-dhcp.lp b/settings-dhcp.lp
@@ -225,9 +225,9 @@ mg.include('scripts/lua/settings_header.lp','r')
         <button type="button" class="btn btn-primary save-button"><i class="fa-solid fa-fw fa-floppy-disk"></i>&nbsp;Save & Apply</button>
     </div>
 </div>
-<script src="<?=pihole.fileversion('vendor/bootstrap-toggle/bootstrap-toggle.min.js')?>"></script>
-<script src="<?=pihole.fileversion('scripts/js/settings-dhcp.js')?>"></script>
-<script src="<?=pihole.fileversion('scripts/js/ip-address-sorting.js')?>"></script>
-<script src="<?=pihole.fileversion('scripts/js/settings.js')?>"></script>
+<script defer src="<?=pihole.fileversion('vendor/bootstrap-toggle/bootstrap-toggle.min.js')?>"></script>
+<script defer src="<?=pihole.fileversion('scripts/js/settings-dhcp.js')?>"></script>
+<script defer src="<?=pihole.fileversion('scripts/js/ip-address-sorting.js')?>"></script>
+<script defer src="<?=pihole.fileversion('scripts/js/settings.js')?>"></script>
 
 <? mg.include('scripts/lua/footer.lp','r')?>
diff --git a/settings-dns.lp b/settings-dns.lp
@@ -238,8 +238,8 @@ mg.include('scripts/lua/settings_header.lp','r')
         <button type="button" class="btn btn-primary save-button"><i class="fa-solid fa-fw fa-floppy-disk"></i>&nbsp;Save & Apply</button>
     </div>
 </div>
-<script src="<?=pihole.fileversion('vendor/bootstrap-toggle/bootstrap-toggle.min.js')?>"></script>
-<script src="<?=pihole.fileversion('scripts/js/settings-dns.js')?>"></script>
-<script src="<?=pihole.fileversion('scripts/js/settings.js')?>"></script>
+<script defer src="<?=pihole.fileversion('vendor/bootstrap-toggle/bootstrap-toggle.min.js')?>"></script>
+<script defer src="<?=pihole.fileversion('scripts/js/settings-dns.js')?>"></script>
+<script defer src="<?=pihole.fileversion('scripts/js/settings.js')?>"></script>
 
 <? mg.include('scripts/lua/footer.lp','r')?>
diff --git a/settings-dnsrecords.lp b/settings-dnsrecords.lp
@@ -107,10 +107,10 @@ mg.include('scripts/lua/settings_header.lp','r')
         </div>
     </div>
 </div>
-<script src="<?=pihole.fileversion('vendor/bootstrap-toggle/bootstrap-toggle.min.js')?>"></script>
-<script src="<?=pihole.fileversion('vendor/jquery-confirm/jquery.confirm.min.js')?>"></script>
-<script src="<?=pihole.fileversion('scripts/js/settings-dns-records.js')?>"></script>
-<script src="<?=pihole.fileversion('scripts/js/ip-address-sorting.js')?>"></script>
-<script src="<?=pihole.fileversion('scripts/js/settings.js')?>"></script>
+<script defer src="<?=pihole.fileversion('vendor/bootstrap-toggle/bootstrap-toggle.min.js')?>"></script>
+<script defer src="<?=pihole.fileversion('vendor/jquery-confirm/jquery.confirm.min.js')?>"></script>
+<script defer src="<?=pihole.fileversion('scripts/js/settings-dns-records.js')?>"></script>
+<script defer src="<?=pihole.fileversion('scripts/js/ip-address-sorting.js')?>"></script>
+<script defer src="<?=pihole.fileversion('scripts/js/settings.js')?>"></script>
 
 <? mg.include('scripts/lua/footer.lp','r')?>
diff --git a/settings-privacy.lp b/settings-privacy.lp
diff --git a/settings-system.lp b/settings-system.lp
diff --git a/settings-teleporter.lp b/settings-teleporter.lp
diff --git a/style/themes/default-auto.css b/style/themes/default-auto.css
diff --git a/taillog.lp b/taillog.lp
