From 4799825738b9f5f078bf3a13ed10cc9bf0379542 Mon Sep 17 00:00:00 2001
From: billz <billzimmerman@gmail.com>
Date: Thu, 24 Oct 2024 00:06:13 -0700
Subject: [PATCH] Process templates w/ bootstrap-5-migrate-tool

---
 templates/about.php                 | 30 +++++++--------
 templates/about/general.php         |  8 ++--
 templates/adblock.php               | 10 ++---
 templates/adblock/custom.php        |  8 ++--
 templates/adblock/general.php       | 16 ++++----
 templates/adblock/logging.php       |  2 +-
 templates/adblock/stats.php         |  2 +-
 templates/admin.php                 | 16 ++++----
 templates/configure_client.php      | 10 ++---
 templates/dashboard.php             |  8 ++--
 templates/data_usage.php            | 14 +++----
 templates/dhcp.php                  | 14 +++----
 templates/dhcp/advanced.php         | 14 +++----
 templates/dhcp/general.php          | 58 ++++++++++++++---------------
 templates/dhcp/logging.php          | 16 ++++----
 templates/dhcp/static_leases.php    |  6 +--
 templates/exception.php             |  4 +-
 templates/hostapd.php               | 20 +++++-----
 templates/hostapd/advanced.php      | 36 +++++++++---------
 templates/hostapd/basic.php         |  8 ++--
 templates/hostapd/logging.php       | 10 ++---
 templates/hostapd/security.php      |  4 +-
 templates/networking.php            |  4 +-
 templates/openvpn.php               | 18 ++++-----
 templates/openvpn/configs.php       |  4 +-
 templates/openvpn/general.php       | 20 +++++-----
 templates/openvpn/logging.php       | 10 ++---
 templates/provider.php              |  8 ++--
 templates/provider/general.php      | 10 ++---
 templates/provider/status.php       |  2 +-
 templates/restapi.php               |  8 ++--
 templates/restapi/general.php       |  4 +-
 templates/restapi/status.php        |  2 +-
 templates/system.php                | 28 +++++++-------
 templates/system/advanced.php       |  6 +--
 templates/system/basic.php          |  6 +--
 templates/system/language.php       |  2 +-
 templates/system/theme.php          |  2 +-
 templates/system/tools.php          | 12 +++---
 templates/torproxy.php              | 28 +++++++-------
 templates/wg/general.php            | 40 ++++++++++----------
 templates/wg/logging.php            |  6 +--
 templates/wg/peers.php              | 20 +++++-----
 templates/wifi_stations.php         |  6 +--
 templates/wifi_stations/network.php | 16 ++++----
 templates/wireguard.php             | 10 ++---
 46 files changed, 293 insertions(+), 293 deletions(-)

diff --git a/templates/about.php b/templates/about.php
index 8e1be914..9adb9a35 100755
--- a/templates/about.php
+++ b/templates/about.php
@@ -9,7 +9,7 @@ require_once 'app/lib/Parsedown.php';
       <div class="card-header">
         <div class="row">
           <div class="col">
-            <i class="fas fa-info-circle mr-2"></i><?php echo _("About RaspAP"); ?>
+            <i class="fas fa-info-circle me-2"></i><?php echo _("About RaspAP"); ?>
           </div>
         </div><!-- ./row -->
       </div><!-- ./card-header -->
@@ -17,9 +17,9 @@ require_once 'app/lib/Parsedown.php';
 
         <!-- Nav tabs -->
         <ul class="nav nav-tabs">
-          <li class="nav-item"><a class="nav-link active" href="#aboutgeneral" data-toggle="tab"><?php echo _("About"); ?></a></li>
-          <li class="nav-item"><a class="nav-link" href="#aboutsponsors" data-toggle="tab"><?php echo _("Insiders"); ?></a></li>
-          <li class="nav-item"><a class="nav-link" href="#aboutcontrib" data-toggle="tab"><?php echo _("Contributing"); ?></a></li>
+          <li class="nav-item"><a class="nav-link active" href="#aboutgeneral" data-bs-toggle="tab"><?php echo _("About"); ?></a></li>
+          <li class="nav-item"><a class="nav-link" href="#aboutsponsors" data-bs-toggle="tab"><?php echo _("Insiders"); ?></a></li>
+          <li class="nav-item"><a class="nav-link" href="#aboutcontrib" data-bs-toggle="tab"><?php echo _("Contributing"); ?></a></li>
         </ul>
         <!-- /.nav-tabs -->
 
@@ -43,7 +43,7 @@ require_once 'app/lib/Parsedown.php';
     <div class="modal-content">
       <form id="performUpdate" class="needs-validation" novalidate>
         <div class="modal-header">
-          <div class="modal-title" id="ModalLabel"><i class="fas fa-sync-alt fa-spin mr-2" id="updateSync"></i><?php echo _("Check for update"); ?></div>
+          <div class="modal-title" id="ModalLabel"><i class="fas fa-sync-alt fa-spin me-2" id="updateSync"></i><?php echo _("Check for update"); ?></div>
         </div>
         <div class="modal-body">
           <div class="col-md-12 mb-3 mt-1" id="msg-check-update"><?php echo _("New release check in progress..."); ?></div>
@@ -52,7 +52,7 @@ require_once 'app/lib/Parsedown.php';
           <div id="msgUpdate" data-message="<?php echo _("A new release is available: Version"); ?>"></div>
           <div id="msgLatest" data-message="<?php echo _("Installed version is the latest release."); ?>"></div>
           <div id="msgInstall" data-message="<?php echo _("Install this update now?"); ?>"></div>
-          <button type="button" data-message="<?php echo _("OK"); ?>" id="js-check-dismiss" class="btn btn-outline-secondary" data-dismiss="modal"><?php echo _("Cancel"); ?></button>
+          <button type="button" data-message="<?php echo _("OK"); ?>" id="js-check-dismiss" class="btn btn-outline-secondary" data-bs-dismiss="modal"><?php echo _("Cancel"); ?></button>
           <button type="submit" id="js-sys-check-update" class="btn btn-outline btn-primary collapse"><?php echo _("OK"); ?></button>
         </div>
       </form>
@@ -65,22 +65,22 @@ require_once 'app/lib/Parsedown.php';
   <div class="modal-dialog" role="document">
     <div class="modal-content">
       <div class="modal-header">
-      <div class="modal-title" id="ModalLabel"><i class="fas fa-sync-alt fa-spin mr-2" id="updateSync2"></i><?php echo _("Update in progress"); ?></div>
+      <div class="modal-title" id="ModalLabel"><i class="fas fa-sync-alt fa-spin me-2" id="updateSync2"></i><?php echo _("Update in progress"); ?></div>
       </div>
       <div class="modal-body">
         <div class="col-md-12 mb-3 mt-1" id="msg-check-update"><?php echo _("Application is being updated..."); ?></div>
-        <div class="ml-5"><i class="fas fa-check mr-2 invisible" id="updateStep1"></i><?php echo _("Configuring update"); ?></div>
-        <div class="ml-5"><i class="fas fa-check mr-2 invisible" id="updateStep2"></i><?php echo _("Updating sources"); ?></div>
-        <div class="ml-5"><i class="fas fa-check mr-2 invisible" id="updateStep3"></i><?php echo _("Installing package updates"); ?></div>
-        <div class="ml-5"><i class="fas fa-check mr-2 invisible" id="updateStep4"></i><?php echo _("Downloading latest files"); ?></div>
-        <div class="ml-5"><i class="fas fa-check mr-2 invisible" id="updateStep5"></i><?php echo _("Installing application"); ?></div>
-        <div class="ml-5 mb-1"><i class="fas fa-check mr-2 invisible" id="updateStep6"></i><?php echo _("Update complete"); ?></div>
-        <div class="ml-5 mb-3"><i class="fas mr-2 invisible" id="updateMsg"></i></div>
+        <div class="ms-5"><i class="fas fa-check me-2 invisible" id="updateStep1"></i><?php echo _("Configuring update"); ?></div>
+        <div class="ms-5"><i class="fas fa-check me-2 invisible" id="updateStep2"></i><?php echo _("Updating sources"); ?></div>
+        <div class="ms-5"><i class="fas fa-check me-2 invisible" id="updateStep3"></i><?php echo _("Installing package updates"); ?></div>
+        <div class="ms-5"><i class="fas fa-check me-2 invisible" id="updateStep4"></i><?php echo _("Downloading latest files"); ?></div>
+        <div class="ms-5"><i class="fas fa-check me-2 invisible" id="updateStep5"></i><?php echo _("Installing application"); ?></div>
+        <div class="ms-5 mb-1"><i class="fas fa-check me-2 invisible" id="updateStep6"></i><?php echo _("Update complete"); ?></div>
+        <div class="ms-5 mb-3"><i class="fas me-2 invisible" id="updateMsg"></i></div>
         <div id="errorMsg" data-message="<?php echo _("An error occurred. Check the log at <code>/tmp/raspap_install.log</code>"); ?>"></div>
         <div id="successMsg" data-message="<?php echo _("Success. Refresh this page to confirm the new version."); ?>"></div>
       </div>
       <div class="modal-footer">
-      <button type="button" class="btn btn-outline btn-primary" data-dismiss="modal" disabled id="updateOk" /><?php echo _("OK"); ?></button>
+      <button type="button" class="btn btn-outline btn-primary" data-bs-dismiss="modal" disabled id="updateOk" /><?php echo _("OK"); ?></button>
       </div>
     </div>
   </div>
diff --git a/templates/about/general.php b/templates/about/general.php
index ba7ea3c0..212136ea 100644
--- a/templates/about/general.php
+++ b/templates/about/general.php
@@ -4,11 +4,11 @@
     <div class="col-md-6 mt-3">
       <div class="card">
 	    <div class="card-body">
-          <div class="ml-5 mt-2"><img class="about-logo" src="app/img/raspAP-logo.php" style="width: 175px; height:175px"></div>
-          <h2 class="mt-3 ml-4"><?php echo _("RaspAP") ." v".RASPI_VERSION; ?></h2>
+          <div class="ms-5 mt-2"><img class="about-logo" src="app/img/raspAP-logo.php" style="width: 175px; height:175px"></div>
+          <h2 class="mt-3 ms-4"><?php echo _("RaspAP") ." v".RASPI_VERSION; ?></h2>
           <?php if (!RASPI_MONITOR_ENABLED) : ?>
-          <button type="button" class="btn btn-warning ml-4 mt-2" name="check-update" data-toggle="modal" data-target="#chkupdateModal" />
-            <i class="fas fa-sync-alt ml-1 mr-2"></i><?php echo _("Check for update"); ?>
+          <button type="button" class="btn btn-warning ms-4 mt-2" name="check-update" data-bs-toggle="modal" data-bs-target="#chkupdateModal" />
+            <i class="fas fa-sync-alt ms-1 me-2"></i><?php echo _("Check for update"); ?>
           </button>
           <?php endif; ?>
         </div>
diff --git a/templates/adblock.php b/templates/adblock.php
index 6493100b..b51d6dd8 100755
--- a/templates/adblock.php
+++ b/templates/adblock.php
@@ -15,10 +15,10 @@
         <div class="card-header">
           <div class="row">
             <div class="col">
-              <i class="far fa-hand-paper mr-2"></i><?php echo _("Ad Blocking"); ?>
+              <i class="far fa-hand-paper me-2"></i><?php echo _("Ad Blocking"); ?>
             </div>
             <div class="col">
-              <button class="btn btn-light btn-icon-split btn-sm service-status float-right">
+              <button class="btn btn-light btn-icon-split btn-sm service-status float-end">
                 <span class="icon text-gray-600"><i class="fas fa-circle service-status-<?php echo $serviceStatus ?>"></i></span>
                 <span class="text service-status">adblock <?php echo _($serviceStatus) ?></span>
               </button>
@@ -31,9 +31,9 @@
             <?php echo CSRFTokenFieldTag() ?>
             <!-- Nav tabs -->
             <ul class="nav nav-tabs">
-                <li class="nav-item"><a class="nav-link active" id="blocklisttab" href="#adblocklistsettings" data-toggle="tab"><?php echo _("Blocklist settings"); ?></a></li>
-                <li class="nav-item"><a class="nav-link" id="customtab" href="#adblockcustom" data-toggle="tab"><?php echo _("Custom blocklist"); ?></a></li>
-                <li class="nav-item"><a class="nav-link" id="logoutputtab" href="#adblocklogfileoutput" data-toggle="tab"><?php echo _("Logging"); ?></a></li>
+                <li class="nav-item"><a class="nav-link active" id="blocklisttab" href="#adblocklistsettings" data-bs-toggle="tab"><?php echo _("Blocklist settings"); ?></a></li>
+                <li class="nav-item"><a class="nav-link" id="customtab" href="#adblockcustom" data-bs-toggle="tab"><?php echo _("Custom blocklist"); ?></a></li>
+                <li class="nav-item"><a class="nav-link" id="logoutputtab" href="#adblocklogfileoutput" data-bs-toggle="tab"><?php echo _("Logging"); ?></a></li>
             </ul>
 
             <!-- Tab panes -->
diff --git a/templates/adblock/custom.php b/templates/adblock/custom.php
index 5a6e930c..bb5cdc56 100644
--- a/templates/adblock/custom.php
+++ b/templates/adblock/custom.php
@@ -5,9 +5,9 @@
       <div class="col-md-6">
         <div class="input-group">
           <input type="hidden" name="adblock-custom-enable" value="0">
-          <div class="custom-control custom-switch">
-            <input class="custom-control-input" id="adblock-custom-enable" type="checkbox" name="adblock-custom-enable" value="1" <?php echo $custom_enabled ? ' checked="checked"' : "" ?> aria-describedby="adblock-description">
-          <label class="custom-control-label" for="adblock-custom-enable"><?php echo _("Enable custom blocklist") ?></label>
+          <div class="form-check form-switch">
+            <input class="form-check-input" id="adblock-custom-enable" type="checkbox" name="adblock-custom-enable" value="1" <?php echo $custom_enabled ? ' checked="checked"' : "" ?> aria-describedby="adblock-description">
+          <label class="form-check-label" for="adblock-custom-enable"><?php echo _("Enable custom blocklist") ?></label>
           </div>
         </div>
         <p id="adblock-description">
@@ -20,7 +20,7 @@
       </div>
     </div>
     <div class="row">
-      <div class="form-group col-md-8">
+      <div class="mb-3 col-md-8">
       <?php echo '<textarea class="logoutput" name="adblock-custom-hosts">'.htmlspecialchars($adblock_custom_content, ENT_QUOTES).'</textarea>'; ?>
       </div>
   </div>
diff --git a/templates/adblock/general.php b/templates/adblock/general.php
index a6d14439..c39a8b41 100644
--- a/templates/adblock/general.php
+++ b/templates/adblock/general.php
@@ -5,9 +5,9 @@
       <h4 class="mt-3"><?php echo _("Blocklist settings"); ?></h4>
         <div class="input-group">
           <input type="hidden" name="adblock-enable" value="0">
-          <div class="custom-control custom-switch">
-            <input class="custom-control-input" id="adblock-enable" type="checkbox" name="adblock-enable" value="1" <?php echo $enabled ? ' checked="checked"' : "" ?> aria-describedby="adblock-description">
-          <label class="custom-control-label" for="adblock-enable"><?php echo _("Enable blocklists") ?></label>
+          <div class="form-check form-switch">
+            <input class="form-check-input" id="adblock-enable" type="checkbox" name="adblock-enable" value="1" <?php echo $enabled ? ' checked="checked"' : "" ?> aria-describedby="adblock-description">
+          <label class="form-check-label" for="adblock-enable"><?php echo _("Enable blocklists") ?></label>
         </div>
         <p id="adblock-description">
           <small><?php echo _("Enable this option if you want RaspAP to <b>block DNS requests for ads, tracking and other virtual garbage</b>. Blocklists are gathered from multiple, actively maintained sources and automatically updated, cleaned, optimized and moderated on a daily basis.") ?></small>
@@ -19,20 +19,20 @@
         <div class="row">
           <div class="col-md-12">
             <p id="blocklist-updated">
-              <div><small><?php echo _("Hostnames blocklist last updated") ?>: <span class="font-weight-bold" id="blocklist-hostnames">
+              <div><small><?php echo _("Hostnames blocklist last updated") ?>: <span class="fw-bold" id="blocklist-hostnames">
                 <?php echo blocklistUpdated('hostnames.txt') ?></span></small></div>
-              <div><small><?php echo _("Domains blocklist last updated") ?>: <span class="font-weight-bold" id="blocklist-domains">
+              <div><small><?php echo _("Domains blocklist last updated") ?>: <span class="fw-bold" id="blocklist-domains">
                 <?php echo blocklistUpdated('domains.txt') ?></b></small></div>
             </p>
             <div class="input-group col-md-12 mb-4">
-              <select class="custom-select custom-select-sm" id="cbxblocklist" onchange="clearBlocklistStatus()">
+              <select class="form-select form-select-sm" id="cbxblocklist" onchange="clearBlocklistStatus()">
                 <option value=""><?php echo _("Choose a blocklist provider") ?></option>
                 <option disabled="disabled"></option>
                 <?php echo optionsForSelect(blocklistProviders()) ?>
               </select>
               <div class="input-group-append">
-                <button class="btn btn-sm btn-outline-secondary rounded-right" type="button" onclick="updateBlocklist()"><?php echo _("Update now"); ?></button>
-                <span id="cbxblocklist-status" class="input-group-addon check-hidden ml-2 mt-1"><i class="fas fa-check"></i></span>
+                <button class="btn btn-sm btn-outline-secondary rounded-end" type="button" onclick="updateBlocklist()"><?php echo _("Update now"); ?></button>
+                <span id="cbxblocklist-status" class="input-group-addon check-hidden ms-2 mt-1"><i class="fas fa-check"></i></span>
               </div>
             </div>
           </div>
diff --git a/templates/adblock/logging.php b/templates/adblock/logging.php
index 2140ae71..e80e1cfa 100644
--- a/templates/adblock/logging.php
+++ b/templates/adblock/logging.php
@@ -2,7 +2,7 @@
 <div class="tab-pane fade" id="adblocklogfileoutput">
   <h4 class="mt-3"><?php echo _("Logging"); ?></h4>
     <div class="row">
-      <div class="form-group col-md-8">
+      <div class="mb-3 col-md-8">
         <?php echo '<textarea class="logoutput">'.htmlspecialchars($logdata, ENT_QUOTES).'</textarea>'; ?>
     </div>
   </div>
diff --git a/templates/adblock/stats.php b/templates/adblock/stats.php
index 0bde73d7..fa97d91e 100644
--- a/templates/adblock/stats.php
+++ b/templates/adblock/stats.php
@@ -2,7 +2,7 @@
 <div class="tab-pane fade" id="adblockstats">
   <h4 class="mt-3"><?php echo _("Statistics"); ?></h4>
     <div class="row">
-      <div class="form-group col-md-8">
+      <div class="mb-3 col-md-8">
         <?php
         /*
          * BZ todo: implement basic stats
diff --git a/templates/admin.php b/templates/admin.php
index 3901556a..98cf4240 100755
--- a/templates/admin.php
+++ b/templates/admin.php
@@ -4,7 +4,7 @@
       <div class="card-header">
         <div class="row">
 	        <div class="col">
-						<i class="fas fa-user-lock mr-2"></i><?php echo _("Authentication"); ?>
+						<i class="fas fa-user-lock me-2"></i><?php echo _("Authentication"); ?>
           </div>
         </div><!-- /.row -->
       </div><!-- /.card-header -->
@@ -14,7 +14,7 @@
         <form role="form" action="auth_conf" method="POST" class="needs-validation" novalidate>
             <?php echo CSRFTokenFieldTag() ?>
           <div class="row">
-            <div class="form-group col-md-6">
+            <div class="mb-3 col-md-6">
               <label for="username"><?php echo _("Username"); ?></label>
               <input type="text" class="form-control" name="username" value="<?php echo htmlspecialchars($username, ENT_QUOTES); ?>" required />
               <div class="invalid-feedback">
@@ -23,12 +23,12 @@
             </div>
           </div>
           <div class="row">
-            <div class="form-group col-md-6">
+            <div class="mb-3 col-md-6">
               <div class="mb-2"><?php echo _("Old password"); ?></div>
               <div class="input-group">
                 <input type="password" class="form-control" name="oldpass" required />
                 <div class="input-group-append">
-                  <button class="btn btn-light js-toggle-password" type="button" data-target="[name=oldpass]" data-toggle-with="fas fa-eye-slash"><i class="fas fa-eye mx-2"></i></button>
+                  <button class="btn btn-light js-toggle-password" type="button" data-bs-target="[name=oldpass]" data-toggle-with="fas fa-eye-slash"><i class="fas fa-eye mx-2"></i></button>
                 </div>
                 <div class="invalid-feedback">
                   <?php echo _("Please enter your old password."); ?>
@@ -37,12 +37,12 @@
             </div>
           </div>
           <div class="row">
-            <div class="form-group col-md-6">
+            <div class="mb-3 col-md-6">
               <div class="mb-2"><?php echo _("New password"); ?></div>
               <div class="input-group">
                 <input type="password" class="form-control" name="newpass" required />
                 <div class="input-group-append">
-                  <button class="btn btn-light js-toggle-password" type="button" data-target="[name=newpass]" data-toggle-with="fas fa-eye-slash"><i class="fas fa-eye mx-2"></i></button>
+                  <button class="btn btn-light js-toggle-password" type="button" data-bs-target="[name=newpass]" data-toggle-with="fas fa-eye-slash"><i class="fas fa-eye mx-2"></i></button>
                 </div>
                 <div class="invalid-feedback">
                   <?php echo _("Please enter a new password."); ?>
@@ -51,12 +51,12 @@
             </div>
           </div>
           <div class="row">
-            <div class="form-group col-md-6">
+            <div class="mb-3 col-md-6">
               <div class="mb-2"><?php echo _("Repeat new password"); ?></div>
               <div class="input-group">
                 <input type="password" class="form-control" name="newpassagain" required />
                 <div class="input-group-append">
-                  <button class="btn btn-light js-toggle-password" type="button" data-target="[name=newpassagain]" data-toggle-with="fas fa-eye-slash"><i class="fas fa-eye mx-2"></i></button>
+                  <button class="btn btn-light js-toggle-password" type="button" data-bs-target="[name=newpassagain]" data-toggle-with="fas fa-eye-slash"><i class="fas fa-eye mx-2"></i></button>
                 </div>
                 <div class="invalid-feedback">
                   <?php echo _("Please re-enter your new password."); ?>
diff --git a/templates/configure_client.php b/templates/configure_client.php
index 45c44265..bc1b39f1 100755
--- a/templates/configure_client.php
+++ b/templates/configure_client.php
@@ -4,10 +4,10 @@
       <div class="card-header">
         <div class="row align-items-center">
           <div class="col">
-            <i class="fas fa-wifi mr-2"></i><?php echo _("WiFi client"); ?>
+            <i class="fas fa-wifi me-2"></i><?php echo _("WiFi client"); ?>
           </div>
             <div class="col">
-              <button class="btn btn-light btn-icon-split btn-sm service-status float-right">
+              <button class="btn btn-light btn-icon-split btn-sm service-status float-end">
                 <span class="icon"><i class="fas fa-circle service-status-<?php echo $ifaceStatus ?>"></i></span>
                 <span class="text service-status"><?php echo strtolower($clientInterface) .' '. _($ifaceStatus) ?></span>
               </button>
@@ -21,7 +21,7 @@
             <h4 class="m-0 text-nowrap"><?php echo _("Client settings"); ?></h4>
           </div>
           <div class="col">
-            <button type="button" class="btn btn-info float-right js-reload-wifi-stations"><?php echo _("Rescan"); ?></button>
+            <button type="button" class="btn btn-info float-end js-reload-wifi-stations"><?php echo _("Rescan"); ?></button>
           </div>
         </div>
         <div class="row" id="wpaConf">
@@ -44,13 +44,13 @@
   <div class="modal-dialog" role="document">
     <div class="modal-content">
       <div class="modal-header">
-      <div class="modal-title" id="ModalLabel"><i class="fas fa-sync-alt mr-2"></i><?php echo _("Configuring WiFi Client"); ?></div>
+      <div class="modal-title" id="ModalLabel"><i class="fas fa-sync-alt me-2"></i><?php echo _("Configuring WiFi Client"); ?></div>
       </div>
       <div class="modal-body">
         <div class="col-md-12 mb-3 mt-1"><?php echo _("Configuring Wifi Client Interface..."); ?></div>
       </div>
       <div class="modal-footer">
-      <button type="button" class="btn btn-outline btn-primary" data-dismiss="modal"><?php echo _("Close"); ?></button>
+      <button type="button" class="btn btn-outline btn-primary" data-bs-dismiss="modal"><?php echo _("Close"); ?></button>
       </div>
     </div>
   </div>
diff --git a/templates/dashboard.php b/templates/dashboard.php
index 560de1ab..fd872e8f 100755
--- a/templates/dashboard.php
+++ b/templates/dashboard.php
@@ -4,10 +4,10 @@
       <div class="card-header">
         <div class="row">
     <div class="col">
-      <i class="fas fa-tachometer-alt fa-fw mr-2"></i><?php echo _("Dashboard"); ?>
+      <i class="fas fa-tachometer-alt fa-fw me-2"></i><?php echo _("Dashboard"); ?>
     </div>
     <div class="col">
-      <button class="btn btn-light btn-icon-split btn-sm service-status float-right">
+      <button class="btn btn-light btn-icon-split btn-sm service-status float-end">
         <span class="icon"><i class="fas fa-circle service-status-<?php echo $ifaceStatus ?>"></i></span>
         <span class="text service-status"><?php echo strtolower($apInterface) .' '. _($ifaceStatus) ?></span>
       </button>
@@ -36,7 +36,7 @@
             <div class="card h-100">
               <div class="card-body wireless">
                 <h4 class="card-title"><?php echo _("Wireless Client"); ?></h4>
-                <div class="row ml-1">
+                <div class="row ms-1">
                   <div class="col-sm">
                     <div class="row mb-1">
                       <div class="info-item col-xs-3"><?php echo _("Connected To"); ?></div><div class="info-value col-xs-3"><?php echo htmlspecialchars($connectedSSID, ENT_QUOTES); ?></div>
@@ -108,7 +108,7 @@
                     </tbody>
                   </table>
                   <?php if (sizeof($clients) >2) : ?>
-                      <div class="col-lg-12 float-right">
+                      <div class="col-lg-12 float-end">
                         <a class="btn btn-outline-info" role="button" href="<?php echo $moreLink ?>"><?php echo _("More");?>  <i class="fas fa-chevron-right"></i></a>
                       </div>
                   <?php elseif (sizeof($clients) ==0) : ?>
diff --git a/templates/data_usage.php b/templates/data_usage.php
index f2981e38..26b6463a 100755
--- a/templates/data_usage.php
+++ b/templates/data_usage.php
@@ -4,15 +4,15 @@
       <div class="card-header">
         <div class="row">
           <div class="col">
-            <i class="fas fa-chart-bar mr-2"></i><?php echo _("Data usage monitoring"); ?>
+            <i class="fas fa-chart-bar me-2"></i><?php echo _("Data usage monitoring"); ?>
           </div>
         </div><!-- /.row -->
       </div><!-- /.card-header -->
 			<div class="card-body">
 				<ul id="tabbarBandwidth" class="nav nav-tabs" role="tablist">
-					<li class="nav-item"><a class="nav-link active" href="#hourly" aria-controls="hourly" role="tab" data-toggle="tab"><?php echo _("Hourly"); ?></a></li>
-					<li class="nav-item"><a class="nav-link" href="#daily" aria-controls="daily" role="tab" data-toggle="tab"><?php echo _("Daily"); ?></a></li>
-					<li class="nav-item"><a class="nav-link" href="#monthly" aria-controls="monthly" role="tab" data-toggle="tab"><?php echo _("Monthly"); ?></a></li>
+					<li class="nav-item"><a class="nav-link active" href="#hourly" aria-controls="hourly" role="tab" data-bs-toggle="tab"><?php echo _("Hourly"); ?></a></li>
+					<li class="nav-item"><a class="nav-link" href="#daily" aria-controls="daily" role="tab" data-bs-toggle="tab"><?php echo _("Daily"); ?></a></li>
+					<li class="nav-item"><a class="nav-link" href="#monthly" aria-controls="monthly" role="tab" data-bs-toggle="tab"><?php echo _("Monthly"); ?></a></li>
 				</ul>
 				<div id="tabsBandwidth" class="tabcontenttraffic tab-content">
 					<div role="tabpanel" class="tab-pane active" id="hourly">
@@ -20,7 +20,7 @@
 							<div class="col-lg-12">
 								<h4 class="mt-3"><?php echo _('Hourly traffic amount'); ?></h4>
 								<label for="cbxInterfacehourly"><?php echo _('interface'); ?></label>
-								<select id="cbxInterfacehourly" class="form-control" name="interfacehourly">
+								<select id="cbxInterfacehourly" class="form-select" name="interfacehourly">
 									<?php foreach ($interfaces as $if) : ?>
 											<?php $if_quoted = htmlspecialchars($if, ENT_QUOTES) ?>
 										<option value="<?php echo $if_quoted ?>"><?php echo $if_quoted ?></option>
@@ -39,7 +39,7 @@
 							<div class="col-lg-12">
 								<h4 class="mt-3"><?php echo _('Daily traffic amount'); ?></h4>
 								<label for="cbxInterfacedaily"><?php echo _('interface'); ?></label>
-								<select id="cbxInterfacedaily" class="form-control" name="interfacedaily">
+								<select id="cbxInterfacedaily" class="form-select" name="interfacedaily">
 									<?php foreach ($interfaces as $if) : ?>
 											<?php $if_quoted = htmlspecialchars($if, ENT_QUOTES) ?>
 										<option value="<?php echo $if_quoted ?>"><?php echo $if_quoted ?></option>
@@ -58,7 +58,7 @@
 							<div class="col-lg-12">
 								<h4 class="mt-3"><?php echo _("Monthly traffic amount"); ?></h4>
 								<label for="cbxInterfacemonthly"><?php echo _('interface'); ?></label>
-								<select id="cbxInterfacemonthly" class="form-control" name="interfacemonthly">
+								<select id="cbxInterfacemonthly" class="form-select" name="interfacemonthly">
 									<?php foreach ($interfaces as $if) : ?>
 											<?php $if_quoted = htmlspecialchars($if, ENT_QUOTES) ?>
 										<option value="<?php echo $if_quoted ?>"><?php echo $if_quoted ?></option>
diff --git a/templates/dhcp.php b/templates/dhcp.php
index 921bbbf0..40989763 100755
--- a/templates/dhcp.php
+++ b/templates/dhcp.php
@@ -16,10 +16,10 @@
       <div class="card-header">
         <div class="row">
           <div class="col">
-            <i class="fas fa-exchange-alt mr-2"></i><?php echo _("DHCP Server"); ?>
+            <i class="fas fa-exchange-alt me-2"></i><?php echo _("DHCP Server"); ?>
           </div>
           <div class="col">
-            <button class="btn btn-light btn-icon-split btn-sm service-status float-right">
+            <button class="btn btn-light btn-icon-split btn-sm service-status float-end">
               <span class="icon text-gray-600"><i class="fas fa-circle service-status-<?php echo $serviceStatus ?>"></i></span>
               <span class="text service-status">dnsmasq <?php echo _($serviceStatus) ?></span>
             </button>
@@ -34,11 +34,11 @@
 
           <!-- Nav tabs -->
           <ul class="nav nav-tabs mb-3">
-            <li class="nav-item"><a class="nav-link active" href="#server-settings" data-toggle="tab"><?php echo _("Server settings"); ?></a></li>
-            <li class="nav-item"><a class="nav-link" href="#advanced" data-toggle="tab"><?php echo _("Advanced"); ?></a></li>
-            <li class="nav-item"><a class="nav-link" href="#static-leases" data-toggle="tab"><?php echo _("Static Leases") ?></a></li>
-            <li class="nav-item"><a class="nav-link" href="#client-list" data-toggle="tab"><?php echo _("Client list"); ?></a></li>
-            <li class="nav-item"><a class="nav-link" href="#logging" data-toggle="tab"><?php echo _("Logging"); ?></a></li>
+            <li class="nav-item"><a class="nav-link active" href="#server-settings" data-bs-toggle="tab"><?php echo _("Server settings"); ?></a></li>
+            <li class="nav-item"><a class="nav-link" href="#advanced" data-bs-toggle="tab"><?php echo _("Advanced"); ?></a></li>
+            <li class="nav-item"><a class="nav-link" href="#static-leases" data-bs-toggle="tab"><?php echo _("Static Leases") ?></a></li>
+            <li class="nav-item"><a class="nav-link" href="#client-list" data-bs-toggle="tab"><?php echo _("Client list"); ?></a></li>
+            <li class="nav-item"><a class="nav-link" href="#logging" data-bs-toggle="tab"><?php echo _("Logging"); ?></a></li>
           </ul>
 
           <!-- Tab panes -->
diff --git a/templates/dhcp/advanced.php b/templates/dhcp/advanced.php
index 69804d86..a5c45696 100644
--- a/templates/dhcp/advanced.php
+++ b/templates/dhcp/advanced.php
@@ -6,9 +6,9 @@
       <h5><?php echo _("Upstream DNS servers") ?></h5>
       <div class="input-group">
         <input type="hidden" name="no-resolv" value="0">
-        <div class="custom-control custom-switch">
-          <input class="custom-control-input" id="no-resolv" type="checkbox" name="no-resolv" value="1" <?php echo $conf['no-resolv'] ? ' checked="checked"' : "" ?> aria-describedby="no-resolv-description">
-          <label class="custom-control-label" for="no-resolv"><?php echo _("Only ever query DNS servers configured below") ?></label>
+        <div class="form-check form-switch">
+          <input class="form-check-input" id="no-resolv" type="checkbox" name="no-resolv" value="1" <?php echo $conf['no-resolv'] ? ' checked="checked"' : "" ?> aria-describedby="no-resolv-description">
+          <label class="form-check-label" for="no-resolv"><?php echo _("Only ever query DNS servers configured below") ?></label>
         </div>
         <p id="no-resolv-description">
           <small><?php echo _("Enable this option if you want RaspAP to <b>send DNS queries to the servers configured below exclusively</b>. By default RaspAP also uses its upstream DHCP server's name servers.") ?></small>
@@ -18,7 +18,7 @@
 
       <div class="js-dhcp-upstream-servers">
         <?php foreach ($upstreamServers as $server): ?>
-          <div class="form-group input-group input-group-sm js-dhcp-upstream-server">
+          <div class="mb-3 input-group input-group-sm js-dhcp-upstream-server">
             <input type="text" class="form-control" name="server[]" value="<?php echo $server ?>">
             <div class="input-group-append">
               <button class="btn btn-outline-secondary js-remove-dhcp-upstream-server" type="button"><i class="fas fa-minus"></i></button>
@@ -27,7 +27,7 @@
         <?php endforeach ?>
       </div>
 
-      <div class="form-group">
+      <div class="mb-3">
         <label for="add-dhcp-upstream-server-field"><?php echo _("Add upstream DNS server") ?></label>
         <div class="input-group">
           <input type="text" class="form-control" id="add-dhcp-upstream-server-field" aria-describedby="new-dhcp-upstream-server" placeholder="<?php printf(_("e.g. %s"), "208.67.222.222") ?>">
@@ -41,7 +41,7 @@
             <code class="text-muted"><?php echo htmlspecialchars("[/[<domain>]/[domain/]][<ipaddr>[#<port>][@<source-ip>|<interface>[#<port>]]"); ?></code>
           </small>
         </p>
-        <select class="custom-select custom-select-sm js-field-preset" id="cbxdhcpupstreamserver" data-field-preset-target="#add-dhcp-upstream-server-field">
+        <select class="form-select form-select-sm js-field-preset" id="cbxdhcpupstreamserver" data-field-preset-target="#add-dhcp-upstream-server-field">
           <option value=""><?php echo _("Choose a hosted server") ?></option>
           <option disabled="disabled"></option>
           <?php echo optionsForSelect(dnsServers()) ?>
@@ -50,7 +50,7 @@
     </div>
 
     <template id="dhcp-upstream-server">
-      <div class="form-group input-group input-group-sm js-dhcp-upstream-server">
+      <div class="mb-3 input-group input-group-sm js-dhcp-upstream-server">
         <input type="text" class="form-control" name="server[]" value="{{ server }}">
         <div class="input-group-append">
           <button class="btn btn-outline-secondary js-remove-dhcp-upstream-server" type="button"><i class="fas fa-minus"></i></button>
diff --git a/templates/dhcp/general.php b/templates/dhcp/general.php
index 90f1a98d..a400e0aa 100644
--- a/templates/dhcp/general.php
+++ b/templates/dhcp/general.php
@@ -1,7 +1,7 @@
 <div class="tab-pane active" id="server-settings">
   <h4 class="mt-3">DHCP server settings</h4>
   <div class="row">
-    <div class="form-group col-md-6">
+    <div class="mb-3 col-md-6">
       <label for="code">Interface</label>
         <?php SelectorOptions('interface', $interfaces, $ap_iface, 'cbxdhcpiface', 'loadInterfaceDHCPSelect', $DHCPDisabled); ?>
     </div>
@@ -9,8 +9,8 @@
 
   <h5 class="mt-1"><?php echo _("Adapter IP Address Settings"); ?></h5>
   <div class="row">
-    <div class="form-group col-md-6">
-      <div class="btn-group" data-toggle="buttons">
+    <div class="mb-3 col-md-6">
+      <div class="btn-group" data-bs-toggle="buttons">
         <label class="btn btn-light active" checked onclick="setDHCPToggles(false)">
           <input type="radio" name="adapter-ip" id="chkdhcp" autocomplete="off"> DHCP
         </label>
@@ -22,10 +22,10 @@
   </div>
 
   <div class="row">
-    <div class="form-group col-md-6">
-        <div class="custom-control custom-switch">
-          <input class="custom-control-input" id="chkfallback" type="checkbox" name="Fallback" value="1" aria-describedby="fallback-description">
-          <label class="custom-control-label" for="chkfallback"><?php echo _("Enable fallback to static option") ?></label>
+    <div class="mb-3 col-md-6">
+        <div class="form-check form-switch">
+          <input class="form-check-input" id="chkfallback" type="checkbox" name="Fallback" value="1" aria-describedby="fallback-description">
+          <label class="form-check-label" for="chkfallback"><?php echo _("Enable fallback to static option") ?></label>
         </div>
         <p class="mb-0" id="fallback-description">
           <small><?php echo _("Enable this option to configure a static profile and fall back to it when DHCP lease fails.") ?></small>
@@ -35,7 +35,7 @@
 
   <h5 class="mt-1">Static IP options</h5>
   <div class="row">
-    <div class="form-group col-md-6" required>
+    <div class="mb-3 col-md-6" required>
       <label for="code"><?php echo _("IP Address"); ?></label>
       <input type="text" class="form-control ip_address" id="txtipaddress" name="StaticIP" maxlength="15" />
       <div class="invalid-feedback">
@@ -45,7 +45,7 @@
   </div>
 
   <div class="row">
-    <div class="form-group col-md-6">
+    <div class="mb-3 col-md-6">
       <label for="code"><?php echo _("Subnet Mask"); ?></label>
       <input type="text" class="form-control ip_address" id="txtsubnetmask" name="SubnetMask" maxlength="15" />
       <div class="invalid-feedback">
@@ -55,7 +55,7 @@
   </div>
 
   <div class="row">
-    <div class="form-group col-md-6">
+    <div class="mb-3 col-md-6">
       <label for="code"><?php echo _("Default gateway"); ?></label>
       <input type="text" class="form-control ip_address" id="txtgateway" name="DefaultGateway" maxlength="15" />
       <div class="invalid-feedback">
@@ -65,10 +65,10 @@
   </div>
 
   <div class="row">
-    <div class="form-group col-md-6">
-        <div class="custom-control custom-switch">
-          <input class="custom-control-input" id="default-route" type="checkbox" name="DefaultRoute" value="1" aria-describedby="default-route-description">
-          <label class="custom-control-label" for="default-route"><?php echo _("Install a default route for this interface") ?></label>
+    <div class="mb-3 col-md-6">
+        <div class="form-check form-switch">
+          <input class="form-check-input" id="default-route" type="checkbox" name="DefaultRoute" value="1" aria-describedby="default-route-description">
+          <label class="form-check-label" for="default-route"><?php echo _("Install a default route for this interface") ?></label>
         </div>
         <p class="mb-0" id="default-route-description">
           <small><?php echo _("This toggles the <code>gateway</code>/<code>nogateway</code> option for this interface in the DHCPCD configuration.") ?></small>
@@ -77,10 +77,10 @@
   </div>
 
   <div class="row">
-    <div class="form-group col-md-6">
-        <div class="custom-control custom-switch">
-          <input class="custom-control-input" id="nohook-wpa-supplicant" type="checkbox" name="NoHookWPASupplicant" value="1" aria-describedby="hook-wpa-supplicant-description">
-          <label class="custom-control-label" for="nohook-wpa-supplicant"><?php echo _("Disable wpa_supplicant dhcp hook for this interface") ?></label>
+    <div class="mb-3 col-md-6">
+        <div class="form-check form-switch">
+          <input class="form-check-input" id="nohook-wpa-supplicant" type="checkbox" name="NoHookWPASupplicant" value="1" aria-describedby="hook-wpa-supplicant-description">
+          <label class="form-check-label" for="nohook-wpa-supplicant"><?php echo _("Disable wpa_supplicant dhcp hook for this interface") ?></label>
           <?php getTooltip('If you manage wireless connections with wpa_supplicant itself, the hook may create unwanted connection events. This option disables the hook.', 'tipnohook'); ?>
         </div>
         <p class="mb-0" id="hook-wpa-supplicant-description">
@@ -91,11 +91,11 @@
 
   <h5 class="mt-1">DHCP options</h5>
   <div class="row">
-    <div class="form-group col-md-6">
+    <div class="mb-3 col-md-6">
       <div class="input-group">
-        <div class="custom-control custom-switch">
-          <input class="custom-control-input" id="dhcp-iface" type="checkbox" name="dhcp-iface" value="1" aria-describedby="dhcp-iface-description">
-          <label class="custom-control-label" for="dhcp-iface"><?php echo _("Enable DHCP for this interface") ?></label>
+        <div class="form-check form-switch">
+          <input class="form-check-input" id="dhcp-iface" type="checkbox" name="dhcp-iface" value="1" aria-describedby="dhcp-iface-description">
+          <label class="form-check-label" for="dhcp-iface"><?php echo _("Enable DHCP for this interface") ?></label>
         </div>
         <p class="mb-0" id="dhcp-iface-description">
           <small><?php echo _("Enable this option if you want RaspAP to assign IP addresses to clients on the selected interface. A static IP address is required for this option.") ?></small>
@@ -105,7 +105,7 @@
   </div>
   
   <div class="row">
-    <div class="form-group col-md-6">
+    <div class="mb-3 col-md-6">
       <label for="code"><?php echo _("Starting IP Address"); ?></label>
       <input type="text" class="form-control ip_address" id="txtrangestart" name="RangeStart" maxlength="15" />
       <div class="invalid-feedback">
@@ -115,7 +115,7 @@
   </div>
 
   <div class="row">
-    <div class="form-group col-md-6">
+    <div class="mb-3 col-md-6">
       <label for="code"><?php echo _("Ending IP Address"); ?></label>
       <input type="text" class="form-control ip_address" id="txtrangeend" name="RangeEnd" maxlength="15" />
       <div class="invalid-feedback">
@@ -125,7 +125,7 @@
   </div>
 
   <div class="row">
-    <div class="form-group col-xs-3 col-sm-3">
+    <div class="mb-3 col-xs-3 col-sm-3">
       <label for="code"><?php echo _("Lease Time"); ?></label>
       <input type="text" class="form-control" id="txtrangeleasetime" name="RangeLeaseTime" />
       <div class="invalid-feedback">
@@ -134,7 +134,7 @@
     </div>
     <div class="col-xs-3 col-sm-3">
       <label for="code"><?php echo _("Interval"); ?></label>
-      <select id="cbxrangeleasetimeunits" name="RangeLeaseTimeUnits" class="form-control" >
+      <select id="cbxrangeleasetimeunits" name="RangeLeaseTimeUnits" class="form-select" >
         <option value="m"><?php echo _("Minute(s)"); ?></option>
         <option value="h"><?php echo _("Hour(s)"); ?></option>
         <option value="d"><?php echo _("Day(s)"); ?></option>
@@ -147,21 +147,21 @@
   </div>
 
   <div class="row">
-    <div class="form-group col-md-6">
+    <div class="mb-3 col-md-6">
       <label for="code"><?php echo _("DNS Server"); ?> 1</label>
       <input type="text" class="form-control" id="txtdns1" name="DNS1" />
     </div>
   </div>
 
   <div class="row">
-    <div class="form-group col-md-6">
+    <div class="mb-3 col-md-6">
       <label for="code"><?php echo _("DNS Server"); ?> 2</label>
       <input type="text" class="form-control" id="txtdns2" name="DNS2" />
     </div>
   </div>
 
   <div class="row">
-    <div class="form-group col-md-6">
+    <div class="mb-3 col-md-6">
       <label for="<metric"><?php echo _("Metric") ?></label>
       <input type="text" class="form-control" id="txtmetric" name="Metric">
     </div>
diff --git a/templates/dhcp/logging.php b/templates/dhcp/logging.php
index 7243c7a5..839a0e6f 100644
--- a/templates/dhcp/logging.php
+++ b/templates/dhcp/logging.php
@@ -3,18 +3,18 @@
   <h4><?php echo _("Logging") ?></h4>
   <p><?php echo _("Enable these options to log <code>dhcpcd</code> and <code>dnsmasq</code> activity.") ?></p>
 
-  <div class="custom-control custom-switch">
-    <input class="custom-control-input" id="log-dhcp" type="checkbox" name="log-dhcp" value="1" <?php echo $conf['log-dhcp'] ? ' checked="checked"' : "" ?> aria-describedby="log-dhcp-requests">
-    <label class="custom-control-label" for="log-dhcp"><?php echo _("Log DHCP requests") ?></label>
+  <div class="form-check form-switch">
+    <input class="form-check-input" id="log-dhcp" type="checkbox" name="log-dhcp" value="1" <?php echo $conf['log-dhcp'] ? ' checked="checked"' : "" ?> aria-describedby="log-dhcp-requests">
+    <label class="form-check-label" for="log-dhcp"><?php echo _("Log DHCP requests") ?></label>
   </div>
-  <div class="custom-control custom-switch">
-    <input class="custom-control-input" id="log-queries" type="checkbox" name="log-queries" value="1" <?php echo $conf['log-queries'] ? ' checked="checked"' : "" ?> aria-describedby="log-dhcp-queries">
-    <label class="custom-control-label align-middle" for="log-queries"><?php echo _("Log DNS queries") ?></label>
-    <input type="button" class="btn btn-outline btn-warning btn-sm align-top ml-4" id="js-cleardnsmasq-log" value="<?php echo _("Clear log"); ?>" />
+  <div class="form-check form-switch">
+    <input class="form-check-input" id="log-queries" type="checkbox" name="log-queries" value="1" <?php echo $conf['log-queries'] ? ' checked="checked"' : "" ?> aria-describedby="log-dhcp-queries">
+    <label class="form-check-label align-middle" for="log-queries"><?php echo _("Log DNS queries") ?></label>
+    <input type="button" class="btn btn-outline btn-warning btn-sm align-top ms-4" id="js-cleardnsmasq-log" value="<?php echo _("Clear log"); ?>" />
   </div>
 
   <div class="row">
-    <div class="form-group col-md-8 mt-2">
+    <div class="mb-3 col-md-8 mt-2">
       <?php
       if ($conf['log-dhcp'] == 1 || $conf['log-queries'] == 1) {
           echo '<textarea class="logoutput" id="dnsmasq-log">'.htmlspecialchars($logdata, ENT_QUOTES).'</textarea>';
diff --git a/templates/dhcp/static_leases.php b/templates/dhcp/static_leases.php
index 90e24352..caddc6bb 100644
--- a/templates/dhcp/static_leases.php
+++ b/templates/dhcp/static_leases.php
@@ -46,9 +46,9 @@
       <h5 class="mt-3 mb-3"><?php echo _("Restrict access") ?></h5>
         <div class="input-group">
           <input type="hidden" name="dhcp-ignore" value="0">
-            <div class="custom-control custom-switch">
-              <input class="custom-control-input" id="dhcp-ignore" type="checkbox" name="dhcp-ignore" value="1" <?php echo $conf['dhcp-ignore'] ? ' checked="checked"' : "" ?> aria-describedby="dhcp-ignore-description">
-              <label class="custom-control-label" for="dhcp-ignore"><?php echo _("Limit network access to static clients") ?></label>
+            <div class="form-check form-switch">
+              <input class="form-check-input" id="dhcp-ignore" type="checkbox" name="dhcp-ignore" value="1" <?php echo $conf['dhcp-ignore'] ? ' checked="checked"' : "" ?> aria-describedby="dhcp-ignore-description">
+              <label class="form-check-label" for="dhcp-ignore"><?php echo _("Limit network access to static clients") ?></label>
             </div>
             <p id="dhcp-ignore-description">
               <small><?php echo _("Enable this option if you want RaspAP to <b>ignore any clients</b> which are not specified in the static leases list.") ?></small>
diff --git a/templates/exception.php b/templates/exception.php
index 5d5c8c49..234e1ea9 100755
--- a/templates/exception.php
+++ b/templates/exception.php
@@ -14,9 +14,9 @@
         <div id="content">
           <div class="row">
             <div class="col-lg-12">
-              <p class="text-light bg-danger pl-3 p-1"><?php echo _("RaspAP Exception"); ?></p>
+              <p class="text-light bg-danger ps-3 p-1"><?php echo _("RaspAP Exception"); ?></p>
             </div>
-            <div class="col-lg-12 ml-3">
+            <div class="col-lg-12 ms-3">
               <h3 class="mt-2"><?php echo _("An exception occurred"); ?></h3>
               <h5>Stack trace:</h5>
               <pre><?php print_r($trace); ?></pre>
diff --git a/templates/hostapd.php b/templates/hostapd.php
index e888a709..6e352fb2 100755
--- a/templates/hostapd.php
+++ b/templates/hostapd.php
@@ -2,17 +2,17 @@
   <?php if (!RASPI_MONITOR_ENABLED) : ?>
     <input type="submit" class="btn btn-outline btn-primary" id="btnSaveHostapd" name="SaveHostAPDSettings" value="<?php echo _("Save settings"); ?>" />
     <?php if ($hostapdstatus[0] == 0) : ?>
-      <input type="submit" class="btn btn-success" name="StartHotspot" value="<?php echo  _("Start hotspot"); $msg=_("Starting hotspot"); ?>" data-toggle="modal" data-target="#hostapdModal"/>
+      <input type="submit" class="btn btn-success" name="StartHotspot" value="<?php echo  _("Start hotspot"); $msg=_("Starting hotspot"); ?>" data-bs-toggle="modal" data-bs-target="#hostapdModal"/>
     <?php else : ?>
       <input type="submit" class="btn btn-warning" name="StopHotspot" value="<?php echo _("Stop hotspot") ?>"/>
-      <input type ="submit" class="btn btn-warning" name="RestartHotspot" value="<?php echo _("Restart hotspot"); $msg=_("Restarting hotspot"); ?>" data-toggle="modal" data-target="#hostapdModal"/>
+      <input type ="submit" class="btn btn-warning" name="RestartHotspot" value="<?php echo _("Restart hotspot"); $msg=_("Restarting hotspot"); ?>" data-bs-toggle="modal" data-bs-target="#hostapdModal"/>
     <?php endif ?>
     <!-- Modal -->
     <div class="modal fade" id="hostapdModal" tabindex="-1" role="dialog" aria-labelledby="ModalLabel" aria-hidden="true">
       <div class="modal-dialog" role="document">
         <div class="modal-content">
           <div class="modal-header">
-            <div class="modal-title" id="ModalLabel"><i class="fas fa-sync-alt fa-spin mr-2"></i><?php echo $msg ?></div>
+            <div class="modal-title" id="ModalLabel"><i class="fas fa-sync-alt fa-spin me-2"></i><?php echo $msg ?></div>
           </div>
           <div class="modal-body">
             <div class="col-md-12 mb-3 mt-1"><?php echo _("Executing RaspAP service start") ?>...</div>
@@ -21,7 +21,7 @@
             </div>
           </div>
           <div class="modal-footer">
-            <button type="button" class="btn btn-outline btn-primary" data-dismiss="modal"><?php echo _("Close"); ?></button>
+            <button type="button" class="btn btn-outline btn-primary" data-bs-dismiss="modal"><?php echo _("Close"); ?></button>
           </div>
         </div>
       </div>
@@ -36,10 +36,10 @@
       <div class="card-header">
         <div class="row">
           <div class="col">
-            <i class="far fa-dot-circle mr-2"></i><?php echo _("Hotspot"); ?>
+            <i class="far fa-dot-circle me-2"></i><?php echo _("Hotspot"); ?>
           </div>
           <div class="col">
-            <button class="btn btn-light btn-icon-split btn-sm service-status float-right">
+            <button class="btn btn-light btn-icon-split btn-sm service-status float-end">
               <span class="icon text-gray-600"><i class="fas fa-circle service-status-<?php echo $serviceStatus ?>"></i></span>
               <span class="text service-status">hostapd <?php echo _($serviceStatus) ?></span>
             </button>
@@ -54,10 +54,10 @@
 
           <!-- Nav tabs -->
           <ul class="nav nav-tabs">
-            <li class="nav-item"><a class="nav-link active" id="basictab" href="#basic" aria-controls="basic" data-toggle="tab"><?php echo _("Basic"); ?></a></li>
-            <li class="nav-item"><a class="nav-link" id="securitytab" href="#security" data-toggle="tab"><?php echo _("Security"); ?></a></li>
-            <li class="nav-item"><a class="nav-link" id="advancedtab" href="#advanced" data-toggle="tab"><?php echo _("Advanced"); ?></a></li>
-            <li class="nav-item"><a class="nav-link" id="logoutputtab" href="#logoutput" data-toggle="tab"><?php echo _("Logging"); ?></a></li>
+            <li class="nav-item"><a class="nav-link active" id="basictab" href="#basic" aria-controls="basic" data-bs-toggle="tab"><?php echo _("Basic"); ?></a></li>
+            <li class="nav-item"><a class="nav-link" id="securitytab" href="#security" data-bs-toggle="tab"><?php echo _("Security"); ?></a></li>
+            <li class="nav-item"><a class="nav-link" id="advancedtab" href="#advanced" data-bs-toggle="tab"><?php echo _("Advanced"); ?></a></li>
+            <li class="nav-item"><a class="nav-link" id="logoutputtab" href="#logoutput" data-bs-toggle="tab"><?php echo _("Logging"); ?></a></li>
           </ul>
 
           <!-- Tab panes -->
diff --git a/templates/hostapd/advanced.php b/templates/hostapd/advanced.php
index b8ca3469..0dda902a 100644
--- a/templates/hostapd/advanced.php
+++ b/templates/hostapd/advanced.php
@@ -2,39 +2,39 @@
   <h4 class="mt-3"><?php echo _("Advanced settings"); ?></h4>
     <div class="row">
       <div class="col-md-6 mb-2">
-        <div class="custom-control custom-switch">
+        <div class="form-check form-switch">
           <?php $checked = $arrHostapdConf['BridgedEnable'] == 1 ? 'checked="checked"' : '' ?>
           <?php $disabled = strpos(strtolower($operatingSystem),'ubuntu') !== false ? 'disabled="disabled"' : '' ?>
-          <input class="custom-control-input" id="chxbridgedenable" name="bridgedEnable" type="checkbox" value="1" <?php echo $checked ?> <?php echo $disabled ?> />
-          <label class="custom-control-label" for="chxbridgedenable"><?php echo _("Bridged AP mode"); ?></label>
+          <input class="form-check-input" id="chxbridgedenable" name="bridgedEnable" type="checkbox" value="1" <?php echo $checked ?> <?php echo $disabled ?> />
+          <label class="form-check-label" for="chxbridgedenable"><?php echo _("Bridged AP mode"); ?></label>
         </div>
       </div>
     </div>
     <div class="row">
       <div class="col-md-6 mb-2">
-        <div class="custom-control custom-switch">
+        <div class="form-check form-switch">
           <?php $checked = $arrHostapdConf['WifiAPEnable'] == 1 ? 'checked="checked"' : '' ?>
           <?php $disabled = $managedModeEnabled == false && $arrHostapdConf['WifiAPEnable'] != 1 || $arrHostapdConf['BridgedEnable'] == 1 ? 'disabled="disabled"' : '' ?>
-          <input class="custom-control-input" id="chxwificlientap" name="wifiAPEnable" type="checkbox" value="1" <?php echo $checked ?> <?php echo $disabled ?> />
-          <label class="custom-control-label" for="chxwificlientap"><?php echo _("WiFi client AP mode"); ?></label>
+          <input class="form-check-input" id="chxwificlientap" name="wifiAPEnable" type="checkbox" value="1" <?php echo $checked ?> <?php echo $disabled ?> />
+          <label class="form-check-label" for="chxwificlientap"><?php echo _("WiFi client AP mode"); ?></label>
         </div>
       </div>
     </div>
     <div class="row">
       <div class="col-md-6 mb-2">
-        <div class="custom-control custom-switch">
+        <div class="form-check form-switch">
           <?php $checked = $arrConfig['ignore_broadcast_ssid'] == 1 || $arrConfig['ignore_broadcast_ssid'] == 2 ? 'checked="checked"' : '' ?>
-          <input class="custom-control-input" id="chxhiddenssid" name="hiddenSSID" type="checkbox" value="1" <?php echo $checked ?> />
-          <label class="custom-control-label" for="chxhiddenssid"><?php echo _("Hide SSID in broadcast"); ?></label>
+          <input class="form-check-input" id="chxhiddenssid" name="hiddenSSID" type="checkbox" value="1" <?php echo $checked ?> />
+          <label class="form-check-label" for="chxhiddenssid"><?php echo _("Hide SSID in broadcast"); ?></label>
         </div>
       </div>
     </div>
     <div class="row">
       <div class="col-xs-3 col-sm-3">
-        <div class="custom-control custom-switch">
+        <div class="form-check form-switch">
           <?php $checked = $arrConfig['beacon_interval_bool'] == 1 ? 'checked="checked"' : '' ?>
-          <input class="custom-control-input" id="chxbeaconinterval" name="beaconintervalEnable" type="checkbox" value="1" <?php echo $checked ?> />
-          <label class="custom-control-label" for="chxbeaconinterval"><?php echo _("Beacon interval"); ?></label>
+          <input class="form-check-input" id="chxbeaconinterval" name="beaconintervalEnable" type="checkbox" value="1" <?php echo $checked ?> />
+          <label class="form-check-label" for="chxbeaconinterval"><?php echo _("Beacon interval"); ?></label>
         </div>
       </div>
       <div class="col-xs-3 col-sm-3">
@@ -43,10 +43,10 @@
     </div>
     <div class="row">
       <div class="col-md-6 mb-2">
-        <div class="custom-control custom-switch">
+        <div class="form-check form-switch">
           <?php $checked = $arrConfig['disassoc_low_ack_bool'] == 1 ? 'checked="checked"' : '' ?>
-          <input class="custom-control-input" id="chxdisassoclowack" name="disassoc_low_ackEnable" type="checkbox" value="1" <?php echo $checked ?> />
-          <label class="custom-control-label" for="chxdisassoclowack"><?php echo _("Disable <code>disassoc_low_ack</code>"); ?></label>
+          <input class="form-check-input" id="chxdisassoclowack" name="disassoc_low_ackEnable" type="checkbox" value="1" <?php echo $checked ?> />
+          <label class="form-check-label" for="chxdisassoclowack"><?php echo _("Disable <code>disassoc_low_ack</code>"); ?></label>
         </div>
         <p id="disassoc_low_ack_help" class="mb-1 mt-0">
           <small id="disassoc_low_ack_help" class="text-muted"><?php echo _("Do not disassociate stations based on excessive transmission failures.") ?></small></label>
@@ -54,7 +54,7 @@
       </div>
     </div>
     <div class="row">
-      <div class="form-group col-md-6">
+      <div class="mb-3 col-md-6">
         <label for="cbxtxpower"><?php echo _("Transmit power (dBm)") ?></label>
         <?php getTooltip('dBm is a unit of level used to indicate that a power ratio is expressed in decibels (dB) with reference to one milliwatt (mW). 30 dBm is equal to 1000 mW, while 0 dBm equals 1.25 mW.', 'tiptxpower'); ?>
         <?php SelectorOptions('txpower', $arrTxPower, $txpower, 'cbxtxpower'); ?>
@@ -63,14 +63,14 @@
     </div>
 
     <div class="row">
-      <div class="form-group col-md-6">
+      <div class="mb-3 col-md-6">
         <label for="max_num_sta"><?php echo _("Maximum number of clients") ?></label>
         <input type="text" id="max_num_sta" class="form-control" name="max_num_sta" placeholder="2007" value="<?php echo $arrConfig["max_num_sta"] ?>" aria-describedby="max_num_sta_help">
         <small id="max_num_sta_help" class="text-muted"><?php echo _("Configures the <code>max_num_sta</code> option of hostapd. The default and maximum is 2007. If empty or 0, the default applies.") ?></small>
       </div>
     </div>
     <div class="row">
-      <div class="form-group col-md-6">
+      <div class="mb-3 col-md-6">
       <label for="cbxcountries"><?php echo _("Country Code"); ?></label>
       <input type="hidden" id="selected_country" value="<?php echo htmlspecialchars($arrConfig['country_code'], ENT_QUOTES); ?>">
       <?php SelectorOptions('country_code', $countryCodes, $arrConfig['country_code'], 'cbxcountries', 'loadChannelSelect'); ?>
diff --git a/templates/hostapd/basic.php b/templates/hostapd/basic.php
index 6ae6170c..9b4140c5 100644
--- a/templates/hostapd/basic.php
+++ b/templates/hostapd/basic.php
@@ -1,13 +1,13 @@
 <div class="tab-pane active" id="basic">
   <h4 class="mt-3"><?php echo _("Basic settings") ;?></h4>
   <div class="row">
-    <div class="form-group col-md-6">
+    <div class="mb-3 col-md-6">
       <label for="cbxinterface"><?php echo _("Interface") ;?></label>
       <?php SelectorOptions('interface', $interfaces, $arrConfig['interface'], 'cbxinterface', 'getChannel'); ?>
     </div>
   </div>
   <div class="row">
-    <div class="form-group col-md-6" required>
+    <div class="mb-3 col-md-6" required>
       <label for="txtssid"><?php echo _("SSID"); ?></label>
       <input type="text" id="txtssid" class="form-control" name="ssid" value="<?php echo htmlspecialchars($arrConfig['ssid'], ENT_QUOTES); ?>" required />
       <div class="invalid-feedback">
@@ -16,7 +16,7 @@
     </div>
   </div>
   <div class="row">
-    <div class="form-group col-md-6">
+    <div class="mb-3 col-md-6">
       <label for="cbxhwmode"><?php echo _("Wireless Mode") ;?></label>
       <?php getTooltip(null, 'tiphwmode', true); ?>
       <?php SelectorOptions('hw_mode', $arr80211Standard, $selectedHwMode, 'cbxhwmode', 'getChannel'); ?>
@@ -24,7 +24,7 @@
     </div>
   </div>
   <div class="row">
-    <div class="form-group col-md-6">
+    <div class="mb-3 col-md-6">
       <label for="cbxchannel"><?php echo _("Channel"); ?></label>
       <?php
       $selectablechannels = Array();
diff --git a/templates/hostapd/logging.php b/templates/hostapd/logging.php
index f5b646db..09497a37 100644
--- a/templates/hostapd/logging.php
+++ b/templates/hostapd/logging.php
@@ -3,15 +3,15 @@
   <h4 class="mt-3"><?php echo _("Logging"); ?></h4>
   <p><?php echo _("Enable this option to log <code>hostapd</code> activity.") ?></p>
 
-  <div class="custom-control custom-switch">
+  <div class="form-check form-switch">
     <?php $checked = $arrHostapdConf['LogEnable'] == 1 ? 'checked="checked"' : '' ?>
-    <input class="custom-control-input" id="chxlogenable" name="logEnable" type="checkbox" value="1" <?php echo $checked ?> />
-    <label class="custom-control-label align-middle" for="chxlogenable"><?php echo _("Logfile output"); ?></label>
-    <input type="button" class="btn btn-outline btn-warning btn-sm align-top ml-2" id="js-clearhostapd-log" value="<?php echo _("Clear log"); ?>" />
+    <input class="form-check-input" id="chxlogenable" name="logEnable" type="checkbox" value="1" <?php echo $checked ?> />
+    <label class="form-check-label align-middle" for="chxlogenable"><?php echo _("Logfile output"); ?></label>
+    <input type="button" class="btn btn-outline btn-warning btn-sm align-top ms-2" id="js-clearhostapd-log" value="<?php echo _("Clear log"); ?>" />
   </div>
 
   <div class="row">
-    <div class="form-group col-md-8 mt-2">
+    <div class="mb-3 col-md-8 mt-2">
       <?php
       if ($arrHostapdConf['LogEnable'] == 1) {
           echo '<textarea class="logoutput" id="hostapd-log">'.htmlspecialchars($logdata, ENT_QUOTES).'</textarea>';
diff --git a/templates/hostapd/security.php b/templates/hostapd/security.php
index 3870c26e..4da80a38 100644
--- a/templates/hostapd/security.php
+++ b/templates/hostapd/security.php
@@ -2,11 +2,11 @@
   <h4 class="mt-3"><?php echo _("Security settings"); ?></h4>
   <div class="row">
     <div class="col-md-6">
-      <div class="form-group">
+      <div class="mb-3">
         <label for="cbxwpa"><?php echo _("Security type"); ?></label>
         <?php SelectorOptions('wpa', $arrSecurity, $arrConfig['wpa'], 'cbxwpa'); ?>
       </div>
-      <div class="form-group">
+      <div class="mb-3">
         <label for="cbxwpapairwise"><?php echo _("Encryption Type"); ?></label>
         <?php SelectorOptions('wpa_pairwise', $arrEncType, $arrConfig['wpa_pairwise'], 'cbxwpapairwise'); ?>
       </div>
diff --git a/templates/networking.php b/templates/networking.php
index 23c356bc..f1cd45c3 100755
--- a/templates/networking.php
+++ b/templates/networking.php
@@ -5,7 +5,7 @@
       <div class="card-header">
         <div class="row">
           <div class="col">
-            <i class="fas fa-network-wired mr-2"></i><?php echo _("Networking"); ?>
+            <i class="fas fa-network-wired me-2"></i><?php echo _("Networking"); ?>
           </div>
         </div><!-- ./row -->
       </div><!-- ./card-header -->
@@ -13,7 +13,7 @@
       <div class="card-body">
         <div id="msgNetworking"></div>
         <ul class="nav nav-tabs">
-          <li role="presentation" class="nav-item"><a class="nav-link active" href="#summary" aria-controls="summary" role="tab" data-toggle="tab"><?php echo _("Summary"); ?></a></li>
+          <li role="presentation" class="nav-item"><a class="nav-link active" href="#summary" aria-controls="summary" role="tab" data-bs-toggle="tab"><?php echo _("Summary"); ?></a></li>
         </ul>
         <div class="tab-content">
           <div role="tabpanel" class="tab-pane active" id="summary">
diff --git a/templates/openvpn.php b/templates/openvpn.php
index 4e0adaba..f2b839e8 100755
--- a/templates/openvpn.php
+++ b/templates/openvpn.php
@@ -16,10 +16,10 @@
         <div class="card-header">
           <div class="row">
             <div class="col">
-              <i class="fas fa-key fa-fw mr-2"></i><?php echo _("OpenVPN"); ?>
+              <i class="fas fa-key fa-fw me-2"></i><?php echo _("OpenVPN"); ?>
             </div>
             <div class="col">
-              <button class="btn btn-light btn-icon-split btn-sm service-status float-right">
+              <button class="btn btn-light btn-icon-split btn-sm service-status float-end">
                 <span class="icon text-gray-600"><i class="fas fa-circle service-status-<?php echo $serviceStatus ?>"></i></span>
                 <span class="text service-status">openvpn <?php echo _($serviceStatus) ?></span>
               </button>
@@ -32,9 +32,9 @@
             <?php echo CSRFTokenFieldTag() ?>
             <!-- Nav tabs -->
             <ul class="nav nav-tabs">
-                <li class="nav-item"><a class="nav-link active" id="clienttab" href="#openvpnclient" data-toggle="tab"><?php echo _("Client settings"); ?></a></li>
-                <li class="nav-item"><a class="nav-link" id="configstab" href="#openvpnconfigs" data-toggle="tab"><?php echo _("Configurations"); ?></a></li>
-                <li class="nav-item"><a class="nav-link" id="loggingtab" href="#openvpnlogging" data-toggle="tab"><?php echo _("Logging"); ?></a></li>
+                <li class="nav-item"><a class="nav-link active" id="clienttab" href="#openvpnclient" data-bs-toggle="tab"><?php echo _("Client settings"); ?></a></li>
+                <li class="nav-item"><a class="nav-link" id="configstab" href="#openvpnconfigs" data-bs-toggle="tab"><?php echo _("Configurations"); ?></a></li>
+                <li class="nav-item"><a class="nav-link" id="loggingtab" href="#openvpnlogging" data-bs-toggle="tab"><?php echo _("Logging"); ?></a></li>
             </ul>
 
             <!-- Tab panes -->
@@ -57,13 +57,13 @@
   <div class="modal-dialog" role="document">
     <div class="modal-content">
       <div class="modal-header">
-      <div class="modal-title" id="ModalLabel"><i class="far fa-trash-alt mr-2"></i><?php echo _("Delete OpenVPN client"); ?></div>
+      <div class="modal-title" id="ModalLabel"><i class="far fa-trash-alt me-2"></i><?php echo _("Delete OpenVPN client"); ?></div>
       </div>
       <div class="modal-body">
         <div class="col-md-12 mb-3 mt-1"><?php echo _("Delete client configuration? This cannot be undone."); ?></div>
       </div>
       <div class="modal-footer">
-      <button type="button" class="btn btn-outline-secondary" data-dismiss="modal"><?php echo _("Cancel"); ?></button>
+      <button type="button" class="btn btn-outline-secondary" data-bs-dismiss="modal"><?php echo _("Cancel"); ?></button>
       <button type="button" class="btn btn-outline-danger btn-delete"><?php echo _("Delete"); ?></button>
       </div>
     </div>
@@ -75,13 +75,13 @@
   <div class="modal-dialog" role="document">
     <div class="modal-content">
       <div class="modal-header">
-      <div class="modal-title" id="ModalLabel"><i class="far fa-check-circle mr-2"></i><?php echo _("Activate OpenVPN client"); ?></div>
+      <div class="modal-title" id="ModalLabel"><i class="far fa-check-circle me-2"></i><?php echo _("Activate OpenVPN client"); ?></div>
       </div>
       <div class="modal-body">
         <div class="col-md-12 mb-3 mt-1"><?php echo _("Activate client configuration? This will restart the openvpn-client service."); ?></div>
       </div>
       <div class="modal-footer">
-      <button type="button" class="btn btn-outline-secondary" data-dismiss="modal"><?php echo _("Cancel"); ?></button>
+      <button type="button" class="btn btn-outline-secondary" data-bs-dismiss="modal"><?php echo _("Cancel"); ?></button>
       <button type="button" class="btn btn-outline-success btn-activate"><?php echo _("Activate"); ?></button>
       </div>
     </div>
diff --git a/templates/openvpn/configs.php b/templates/openvpn/configs.php
index 4f7827a0..ca0ac3b2 100644
--- a/templates/openvpn/configs.php
+++ b/templates/openvpn/configs.php
@@ -21,10 +21,10 @@
                 <label><?php echo htmlspecialchars($label, ENT_QUOTES); ?></label>
               </div>
               <div class="col-md-auto px-lg-3 col-xs-2">
-                <button type="button" class="btn btn-outline-success <?php echo $btn_class; ?> js-activate-openvpn-client" data-record-id="<?php echo htmlspecialchars($client, ENT_QUOTES); ?>" data-toggle="modal" data-target="#ovpn-confirm-activate" /><i class="far fa-check-circle"></i></button>
+                <button type="button" class="btn btn-outline-success <?php echo $btn_class; ?> js-activate-openvpn-client" data-record-id="<?php echo htmlspecialchars($client, ENT_QUOTES); ?>" data-bs-toggle="modal" data-bs-target="#ovpn-confirm-activate" /><i class="far fa-check-circle"></i></button>
               </div>
               <div class="col-md-auto col-xs-2">
-                <button type="button" class="btn btn-outline-danger js-remove-openvpn-client" data-record-id="<?php echo htmlspecialchars($client, ENT_QUOTES); ?>" data-toggle="modal" data-target="#ovpn-confirm-delete" /><i class="far fa-trash-alt"></i></button>
+                <button type="button" class="btn btn-outline-danger js-remove-openvpn-client" data-record-id="<?php echo htmlspecialchars($client, ENT_QUOTES); ?>" data-bs-toggle="modal" data-bs-target="#ovpn-confirm-delete" /><i class="far fa-trash-alt"></i></button>
               </div>
             </div><!-- ./row openvpn-client -->
           <?php endforeach ?>
diff --git a/templates/openvpn/general.php b/templates/openvpn/general.php
index 9398884e..80b7a1ba 100644
--- a/templates/openvpn/general.php
+++ b/templates/openvpn/general.php
@@ -4,33 +4,33 @@
     <div class="col-lg-8">
       <div class="row mb-2">
          <div class="col-lg-12 mt-2 mb-2">
-           <div class="row ml-1">
+           <div class="row ms-1">
             <div class="info-item col-xs-3"><?php echo _("IPv4 Address"); ?></div>
-            <div class="info-value col-xs-3"><?php echo htmlspecialchars($public_ip, ENT_QUOTES); ?><a class="text-gray-500" href="https://ipapi.co/<?php echo($public_ip); ?>" target="_blank" rel="noopener noreferrer"><i class="fas fa-external-link-alt ml-2"></i></a></div>
+            <div class="info-value col-xs-3"><?php echo htmlspecialchars($public_ip, ENT_QUOTES); ?><a class="text-gray-500" href="https://ipapi.co/<?php echo($public_ip); ?>" target="_blank" rel="noopener noreferrer"><i class="fas fa-external-link-alt ms-2"></i></a></div>
            </div>
          </div>
       </div>
       <h5><?php echo _("Authentification Method"); ?></h5>
       <div class="col-sm-12 mt-2 mb-2 form-check">
-          <input class="form-check-input" id="ovpn-userpw" name="sel1" value="userpw" data-toggle="" data-parent="#clientsettings" data-target="#UserPW" type="radio" checked>
+          <input class="form-check-input" id="ovpn-userpw" name="sel1" value="userpw" data-bs-toggle="" data-parent="#clientsettings" data-bs-target="#UserPW" type="radio" checked>
           <label class="form-check-label"><?php echo _("Username and password"); ?></label>
       </div>
       <div class="col-sm-12 mt-2 mb-2 form-check">
-          <input class="form-check-input" id="ovpn-certs" name="sel1" value="certs" data-toggle="" data-parent="#clientsettings" data-target="#Certs" type="radio">
+          <input class="form-check-input" id="ovpn-certs" name="sel1" value="certs" data-bs-toggle="" data-parent="#clientsettings" data-bs-target="#Certs" type="radio">
           <label class="form-check-label"><?php echo _("Certificates"); ?></label>
       </div>
-      <div class="col-sm-12 ml-2">
+      <div class="col-sm-12 ms-2">
          <div class="panel-group" id="clientsettings">
            <div class="panel panel-default panel-collapse" id="PanelUserPW" >
              <div class="panel-heading">
                <h5 class="panel-title"><?php echo _("Enter username and password"); ?></h5>
              </div>
              <div class="panel-body">
-                <div class="form-group col-lg-12">
+                <div class="mb-3 col-lg-12">
                   <label for="code"><?php echo _("Username"); ?></label>
                   <input type="text" class="form-control" name="authUser" value="<?php echo htmlspecialchars($authUser, ENT_QUOTES); ?>" />
                 </div>
-                <div class="form-group col-lg-12">
+                <div class="mb-3 col-lg-12">
                   <label for="code"><?php echo _("Password"); ?></label>
                   <input type="password" class="form-control" name="authPassword" value="<?php echo htmlspecialchars($authPassword, ENT_QUOTES); ?>" />
                 </div>
@@ -55,11 +55,11 @@
          </div> <!-- panel-group -->
       </div> <!-- col -->
       <div class="col-sm-12 ">
-         <div class="form-group">
+         <div class="mb-3">
             <h5 class="panel-title"><?php echo _("Configuration File"); ?></h4>
             <div class="custom-file">
-             <input type="file" class="custom-file-input" name="customFile" id="customFile">
-             <label class="custom-file-label" for="customFile"><?php echo _("Select OpenVPN configuration file (.ovpn)"); ?></label>
+             <input type="file" class="form-control" name="customFile" id="customFile">
+             <label class="form-label" for="customFile"><?php echo _("Select OpenVPN configuration file (.ovpn)"); ?></label>
            </div>
          </div>
       </div> <!-- col -->
diff --git a/templates/openvpn/logging.php b/templates/openvpn/logging.php
index 3d74b0e5..4310a8f9 100644
--- a/templates/openvpn/logging.php
+++ b/templates/openvpn/logging.php
@@ -3,13 +3,13 @@
   <h4 class="mt-3 mb-3"><?php echo _("Logging") ?></h4>
   <p><?php echo _("Enable this option to log <code>openvpn</code> activity.") ?></p>
 
-  <div class="custom-control custom-switch">
-    <input class="custom-control-input" id="log-openvpn" type="checkbox" name="log-openvpn" value="1" <?php echo $logEnable ? ' checked="checked"' : "" ?> aria-describedby="log-openvpn">
-    <label class="custom-control-label align-middle" for="log-openvpn"><?php echo _("Enable logging") ?></label>
-    <input type="button" class="btn btn-outline btn-warning btn-sm align-top ml-2" id="js-clearopenvpn-log" value="<?php echo _("Clear log"); ?>" />
+  <div class="form-check form-switch">
+    <input class="form-check-input" id="log-openvpn" type="checkbox" name="log-openvpn" value="1" <?php echo $logEnable ? ' checked="checked"' : "" ?> aria-describedby="log-openvpn">
+    <label class="form-check-label align-middle" for="log-openvpn"><?php echo _("Enable logging") ?></label>
+    <input type="button" class="btn btn-outline btn-warning btn-sm align-top ms-2" id="js-clearopenvpn-log" value="<?php echo _("Clear log"); ?>" />
   </div>
   <div class="row">
-    <div class="form-group col-md-8 mt-2">
+    <div class="mb-3 col-md-8 mt-2">
       <textarea class="logoutput" id="openvpn-log"><?php echo htmlspecialchars($logOutput, ENT_QUOTES); ?></textarea>
     </div>
   </div>
diff --git a/templates/provider.php b/templates/provider.php
index 810a0c04..9f969fa7 100755
--- a/templates/provider.php
+++ b/templates/provider.php
@@ -15,10 +15,10 @@
         <div class="card-header">
           <div class="row">
             <div class="col">
-              <i class="fas fa-shield-alt fa-fw mr-2"></i><?php echo _($providerName); ?>
+              <i class="fas fa-shield-alt fa-fw me-2"></i><?php echo _($providerName); ?>
             </div>
             <div class="col">
-              <button class="btn btn-light btn-icon-split btn-sm service-status float-right">
+              <button class="btn btn-light btn-icon-split btn-sm service-status float-end">
                 <span class="icon text-gray-600"><i class="fas fa-circle service-status-<?php echo $serviceStatus ?>"></i></span>
                 <span class="text service-status"><?php echo strtolower($providerName); ?> <?php echo _($statusDisplay) ?></span>
               </button>
@@ -31,8 +31,8 @@
             <?php echo CSRFTokenFieldTag() ?>
             <!-- Nav tabs -->
             <ul class="nav nav-tabs">
-                <li class="nav-item"><a class="nav-link active" id="clienttab" href="#providerclient" data-toggle="tab"><?php echo _("Settings"); ?></a></li>
-                <li class="nav-item"><a class="nav-link" id="loggingtab" href="#providerstatus" data-toggle="tab"><?php echo _("Status"); ?></a></li>
+                <li class="nav-item"><a class="nav-link active" id="clienttab" href="#providerclient" data-bs-toggle="tab"><?php echo _("Settings"); ?></a></li>
+                <li class="nav-item"><a class="nav-link" id="loggingtab" href="#providerstatus" data-bs-toggle="tab"><?php echo _("Status"); ?></a></li>
             </ul>
 
             <!-- Tab panes -->
diff --git a/templates/provider/general.php b/templates/provider/general.php
index b7e7c5dd..7bdb20ad 100644
--- a/templates/provider/general.php
+++ b/templates/provider/general.php
@@ -4,12 +4,12 @@
     <div class="col-lg-8">
       <div class="row mb-2">
          <div class="col-lg-12 mt-2 mb-2">
-           <div class="row ml-1">
+           <div class="row ms-1">
              <div class="info-item col-xs-3">
-               <i class="fas fa-globe-americas mr-1"></i><?php echo _("IPv4 Address"); ?>
+               <i class="fas fa-globe-americas me-1"></i><?php echo _("IPv4 Address"); ?>
              </div>
              <div class="info-value col-xs-3">
-               <?php echo htmlspecialchars($publicIP, ENT_QUOTES); ?><a class="text-gray-500" href="https://ipapi.co/<?php echo($publicIP); ?>" target="_blank" rel="noopener noreferrer"><i class="fas fa-external-link-alt ml-2"></i></a>
+               <?php echo htmlspecialchars($publicIP, ENT_QUOTES); ?><a class="text-gray-500" href="https://ipapi.co/<?php echo($publicIP); ?>" target="_blank" rel="noopener noreferrer"><i class="fas fa-external-link-alt ms-2"></i></a>
              </div>
            </div>
          </div>
@@ -25,14 +25,14 @@
             <?php foreach ($accountInfo as $item) {
                 echo '<small>'. $item .'</small><br>';
             } ?>
-            <a href="<?php echo($accountLink); ?>" target="_blank" class="btn btn-warning btn-sm mt-2"><i class="fas fa-external-link-alt ml-1 mr-1"></i><?php echo _("My account") ?></a>
+            <a href="<?php echo($accountLink); ?>" target="_blank" class="btn btn-warning btn-sm mt-2"><i class="fas fa-external-link-alt ms-1 me-1"></i><?php echo _("My account") ?></a>
         </div><!-- /.card-body -->
       </div><!-- /.card -->
     </div>
   </div>
   <?php endif; ?>
   <div class="row">
-    <div class="form-group col-md-6 mt-3">
+    <div class="mb-3 col-md-6 mt-3">
       <h5><?php echo _("Server location"); ?></h5>
       <div>
         <small><?php echo _("Choosing <strong>Save settings</strong> will connect to the selected country."); ?></small>
diff --git a/templates/provider/status.php b/templates/provider/status.php
index 90f80f9a..8e4c246f 100644
--- a/templates/provider/status.php
+++ b/templates/provider/status.php
@@ -6,7 +6,7 @@
   <p><?php echo sprintf(_("Current <code>%s</code> connection status is displayed below."), strtolower($providerName)); ?></p>
 
   <div class="row">
-    <div class="form-group col-md-8 mt-2">
+    <div class="mb-3 col-md-8 mt-2">
       <textarea class="logoutput"><?php echo htmlspecialchars($providerLog, ENT_QUOTES); ?></textarea>
     </div>
   </div>
diff --git a/templates/restapi.php b/templates/restapi.php
index fc1d1437..88b6d9dc 100644
--- a/templates/restapi.php
+++ b/templates/restapi.php
@@ -15,10 +15,10 @@
         <div class="card-header">
           <div class="row">
             <div class="col">
-              <i class="fas fa-puzzle-piece mr-2"></i><?php echo _("RestAPI"); ?>
+              <i class="fas fa-puzzle-piece me-2"></i><?php echo _("RestAPI"); ?>
             </div>
             <div class="col">
-              <button class="btn btn-light btn-icon-split btn-sm service-status float-right">
+              <button class="btn btn-light btn-icon-split btn-sm service-status float-end">
                 <span class="icon text-gray-600"><i class="fas fa-circle service-status-<?php echo $serviceStatus ?>"></i></span>
                 <span class="text service-status">restapi.service <?php echo _($serviceStatus) ?></span>
               </button>
@@ -31,8 +31,8 @@
             <?php echo CSRFTokenFieldTag() ?>
             <!-- Nav tabs -->
             <ul class="nav nav-tabs">
-                <li class="nav-item"><a class="nav-link active" id="restapisettingstab" href="#restapisettings" data-toggle="tab"><?php echo _("Settings"); ?></a></li>
-                <li class="nav-item"><a class="nav-link" id="restapistatustab" href="#restapistatus" data-toggle="tab"><?php echo _("Status"); ?></a></li>
+                <li class="nav-item"><a class="nav-link active" id="restapisettingstab" href="#restapisettings" data-bs-toggle="tab"><?php echo _("Settings"); ?></a></li>
+                <li class="nav-item"><a class="nav-link" id="restapistatustab" href="#restapistatus" data-bs-toggle="tab"><?php echo _("Status"); ?></a></li>
             </ul>
 
             <!-- Tab panes -->
diff --git a/templates/restapi/general.php b/templates/restapi/general.php
index 07f12406..2687be45 100644
--- a/templates/restapi/general.php
+++ b/templates/restapi/general.php
@@ -1,14 +1,14 @@
 <div class="tab-pane active" id="restapisettings">
   <h4 class="mt-3"><?php echo ("RestAPI settings") ;?></h4>
   <div class="row">
-    <div class="form-group col-lg-12 mt-2">
+    <div class="mb-3 col-lg-12 mt-2">
       <div class="row">
         <div class="col-md-6">
           <?php echo $docMsg; ?>
         </div>
       </div>
       <div class="row mt-3">
-        <div class="form-group col-md-6" required>
+        <div class="mb-3 col-md-6" required>
           <label for="txtapikey"><?php echo _("API Key"); ?></label>
           <div class="input-group">
               <input type="text" class="form-control" id="txtapikey" name="txtapikey" value="<?php echo htmlspecialchars($apiKey, ENT_QUOTES); ?>" required />
diff --git a/templates/restapi/status.php b/templates/restapi/status.php
index 4cfacb15..ce72c0e0 100644
--- a/templates/restapi/status.php
+++ b/templates/restapi/status.php
@@ -3,7 +3,7 @@
   <h4 class="mt-3 mb-3"><?php echo _("RestAPI status") ;?></h4>
   <p><?php echo _("Current <code>restapi.service</code> status is displayed below."); ?></p>
   <div class="row">
-    <div class="form-group col-md-8 mt-2">
+    <div class="mb-3 col-md-8 mt-2">
       <textarea class="logoutput"><?php echo htmlspecialchars($serviceLog, ENT_QUOTES); ?></textarea>
     </div>
   </div>
diff --git a/templates/system.php b/templates/system.php
index d25c3efa..a69946a8 100755
--- a/templates/system.php
+++ b/templates/system.php
@@ -4,7 +4,7 @@
       <div class="card-header">
         <div class="row">
           <div class="col">
-            <i class="fas fa-cube mr-2"></i><?php echo _("System"); ?>
+            <i class="fas fa-cube me-2"></i><?php echo _("System"); ?>
           </div>
         </div><!-- /.row -->
       </div><!-- /.card-header -->
@@ -13,11 +13,11 @@
         <form role="form" action="system_info" method="POST">
         <?php echo CSRFTokenFieldTag() ?>
         <ul class="nav nav-tabs" role="tablist">
-          <li role="presentation" class="nav-item"><a class="nav-link active" id="basictab" href="#basic" aria-controls="basic" role="tab" data-toggle="tab"><?php echo _("Basic"); ?></a></li>
-          <li role="presentation" class="nav-item"><a class="nav-link" id="languagetab" href="#language" aria-controls="language" role="tab" data-toggle="tab"><?php echo _("Language"); ?></a></li>
-          <li role="presentation" class="nav-item"><a class="nav-link" id="themetab" href="#theme" aria-controls="theme" role="tab" data-toggle="tab"><?php echo _("Theme"); ?></a></li>
-          <li role="presentation" class="nav-item"><a class="nav-link" id="advancedtab" href="#advanced" aria-controls="advanced" role="tab" data-toggle="tab"><?php echo _("Advanced"); ?></a></li>
-          <li role="presentation" class="nav-item"><a class="nav-link" id="toolstab" href="#tools" aria-controls="tools" role="tab" data-toggle="tab"><?php echo _("Tools"); ?></a></li>
+          <li role="presentation" class="nav-item"><a class="nav-link active" id="basictab" href="#basic" aria-controls="basic" role="tab" data-bs-toggle="tab"><?php echo _("Basic"); ?></a></li>
+          <li role="presentation" class="nav-item"><a class="nav-link" id="languagetab" href="#language" aria-controls="language" role="tab" data-bs-toggle="tab"><?php echo _("Language"); ?></a></li>
+          <li role="presentation" class="nav-item"><a class="nav-link" id="themetab" href="#theme" aria-controls="theme" role="tab" data-bs-toggle="tab"><?php echo _("Theme"); ?></a></li>
+          <li role="presentation" class="nav-item"><a class="nav-link" id="advancedtab" href="#advanced" aria-controls="advanced" role="tab" data-bs-toggle="tab"><?php echo _("Advanced"); ?></a></li>
+          <li role="presentation" class="nav-item"><a class="nav-link" id="toolstab" href="#tools" aria-controls="tools" role="tab" data-bs-toggle="tab"><?php echo _("Tools"); ?></a></li>
         </ul>
           <!-- Tab panes -->
           <div class="tab-content">
@@ -39,13 +39,13 @@
   <div class="modal-dialog" role="document">
     <div class="modal-content">
       <div class="modal-header">
-      <div class="modal-title" id="ModalLabel"><i class="fas fa-history mr-2"></i><?php echo _("System reset"); ?></div>
+      <div class="modal-title" id="ModalLabel"><i class="fas fa-history me-2"></i><?php echo _("System reset"); ?></div>
       </div>
       <div class="modal-body">
         <div class="col-md-12 mb-3 mt-1" data-message="<?php echo _("Reset complete. Restart the hotspot for the changes to take effect."); ?>" id="system-reset-message"><?php echo _("Reset RaspAP to its initial configuration? This action cannot be undone."); ?></div>
       </div>
       <div class="modal-footer">
-      <button type="button" id="js-system-reset-cancel" data-message="<?php echo _("Close"); ?>" class="btn btn-outline-secondary" data-dismiss="modal"><?php echo _("Cancel"); ?></button>
+      <button type="button" id="js-system-reset-cancel" data-message="<?php echo _("Close"); ?>" class="btn btn-outline-secondary" data-bs-dismiss="modal"><?php echo _("Cancel"); ?></button>
       <button type="button" id="js-system-reset-confirm" data-message="<?php echo _("System reset in progress..."); ?>" class="btn btn-outline-danger btn-delete"><?php echo _("Reset"); ?></button>
       </div>
     </div>
@@ -57,13 +57,13 @@
   <div class="modal-dialog" role="document">
     <div class="modal-content">
       <div class="modal-header">
-      <div class="modal-title" id="ModalLabel"><i class="fas fa-sync mr-2"></i><?php echo _("System reboot"); ?></div>
+      <div class="modal-title" id="ModalLabel"><i class="fas fa-sync me-2"></i><?php echo _("System reboot"); ?></div>
       </div>
       <div class="modal-body">
         <div class="col-md-12 mb-3 mt-1" id="system-reboot-message"><?php echo _("Reboot now? The system will be temporarily unavailable."); ?></div>
       </div>
       <div class="modal-footer">
-      <button type="button" data-message="<?php echo _("Close"); ?>" class="btn btn-outline-secondary" data-dismiss="modal"><?php echo _("Cancel"); ?></button>
+      <button type="button" data-message="<?php echo _("Close"); ?>" class="btn btn-outline-secondary" data-bs-dismiss="modal"><?php echo _("Cancel"); ?></button>
       <button type="button" id="js-sys-reboot" data-action="reboot" class="btn btn-outline-danger btn-delete"><?php echo _("Reboot"); ?></button>
       </div>
     </div>
@@ -75,13 +75,13 @@
   <div class="modal-dialog" role="document">
     <div class="modal-content">
       <div class="modal-header">
-      <div class="modal-title" id="ModalLabel"><i class="fas fa-power-off mr-2"></i><?php echo _("System shutdown"); ?></div>
+      <div class="modal-title" id="ModalLabel"><i class="fas fa-power-off me-2"></i><?php echo _("System shutdown"); ?></div>
       </div>
       <div class="modal-body">
         <div class="col-md-12 mb-3 mt-1" id="system-reboot-message"><?php echo _("Shutdown now? The system will be unavailable."); ?></div>
       </div>
       <div class="modal-footer">
-      <button type="button" data-message="<?php echo _("Close"); ?>" class="btn btn-outline-secondary" data-dismiss="modal"><?php echo _("Cancel"); ?></button>
+      <button type="button" data-message="<?php echo _("Close"); ?>" class="btn btn-outline-secondary" data-bs-dismiss="modal"><?php echo _("Cancel"); ?></button>
       <button type="button" id="js-sys-shutdown" data-action="shutdown" class="btn btn-outline-danger btn-delete"><?php echo _("Shutdown"); ?></button>
       </div>
     </div>
@@ -93,13 +93,13 @@
   <div class="modal-dialog" role="document">
     <div class="modal-content">
       <div class="modal-header">
-      <div class="modal-title" id="ModalLabel"><i class="fas fa-sync-alt fa-spin mr-2"></i><?php echo _("Generate debug log"); ?></div>
+      <div class="modal-title" id="ModalLabel"><i class="fas fa-sync-alt fa-spin me-2"></i><?php echo _("Generate debug log"); ?></div>
       </div>
       <div class="modal-body">
         <div class="col-md-12 mb-3 mt-1" id="system-debug-message"><?php echo _("Debug log generation in progress..."); ?></div>
       </div>
       <div class="modal-footer">
-      <button type="button" data-message="<?php echo _("Close"); ?>" class="btn btn-outline-secondary" data-dismiss="modal"><?php echo _("Close"); ?></button>
+      <button type="button" data-message="<?php echo _("Close"); ?>" class="btn btn-outline-secondary" data-bs-dismiss="modal"><?php echo _("Close"); ?></button>
       </div>
     </div>
   </div>
diff --git a/templates/system/advanced.php b/templates/system/advanced.php
index efab1cc2..0f110932 100644
--- a/templates/system/advanced.php
+++ b/templates/system/advanced.php
@@ -5,19 +5,19 @@
     <form action="system_info" method="POST">
     <?php echo CSRFTokenFieldTag() ?>
       <div class="row">
-        <div class="form-group col-md-6">
+        <div class="mb-3 col-md-6">
           <label for="code"><?php echo _("Web server port") ;?></label>
           <input type="text" class="form-control" name="serverPort" value="<?php echo htmlspecialchars($serverPort, ENT_QUOTES); ?>" />
         </div>
       </div>
       <div class="row">
-        <div class="form-group col-md-6">
+        <div class="mb-3 col-md-6">
           <label for="code"><?php echo _("Web server bind address") ;?></label>
           <input type="text" class="form-control" name="serverBind" value="<?php echo htmlspecialchars($serverBind, ENT_QUOTES); ?>" />
         </div>
       </div>
       <div class="row">
-        <div class="form-group col-md-6">
+        <div class="mb-3 col-md-6">
           <label for="code"><?php echo _("Diagnostic log size limit (KB)") ;?></label>
           <input type="text" class="form-control" name="logLimit" value="<?php echo htmlspecialchars($logLimit, ENT_QUOTES); ?>" />
         </div>
diff --git a/templates/system/basic.php b/templates/system/basic.php
index 182a5bb1..6938ab35 100644
--- a/templates/system/basic.php
+++ b/templates/system/basic.php
@@ -8,7 +8,7 @@ include('includes/sysstats.php');
   <div class="row">
     <div class="col-lg-6">
       <h4 class="mt-3"><?php echo _("System Information"); ?></h4>
-        <div class="row ml-1">
+        <div class="row ms-1">
           <div class="col-sm">
             <div class="row mb-1">
               <div class="info-item col-xs-3"><?php echo _("Hostname"); ?></div><div class="info-value col-xs-3"><?php echo htmlspecialchars($hostname, ENT_QUOTES); ?></div>
@@ -55,8 +55,8 @@ include('includes/sysstats.php');
       <form action="system_info" method="POST">
         <?php echo CSRFTokenFieldTag() ?>
         <?php if (!RASPI_MONITOR_ENABLED) : ?>
-            <input type="button" class="btn btn-warning" data-toggle="modal" data-target="#system-confirm-reboot" value="<?php echo _("Reboot"); ?>" />
-            <input type="button" class="btn btn-warning" data-toggle="modal" data-target="#system-confirm-shutdown" value="<?php echo _("Shutdown"); ?>" />
+            <input type="button" class="btn btn-warning" data-bs-toggle="modal" data-bs-target="#system-confirm-reboot" value="<?php echo _("Reboot"); ?>" />
+            <input type="button" class="btn btn-warning" data-bs-toggle="modal" data-bs-target="#system-confirm-shutdown" value="<?php echo _("Shutdown"); ?>" />
         <?php endif ?>
         <button type="button" onClick="window.location.reload();" class="btn btn-outline btn-primary"><i class="fas fa-sync-alt"></i> <?php echo _("Refresh") ?></a>
      </form>
diff --git a/templates/system/language.php b/templates/system/language.php
index 2b04cd53..bb6503df 100644
--- a/templates/system/language.php
+++ b/templates/system/language.php
@@ -2,7 +2,7 @@
 <div role="tabpanel" class="tab-pane" id="language">
     <h4 class="mt-3"><?php echo _("Language settings") ;?></h4>
     <div class="row">
-      <div class="form-group col-md-6">
+      <div class="mb-3 col-md-6">
         <label for="code"><?php echo _("Select a language"); ?></label>
         <?php SelectorOptions('locale', $arrLocales, $_SESSION['locale']); ?>
       </div>
diff --git a/templates/system/theme.php b/templates/system/theme.php
index 10bb42ec..83caeae6 100644
--- a/templates/system/theme.php
+++ b/templates/system/theme.php
@@ -2,7 +2,7 @@
 <div role="tabpanel" class="tab-pane" id="theme">
   <h4 class="mt-3"><?php echo _("Change theme") ;?></h4>
     <div class="row">
-    <div class="form-group col-xs-3 col-sm-3">
+    <div class="mb-3 col-xs-3 col-sm-3">
       <label for="code"><?php echo _("Select a theme"); ?></label>
       <?php SelectorOptions("theme", $themes, $selectedTheme, "theme-select") ?>
     </div>
diff --git a/templates/system/tools.php b/templates/system/tools.php
index cdea6555..0cbf3ea2 100644
--- a/templates/system/tools.php
+++ b/templates/system/tools.php
@@ -5,7 +5,7 @@
     <?php echo CSRFTokenFieldTag() ?>
 
       <div class="row">
-        <div class="form-group col-lg-8 col-md-8">
+        <div class="mb-3 col-lg-8 col-md-8">
           <label for="debug">
             <?php echo sprintf(_("To generate a system <a href=\"%s\" target=\"_blank\">debug log</a>, click or tap the button below."), "https://docs.raspap.com/ap-basics/#debug-log"); ;?>
           </label>
@@ -14,12 +14,12 @@
           </div>
         </div>
       </div>
-      <button type="button" class="btn btn-warning mb-3" name="debug-log" data-toggle="modal" data-target="#debugModal" />
-        <i class="fas fa-ambulance ml-1 mr-2"></i><?php echo _("Generate debug log"); ?>
+      <button type="button" class="btn btn-warning mb-3" name="debug-log" data-bs-toggle="modal" data-bs-target="#debugModal" />
+        <i class="fas fa-ambulance ms-1 me-2"></i><?php echo _("Generate debug log"); ?>
       </button>
 
       <div class="row">
-        <div class="form-group col-lg-8 col-md-8">
+        <div class="mb-3 col-lg-8 col-md-8">
           <label for="reset">
             <?php echo sprintf(_("To reset RaspAP to its <a href=\"%s\" target=\"_blank\">initial configuration</a>, click or tap the button below."), "https://docs.raspap.com/defaults/"); ;?>
           </label>
@@ -29,8 +29,8 @@
           </div>
         </div>
       </div>
-      <button type="button" class="btn btn-danger" name="system-reset" data-toggle="modal" data-target="#system-confirm-reset" />
-        <i class="fas fa-history ml-1 mr-2"></i><?php echo _("Perform reset"); ?>
+      <button type="button" class="btn btn-danger" name="system-reset" data-bs-toggle="modal" data-bs-target="#system-confirm-reset" />
+        <i class="fas fa-history ms-1 me-2"></i><?php echo _("Perform reset"); ?>
       </button>
 
     <?php endif ?>
diff --git a/templates/torproxy.php b/templates/torproxy.php
index bd913e4a..f28ec3cf 100755
--- a/templates/torproxy.php
+++ b/templates/torproxy.php
@@ -5,8 +5,8 @@
         <div class="card-body">
             <!-- Nav tabs -->
             <ul class="nav nav-tabs">
-                <li class="nav-item"><a class="nav-link active" href="#basic" data-toggle="tab">Basic</a></li>
-                <li class="nav-item"><a class="nav-link" href="#relay" data-toggle="tab">Relay</a>
+                <li class="nav-item"><a class="nav-link active" href="#basic" data-bs-toggle="tab">Basic</a></li>
+                <li class="nav-item"><a class="nav-link" href="#relay" data-bs-toggle="tab">Relay</a>
                 </li>
             </ul>
 
@@ -19,37 +19,37 @@
                     <form role="form" action="save_hostapd_conf" method="POST">
                     <?php echo CSRFTokenFieldTag() ?>
                     <div class="row">
-                        <div class="form-group col-md-6">
+                        <div class="mb-3 col-md-6">
                             <label for="code">VirtualAddrNetwork</label>
                             <input type="text" class="form-control" name="virtualaddrnetwork" value="<?php echo htmlspecialchars($arrConfig['VirtualAddrNetwork'], ENT_QUOTES); ?>" />
                         </div>
                     </div>
                     <div class="row">
-                        <div class="form-group col-md-6">
+                        <div class="mb-3 col-md-6">
                             <label for="code">AutomapHostsSuffixes</label>
                             <input type="text" class="form-control" name="automaphostssuffixes" value="<?php echo htmlspecialchars($arrConfig['AutomapHostsSuffixes'], ENT_QUOTES); ?>" />
                         </div>
                     </div>
                     <div class="row">
-                        <div class="form-group col-md-6">
+                        <div class="mb-3 col-md-6">
                             <label for="code">AutomapHostsOnResolve</label>
                             <input type="text" class="form-control" name="automaphostsonresolve" value="<?php echo htmlspecialchars($arrConfig['AutomapHostsOnResolve'], ENT_QUOTES); ?>" />
                         </div>
                     </div>  
                     <div class="row">
-                        <div class="form-group col-md-6">
+                        <div class="mb-3 col-md-6">
                             <label for="code">TransListenAddress</label>
                             <input type="text" class="form-control" name="translistenaddress" value="<?php echo htmlspecialchars($arrConfig['TransListenAddress'], ENT_QUOTES); ?>" />
                         </div>
                     </div>  
                     <div class="row">
-                        <div class="form-group col-md-6">
+                        <div class="mb-3 col-md-6">
                             <label for="code">DNSPort</label>
                             <input type="text" class="form-control" name="dnsport" value="<?php echo htmlspecialchars($arrConfig['DNSPort'], ENT_QUOTES); ?>" />
                         </div>
                     </div>
                     <div class="row">
-                        <div class="form-group col-md-6">
+                        <div class="mb-3 col-md-6">
                             <label for="code">DNSListenAddress</label>
                             <input type="text" class="form-control" name="dnslistenaddress" value="<?php echo htmlspecialchars($arrConfig['DNSListenAddress'], ENT_QUOTES); ?>" />
                         </div>
@@ -58,37 +58,37 @@
                 <div class="tab-pane fade" id="relay">
                     <h4>Relay settings</h4>
                     <div class="row">
-                        <div class="form-group col-md-6">
+                        <div class="mb-3 col-md-6">
                             <label for="code">ORPort</label>
                             <input type="text" class="form-control" name="orport" value="<?php echo htmlspecialchars($arrConfig['ORPort'], ENT_QUOTES); ?>" />
                         </div>
                     </div>
                     <div class="row">
-                        <div class="form-group col-md-6">
+                        <div class="mb-3 col-md-6">
                             <label for="code">ORListenAddress</label>
                             <input type="text" class="form-control" name="orlistenaddress" value="<?php echo htmlspecialchars($arrConfig['ORListenAddress'], ENT_QUOTES); ?>" />
                         </div>
                     </div>
                     <div class="row">
-                        <div class="form-group col-md-6">
+                        <div class="mb-3 col-md-6">
                             <label for="code">Nickname</label>
                             <input type="text" class="form-control" name="nickname" value="<?php echo htmlspecialchars($arrConfig['Nickname'], ENT_QUOTES); ?>" />
                         </div>
                     </div>
                     <div class="row">
-                        <div class="form-group col-md-6">
+                        <div class="mb-3 col-md-6">
                             <label for="code">Address</label>
                             <input type="text" class="form-control" name="address" value="<?php echo htmlspecialchars($arrConfig['Address'], ENT_QUOTES); ?>" />
                         </div>
                     </div>
                     <div class="row">
-                        <div class="form-group col-md-6">
+                        <div class="mb-3 col-md-6">
                             <label for="code">RelayBandwidthRate</label>
                             <input type="text" class="form-control" name="relaybandwidthrate" value="<?php echo htmlspecialchars($arrConfig['RelayBandwidthRate'], ENT_QUOTES); ?>" />
                         </div>
                     </div>
                     <div class="row">
-                        <div class="form-group col-md-6">
+                        <div class="mb-3 col-md-6">
                             <label for="code">RelayBandwidthBurst</label>
                             <input type="text" class="form-control" name="relaybandwidthburst" value="<?php echo htmlspecialchars($arrConfig['RelayBandwidthBurst'], ENT_QUOTES); ?>" />
                         </div>
diff --git a/templates/wg/general.php b/templates/wg/general.php
index 25d74d12..d8032a87 100644
--- a/templates/wg/general.php
+++ b/templates/wg/general.php
@@ -6,20 +6,20 @@
         <div class="col-lg-12 mt-2">
           <div class="row mt-3 mb-2">
             <div class="info-item col-xs-3"><?php echo _("IPv4 Address"); ?></div>
-            <div class="info-value col-xs-3"><?php echo htmlspecialchars($public_ip, ENT_QUOTES); ?><a class="text-gray-500" href="https://ipapi.co/<?php echo($public_ip); ?>" target="_blank" rel="noopener noreferrer"><i class="fas fa-external-link-alt ml-2"></i></a></div>
+            <div class="info-value col-xs-3"><?php echo htmlspecialchars($public_ip, ENT_QUOTES); ?><a class="text-gray-500" href="https://ipapi.co/<?php echo($public_ip); ?>" target="_blank" rel="noopener noreferrer"><i class="fas fa-external-link-alt ms-2"></i></a></div>
           </div>
         </div>
         <h5><?php echo _("Configuration Method"); ?></h5>
         <div class="col-sm-12 mt-2 mb-2 form-check">
-          <input class="form-check-input" id="wg-upload" name="wgCnfOpt" value="upload" data-toggle="" data-parent="#serversettings" data-target="#wgUpload" type="radio" checked>
+          <input class="form-check-input" id="wg-upload" name="wgCnfOpt" value="upload" data-bs-toggle="" data-parent="#serversettings" data-bs-target="#wgUpload" type="radio" checked>
           <label class="form-check-label"><?php echo _("Upload file"); ?></label>
         </div>
         <div class="col-sm-12 mt-2 mb-2 form-check">
-          <input class="form-check-input" id="wg-manual" name="wgCnfOpt" value="manual" data-toggle="" data-parent="#serversettings" data-target="#wgManual" type="radio">
+          <input class="form-check-input" id="wg-manual" name="wgCnfOpt" value="manual" data-bs-toggle="" data-parent="#serversettings" data-bs-target="#wgManual" type="radio">
           <label class="form-check-label"><?php echo _("Create manually"); ?></label>
         </div>
 
-        <div class="col-sm-12 ml-2">
+        <div class="col-sm-12 ms-2">
           <div class="panel-group" id="serversettings">
 
             <div class="panel panel-default panel-collapse" id="PanelUpload">
@@ -31,23 +31,23 @@
               </div>
               <div class="panel-body">
 
-                <div class="form-group">
-                  <div class="custom-control custom-switch">
+                <div class="mb-3">
+                  <div class="form-check form-switch">
                     <?php $checked = $optRules == 1 ? 'checked="checked"' : '' ?>
-                    <input class="custom-control-input" id="chxwgrules" name="wgRules" type="checkbox" value="1" <?php echo $checked ?> />
-                    <label class="custom-control-label" for="chxwgrules"><?php echo _("Apply iptables rules for AP interface"); ?></label>
-                    <i class="fas fa-question-circle text-muted" data-toggle="tooltip" data-placement="auto" title="<?php echo _("Recommended if you wish to forward network traffic from the wg0 interface to clients connected on the AP interface."); ?>"></i>
+                    <input class="form-check-input" id="chxwgrules" name="wgRules" type="checkbox" value="1" <?php echo $checked ?> />
+                    <label class="form-check-label" for="chxwgrules"><?php echo _("Apply iptables rules for AP interface"); ?></label>
+                    <i class="fas fa-question-circle text-muted" data-bs-toggle="tooltip" data-bs-placement="auto" title="<?php echo _("Recommended if you wish to forward network traffic from the wg0 interface to clients connected on the AP interface."); ?>"></i>
                     <p id="wg-description">
                       <small><?php printf(_("This option adds <strong>iptables</strong> <code>Postup</code> and <code>PostDown</code> rules for the configured AP interface (%s)."), $_SESSION['ap_interface']) ?></small>
                     </p>
                   </div>
                 </div>
 
-                <div class="form-group">
+                <div class="mb-3">
                   <h5 class="panel-title"><?php echo _("Configuration File"); ?></h4>
                   <div class="custom-file">
-                    <input type="file" class="custom-file-input" name="wgFile" id="wgFile">
-                    <label class="custom-file-label" for="wgFile"><?php echo _("Select WireGuard configuration file (.conf)"); ?></label>
+                    <input type="file" class="form-control" name="wgFile" id="wgFile">
+                    <label class="form-label" for="wgFile"><?php echo _("Select WireGuard configuration file (.conf)"); ?></label>
                   </div>
                 </div>
                 <div class="row mb-2"></div>
@@ -59,9 +59,9 @@
               <div class="panel-heading">
                 <h5 class="panel-title"><?php echo _("Create a local WireGuard config"); ?></h5>
                 <div class="input-group">
-                  <div class="custom-control custom-switch">
-                    <input class="custom-control-input" id="server_enabled" type="checkbox" name="wgSrvEnable" value="1" <?php echo $wg_senabled ? ' checked="checked"' : "" ?> aria-describedby="server-description">
-                    <label class="custom-control-label" for="server_enabled"><?php echo _("Enable server") ?></label>
+                  <div class="form-check form-switch">
+                    <input class="form-check-input" id="server_enabled" type="checkbox" name="wgSrvEnable" value="1" <?php echo $wg_senabled ? ' checked="checked"' : "" ?> aria-describedby="server-description">
+                    <label class="form-check-label" for="server_enabled"><?php echo _("Enable server") ?></label>
                   </div>
                   <p id="wg-description">
                     <small>
@@ -77,21 +77,21 @@
                 <div class="input-group col-md-12 mb-3">
                   <input type="text" class="form-control" name="wg-server" id="wg-srvpubkey" value="<?php echo htmlspecialchars($wg_srvpubkey, ENT_QUOTES); ?>" />
                   <div class="input-group-append">
-                    <button class="btn btn-outline-secondary rounded-right wg-keygen" type="button"><i class="fas fa-magic"></i></button>
-                    <span id="wg-server-pubkey-status" class="input-group-addon check-hidden ml-2 mt-1"><i class="fas fa-check"></i></span>
+                    <button class="btn btn-outline-secondary rounded-end wg-keygen" type="button"><i class="fas fa-magic"></i></button>
+                    <span id="wg-server-pubkey-status" class="input-group-addon check-hidden ms-2 mt-1"><i class="fas fa-check"></i></span>
                   </div>
                 </div>
               </div>
 
-              <div class="form-group col-xs-3 col-sm-3">
+              <div class="mb-3 col-xs-3 col-sm-3">
                 <label for="code"><?php echo _("Local Port"); ?></label>
                 <input type="text" class="form-control" name="wg_srvport" value="<?php echo htmlspecialchars($wg_srvport, ENT_QUOTES); ?>" />
               </div>
-              <div class="form-group col-md-6">
+              <div class="mb-3 col-md-6">
                 <label for="code"><?php echo _("IP Address"); ?></label>
                 <input type="text" class="form-control" name="wg_srvipaddress" value="<?php echo htmlspecialchars($wg_srvipaddress, ENT_QUOTES); ?>" />
               </div>
-              <div class="form-group col-md-6">
+              <div class="mb-3 col-md-6">
                 <label for="code"><?php echo _("DNS"); ?></label>
                 <input type="text" class="form-control" name="wg_srvdns" value="<?php echo htmlspecialchars($wg_srvdns, ENT_QUOTES); ?>" />
               </div>
diff --git a/templates/wg/logging.php b/templates/wg/logging.php
index 02516139..cbccfe64 100644
--- a/templates/wg/logging.php
+++ b/templates/wg/logging.php
@@ -4,9 +4,9 @@
     <div class="col-md-12">
       <h4 class="mt-3"><?php echo _("Logging"); ?></h4>
         <p><?php echo _("Enable this option to display an updated <code>wg-quick</code> debug log.") ?></p>
-        <div class="custom-control custom-switch">
-          <input class="custom-control-input" id="wgLogEnable" type="checkbox" name="wgLogEnable" value="1" <?php echo $optLogEnable ? ' checked="checked"' : "" ?> aria-describedby="wgLogEnable">
-          <label class="custom-control-label" for="wgLogEnable"><?php echo _("Logfile output") ?></label>
+        <div class="form-check form-switch">
+          <input class="form-check-input" id="wgLogEnable" type="checkbox" name="wgLogEnable" value="1" <?php echo $optLogEnable ? ' checked="checked"' : "" ?> aria-describedby="wgLogEnable">
+          <label class="form-check-label" for="wgLogEnable"><?php echo _("Logfile output") ?></label>
         </div>
         <?php
           exec('sudo chmod o+r /tmp/wireguard.log');
diff --git a/templates/wg/peers.php b/templates/wg/peers.php
index d4347575..fad228c4 100644
--- a/templates/wg/peers.php
+++ b/templates/wg/peers.php
@@ -5,9 +5,9 @@
       <h4 class="mt-3"><?php echo _("Peer"); ?></h4>
         <div class="input-group">
           <input type="hidden" name="peer_id" value="1">
-          <div class="custom-control custom-switch">
-            <input class="custom-control-input" id="peer_enabled" type="checkbox" name="wg_penabled" value="1" <?php echo $wg_penabled ? ' checked="checked"' : "" ?> aria-describedby="endpoint-description">
-          <label class="custom-control-label" for="peer_enabled"><?php echo _("Enable peer") ?></label>
+          <div class="form-check form-switch">
+            <input class="form-check-input" id="peer_enabled" type="checkbox" name="wg_penabled" value="1" <?php echo $wg_penabled ? ' checked="checked"' : "" ?> aria-describedby="endpoint-description">
+          <label class="form-check-label" for="peer_enabled"><?php echo _("Enable peer") ?></label>
         </div>
         <p id="wg-description">
           <small><?php echo _("Enable this option to encrypt traffic by creating a tunnel between RaspAP and this peer.") ?></small>
@@ -22,28 +22,28 @@
         <div class="input-group col-md-12">
           <input type="text" class="form-control" name="wg-peer" id="wg-peerpubkey" value="<?php echo htmlspecialchars($wg_peerpubkey, ENT_QUOTES); ?>" />
           <div class="input-group-append">
-            <button class="btn btn-outline-secondary rounded-right wg-keygen" type="button"><i class="fas fa-magic"></i></button>
-            <span id="wg-peer-pubkey-status" class="input-group-addon check-hidden ml-2 mt-1"><i class="fas fa-check"></i></span>
+            <button class="btn btn-outline-secondary rounded-end wg-keygen" type="button"><i class="fas fa-magic"></i></button>
+            <span id="wg-peer-pubkey-status" class="input-group-addon check-hidden ms-2 mt-1"><i class="fas fa-check"></i></span>
           </div>
         </div>
       </div>
 
       <div class="row">
-        <div class="form-group col-xs-3 col-sm-3 mt-3">
+        <div class="mb-3 col-xs-3 col-sm-3 mt-3">
           <label for="code"><?php echo _("Local Port"); ?></label>
           <input type="text" class="form-control" name="wg_plistenport" value="<?php echo htmlspecialchars($wg_plistenport, ENT_QUOTES); ?>" />
         </div>
       </div>
 
       <div class="row">
-        <div class="form-group col-xs-3 col-sm-6">
+        <div class="mb-3 col-xs-3 col-sm-6">
           <label for="code"><?php echo _("IP Address"); ?></label>
           <input type="text" class="form-control" name="wg_pipaddress" value="<?php echo htmlspecialchars($wg_pipaddress, ENT_QUOTES); ?>" />
         </div>
       </div>
 
       <div class="row">
-        <div class="form-group col-xs-3 col-sm-6">
+        <div class="mb-3 col-xs-3 col-sm-6">
           <label for="code"><?php echo _("Endpoint address"); ?></label>
           <input type="text" class="form-control" name="wg_pendpoint" value="<?php echo htmlspecialchars($wg_pendpoint, ENT_QUOTES); ?>" />
         </div>
@@ -65,14 +65,14 @@
     </div>
 
     <div class="col-md-6 mt-5">
-      <figure class="figure w-75 ml-3">
+      <figure class="figure w-75 ms-3">
         <?php if ($wg_penabled == true ) : ?>
         <img src="app/img/wg-qr-code.php" class="figure-img img-fluid" alt="RaspAP Wifi QR code" style="width:100%;">
         <figcaption class="figure-caption">
           <?php echo _("Scan this QR code with your client to connect to this tunnel"); ?>
           <?php echo _("or download the <code>client.conf</code> file to your device."); ?>
         </figcaption>
-        <button class="btn btn-outline-secondary rounded-right wg-client-dl mt-2" type="button"><?php echo _("Download"); ?> <i class="fas fa-download ml-1"></i></button> 
+        <button class="btn btn-outline-secondary rounded-end wg-client-dl mt-2" type="button"><?php echo _("Download"); ?> <i class="fas fa-download ms-1"></i></button> 
         <?php endif; ?>
       </figure>
     </div>
diff --git a/templates/wifi_stations.php b/templates/wifi_stations.php
index 63aba12c..2816d71a 100755
--- a/templates/wifi_stations.php
+++ b/templates/wifi_stations.php
@@ -1,13 +1,13 @@
 <?php if (empty($networks)): ?>
-  <div class="col-md-6 ml-6">
+  <div class="col-md-6 ms-6">
     <p class="lead text-center"><?php echo _('No Wifi stations found') ?></p>
     <p class="text-center"><?php echo _("Click 'Rescan' to search for nearby Wifi stations.") ?></p>
     <?php if (!RASPI_MONITOR_ENABLED) : ?>
     <p class="text-center"><?php echo _("Click 'Reinitialize' to force reinitialize <code>wpa_supplicant</code>.") ?></p>
     <form method="POST" action="wpa_conf" name="wpa_conf_form" class="row">
       <?php echo CSRFTokenFieldTag() ?>
-        <div class="col-xs mr-3 mb-3">
-          <input type="submit" class="btn btn-warning btn-block float-right" name="wpa_reinit" value="<?php echo _("Reinitialize"); ?>" />
+        <div class="col-xs me-3 mb-3">
+          <input type="submit" class="btn btn-warning btn-block float-end" name="wpa_reinit" value="<?php echo _("Reinitialize"); ?>" />
         </div>
     </form>
     <?php endif ?>
diff --git a/templates/wifi_stations/network.php b/templates/wifi_stations/network.php
index 17db4992..9ee6a3c4 100644
--- a/templates/wifi_stations/network.php
+++ b/templates/wifi_stations/network.php
@@ -4,7 +4,7 @@
 		<?php if (strlen($network['ssid']) == 0) {
 			$network['ssid'] = "(unknown)";
 		} ?>
-		<h5 class="card-title"><i class="fas fa-wifi mr-2"></i><?php echo htmlspecialchars($network['ssidutf8'], ENT_QUOTES); ?></h5>
+		<h5 class="card-title"><i class="fas fa-wifi me-2"></i><?php echo htmlspecialchars($network['ssidutf8'], ENT_QUOTES); ?></h5>
 		<div class="info-item-wifi"><?php echo _("Status"); ?></div>
 		<div>
 			<?php if ($network['configured']) { ?>
@@ -32,7 +32,7 @@
 			<?php if (isset($network['RSSI']) && $network['RSSI'] >= -200) {
                 echo '<div class="d-flex justify-content-start">';
                 echo getSignalBars($network['RSSI']);
-                echo '<div class="ml-2">' .htmlspecialchars($network['RSSI'], ENT_QUOTES) . "dB" . "</div>";
+                echo '<div class="ms-2">' .htmlspecialchars($network['RSSI'], ENT_QUOTES) . "dB" . "</div>";
                 echo '</div>';
 			} else {
 				echo " not found ";
@@ -48,15 +48,15 @@
         <div class="info-item-wifi"><?php echo _("Security"); ?></div>
         <div><?php echo empty($network['protocol']) ? "-" : $network['protocol'] ?></div>
 
-		<div class="form-group">
+		<div class="mb-3">
 			<div class="info-item-wifi mb-2"><?php echo _("Passphrase"); ?></div>
 			<div class="input-group">
 				<?php if ($network['protocol'] === 'Open') { ?>
 					<input type="password" disabled class="form-control" aria-describedby="passphrase" name="passphrase<?php echo $index ?>" value="" />
 				<?php } else { ?>
-					<input type="password" class="form-control" aria-describedby="passphrase" name="passphrase<?php echo $index ?>" value="<?php echo htmlspecialchars($network['passphrase']); ?>" data-target="#update<?php echo $index ?>" data-colors="#ffd0d0,#d0ffd0">
+					<input type="password" class="form-control" aria-describedby="passphrase" name="passphrase<?php echo $index ?>" value="<?php echo htmlspecialchars($network['passphrase']); ?>" data-bs-target="#update<?php echo $index ?>" data-colors="#ffd0d0,#d0ffd0">
 					<div class="input-group-append">
-						<button class="btn btn-light js-toggle-password" type="button" data-target="[name=passphrase<?php echo $index ?>]" data-toggle-with="fas fa-eye-slash"><i class="fas fa-eye mx-2"></i></button>
+						<button class="btn btn-light js-toggle-password" type="button" data-bs-target="[name=passphrase<?php echo $index ?>]" data-toggle-with="fas fa-eye-slash"><i class="fas fa-eye mx-2"></i></button>
 					</div>
 				<?php } ?>
 			</div>
@@ -64,12 +64,12 @@
 
 		<div class="btn-group btn-block ">
 			<?php if ($network['configured']) { ?>
-				<input type="submit" class="col-xs-4 col-md-4 btn btn-warning" value="<?php echo _("Update"); ?>" id="update<?php echo $index ?>" name="update<?php echo $index ?>"<?php echo ($network['protocol'] === 'Open' ? ' disabled' : '')?> data-toggle="modal" data-target="#configureClientModal" />
+				<input type="submit" class="col-xs-4 col-md-4 btn btn-warning" value="<?php echo _("Update"); ?>" id="update<?php echo $index ?>" name="update<?php echo $index ?>"<?php echo ($network['protocol'] === 'Open' ? ' disabled' : '')?> data-bs-toggle="modal" data-bs-target="#configureClientModal" />
 				<button type="submit" class="col-xs-4 col-md-4 btn btn-info" value="<?php echo $index?>" name="connect"><?php echo _("Connect"); ?></button>
 			<?php } else { ?>
-				<input type="submit" class="col-xs-4 col-md-4 btn btn-info" value="<?php echo _("Add"); ?>" id="update<?php echo $index ?>" name="update<?php echo $index ?>" data-toggle="modal" data-target="#configureClientModal" />
+				<input type="submit" class="col-xs-4 col-md-4 btn btn-info" value="<?php echo _("Add"); ?>" id="update<?php echo $index ?>" name="update<?php echo $index ?>" data-bs-toggle="modal" data-bs-target="#configureClientModal" />
 			<?php } ?>
-			<input type="submit" class="col-xs-4 col-md-4 btn btn-danger" value="<?php echo _("Delete"); ?>" name="delete<?php echo $index ?>"<?php echo ($network['configured'] ? '' : ' disabled')?> data-toggle="modal" data-target="#configureClientModal" />
+			<input type="submit" class="col-xs-4 col-md-4 btn btn-danger" value="<?php echo _("Delete"); ?>" name="delete<?php echo $index ?>"<?php echo ($network['configured'] ? '' : ' disabled')?> data-bs-toggle="modal" data-bs-target="#configureClientModal" />
 		</div><!-- /.btn-group -->
 	</div><!-- /.card-body -->
 </div><!-- /.card -->
diff --git a/templates/wireguard.php b/templates/wireguard.php
index 330d0ba5..83669f7d 100755
--- a/templates/wireguard.php
+++ b/templates/wireguard.php
@@ -15,10 +15,10 @@
         <div class="card-header">
           <div class="row">
             <div class="col">
-              <span class="ra-wireguard mr-2"></span><?php echo _("WireGuard"); ?>
+              <span class="ra-wireguard me-2"></span><?php echo _("WireGuard"); ?>
             </div>
             <div class="col">
-              <button class="btn btn-light btn-icon-split btn-sm service-status float-right">
+              <button class="btn btn-light btn-icon-split btn-sm service-status float-end">
                 <span class="icon text-gray-600"><i class="fas fa-circle service-status-<?php echo $serviceStatus ?>"></i></span>
                 <span class="text service-status">wg <?php echo _($serviceStatus) ?></span>
               </button>
@@ -31,9 +31,9 @@
             <?php echo CSRFTokenFieldTag() ?>
             <!-- Nav tabs -->
             <ul class="nav nav-tabs">
-                <li class="nav-item"><a class="nav-link active" id="settingstab" href="#wgsettings" data-toggle="tab"><?php echo _("Settings"); ?></a></li>
-                <li class="nav-item"><a class="nav-link" id="peertab" href="#wgpeers" data-toggle="tab"><?php echo _("Peer"); ?></a></li>
-                <li class="nav-item"><a class="nav-link" id="loggingtab" href="#wglogging" data-toggle="tab"><?php echo _("Logging"); ?></a></li>
+                <li class="nav-item"><a class="nav-link active" id="settingstab" href="#wgsettings" data-bs-toggle="tab"><?php echo _("Settings"); ?></a></li>
+                <li class="nav-item"><a class="nav-link" id="peertab" href="#wgpeers" data-bs-toggle="tab"><?php echo _("Peer"); ?></a></li>
+                <li class="nav-item"><a class="nav-link" id="loggingtab" href="#wglogging" data-bs-toggle="tab"><?php echo _("Logging"); ?></a></li>
             </ul>
 
             <!-- Tab panes -->