From c1da509053ede92cd7c8db11b2a0d90ad4cce376 Mon Sep 17 00:00:00 2001
From: glaszig <glaszig@gmail.com>
Date: Wed, 7 Aug 2019 23:16:56 +0200
Subject: [PATCH 1/2] remove superfluous, overly nested html (mainly bootstrap
 panels)

---
 includes/about.php            |  23 ++-----
 includes/configure_client.php |   2 +-
 includes/data_usage.php       | 126 ++++++++++++++++------------------
 includes/dhcp.php             |   4 +-
 includes/system.php           |   9 +--
 includes/themes.php           |  32 ++++-----
 6 files changed, 85 insertions(+), 111 deletions(-)

diff --git a/includes/about.php b/includes/about.php
index 8e085994..33e7ee7d 100755
--- a/includes/about.php
+++ b/includes/about.php
@@ -14,24 +14,15 @@ function DisplayAbout()
   <div class="col-lg-12">
   <div class="panel panel-primary">
   <div class="panel-heading"><i class="fa fa-info-circle fa-fw"></i> <?php echo _("About RaspAP"); ?></div>
-  <div class="panel-body">
+  <div class="panel-body text-center">
 
-    <div class="panel panel-default">
-    <div class="panel-body">
-      <div class="row">
-        <div class="col-lg-6" style="text-align: center">
-          <h3><?php echo _("RaspAP") . " v" . RASPI_VERSION; ?></h3>
-          <h5><a href="https://github.com/billz/raspap-webgui/blob/master/LICENSE">GNU General Public License v3.0</a></h5>
-          <p><img src="img/authors-8bit-200px.png"></p>
-          <p>RaspAP is a co-creation of <a href="https://github.com/billz">@billz</a> and <a href="https://github.com/sirlagz">@SirLagz</a><br />
-          with the contributions of our <a href="https://github.com/billz/raspap-webgui/graphs/contributors">community</a>.</p>
-          <p><i class="fa fa-github fa-fw"></i> <a href="https://github.com/billz/raspap-webgui">https://github.com/billz/raspap-webgui</a></p>
-       </div><!-- /.col-lg-6 -->
-      </div><!-- /.row -->
+    <h3><?php echo _("RaspAP") . " v" . RASPI_VERSION; ?></h3>
+    <h5><a href="https://github.com/billz/raspap-webgui/blob/master/LICENSE">GNU General Public License v3.0</a></h5>
+    <p><img src="img/authors-8bit-200px.png"></p>
+    <p>RaspAP is a co-creation of <a href="https://github.com/billz">@billz</a> and <a href="https://github.com/sirlagz">@SirLagz</a><br />
+    with the contributions of our <a href="https://github.com/billz/raspap-webgui/graphs/contributors">community</a>.</p>
+    <p><i class="fa fa-github fa-fw"></i> <a href="https://github.com/billz/raspap-webgui">https://github.com/billz/raspap-webgui</a></p>
 
-    </div><!-- ./panel-body-->
-    </div><!-- /.panel-default -->
-  
   </div><!-- /.panel-body -->
   <div class="panel-footer"></div>
   </div><!-- /.panel-primary -->
diff --git a/includes/configure_client.php b/includes/configure_client.php
index 1253de82..82359d42 100755
--- a/includes/configure_client.php
+++ b/includes/configure_client.php
@@ -181,7 +181,7 @@ function DisplayWPAConfig()
               <a href=".?<?php echo htmlspecialchars($_SERVER['QUERY_STRING'], ENT_QUOTES); ?>" style="padding:10px;float: right;display: block;position: relative;margin-top: -55px;" class="col-md-2 btn btn-info" id="update"><?php echo _("Rescan"); ?></a>
             </div> 
 
-            <form method="POST" action="?page=wpa_conf" name="wpa_conf_form">
+            <form method="POST" action="?page=wpa_conf" name="wpa_conf_form" class="row">
                 <?php echo CSRFTokenFieldTag() ?>
               <input type="hidden" name="client_settings" ?>
               <script>
diff --git a/includes/data_usage.php b/includes/data_usage.php
index a6d0ae8c..5f34e38b 100755
--- a/includes/data_usage.php
+++ b/includes/data_usage.php
@@ -12,83 +12,79 @@ function DisplayDataUsage(&$extraFooterScripts)
       <div class="panel panel-primary">
         <div class="panel-heading"><i class="fa fa-bar-chart fa-fw"></i> <?php echo _("Data usage monitoring"); ?></div>
           <div class="panel-body">
-            <div class="row">
-              <div class="col-md-12">
-                <div class="panel panel-default">
-                  <div class="panel-body">
-                    <ul id="tabbarBandwidth" class="nav nav-tabs" role="tablist">
-                      <li role="presentation" class="active"><a href="#hourly" aria-controls="hourly" role="tab" data-toggle="tab"><?php echo _("Hourly"); ?></a></li>
-                      <li role="presentation" class=""><a href="#daily" aria-controls="daily" role="tab" data-toggle="tab"><?php echo _("Daily"); ?></a></li>
-                      <li role="presentation" class=""><a href="#monthly" aria-controls="monthly" role="tab" data-toggle="tab"><?php echo _("Monthly"); ?></a></li>
-                    </ul>
-                    <div id="tabsBandwidth" class="tabcontenttraffic tab-content">
-                      <div role="tabpanel" class="tab-pane active fade in" id="hourly">
-                        <div class="row">
-                          <div class="col-lg-12">
-                            <h4><?php echo _('Hourly traffic amount'); ?></h4>
-                            <label for="cbxInterfacehourly"><?php echo _('interface'); ?></label> 
-                            <select id="cbxInterfacehourly" class="form-control" name="interfacehourly">
+
+            <ul id="tabbarBandwidth" class="nav nav-tabs" role="tablist">
+              <li role="presentation" class="active"><a href="#hourly" aria-controls="hourly" role="tab" data-toggle="tab"><?php echo _("Hourly"); ?></a></li>
+              <li role="presentation" class=""><a href="#daily" aria-controls="daily" role="tab" data-toggle="tab"><?php echo _("Daily"); ?></a></li>
+              <li role="presentation" class=""><a href="#monthly" aria-controls="monthly" role="tab" data-toggle="tab"><?php echo _("Monthly"); ?></a></li>
+            </ul>
+
+            <div id="tabsBandwidth" class="tabcontenttraffic tab-content">
+              <div role="tabpanel" class="tab-pane active fade in" id="hourly">
+                <div class="row">
+                  <div class="col-lg-12">
+                    <h4><?php echo _('Hourly traffic amount'); ?></h4>
+                    <label for="cbxInterfacehourly"><?php echo _('interface'); ?></label> 
+                    <select id="cbxInterfacehourly" class="form-control" name="interfacehourly">
 <?php
 foreach ($interfacesWlo as $interface) {
-    echo '                              <option value="' , htmlentities($interface, ENT_QUOTES) , '">' ,
-            htmlentities($interface, ENT_QUOTES) , '</option>' , PHP_EOL;
+echo '                              <option value="' , htmlentities($interface, ENT_QUOTES) , '">' ,
+    htmlentities($interface, ENT_QUOTES) , '</option>' , PHP_EOL;
 }
 ?>
-                            </select>
-                            <div class="hidden alert alert-info" id="divLoaderBandwidthhourly">
-                            <?php echo sprintf(_("Loading %s bandwidth chart"), _('hourly')); ?>
-                            </div>
-                            <div id="divChartBandwidthhourly"></div>
-                            <div id="divTableBandwidthhourly"></div>
-                          </div>
-                        </div>
-                      </div><!-- /.tab-pane -->
-                      <div role="tabpanel" class="tab-pane fade" id="daily">
-                        <div class="row">
-                          <div class="col-lg-12">
-                            <h4><?php echo _('Daily traffic amount'); ?></h4>
-                            <label for="cbxInterfacedaily"><?php echo _('interface'); ?></label> 
-                            <select id="cbxInterfacedaily" class="form-control" name="interfacedaily">
+                    </select>
+                    <div class="hidden alert alert-info" id="divLoaderBandwidthhourly">
+                    <?php echo sprintf(_("Loading %s bandwidth chart"), _('hourly')); ?>
+                    </div>
+                    <div id="divChartBandwidthhourly"></div>
+                    <div id="divTableBandwidthhourly"></div>
+                  </div>
+                </div>
+              </div><!-- /.tab-pane -->
+              <div role="tabpanel" class="tab-pane fade" id="daily">
+                <div class="row">
+                  <div class="col-lg-12">
+                    <h4><?php echo _('Daily traffic amount'); ?></h4>
+                    <label for="cbxInterfacedaily"><?php echo _('interface'); ?></label> 
+                    <select id="cbxInterfacedaily" class="form-control" name="interfacedaily">
 <?php
 foreach ($interfacesWlo as $interface) {
-    echo '                              <option value="' , htmlentities($interface, ENT_QUOTES) , '">' ,
-            htmlentities($interface, ENT_QUOTES) , '</option>' , PHP_EOL;
+echo '                              <option value="' , htmlentities($interface, ENT_QUOTES) , '">' ,
+    htmlentities($interface, ENT_QUOTES) , '</option>' , PHP_EOL;
 }
 ?>
-                            </select>
-                            <div class="hidden alert alert-info" id="divLoaderBandwidthdaily">
-                            <?php echo sprintf(_("Loading %s bandwidth chart"), _('daily')); ?>
-                            </div>
-                            <div id="divChartBandwidthdaily"></div>
-                            <div id="divTableBandwidthdaily"></div>
-                          </div>
-                        </div>
-                      </div><!-- /.tab-pane -->
-                      <div role="tabpanel" class="tab-pane fade" id="monthly">
-                        <div class="row">
-                          <div class="col-lg-12">
-                            <h4><?php echo _("Monthly traffic amount"); ?></h4>
-                            <label for="cbxInterfacemonthly"><?php echo _('interface'); ?></label> 
-                            <select id="cbxInterfacemonthly" class="form-control" name="interfacemonthly">
+                    </select>
+                    <div class="hidden alert alert-info" id="divLoaderBandwidthdaily">
+                    <?php echo sprintf(_("Loading %s bandwidth chart"), _('daily')); ?>
+                    </div>
+                    <div id="divChartBandwidthdaily"></div>
+                    <div id="divTableBandwidthdaily"></div>
+                  </div>
+                </div>
+              </div><!-- /.tab-pane -->
+              <div role="tabpanel" class="tab-pane fade" id="monthly">
+                <div class="row">
+                  <div class="col-lg-12">
+                    <h4><?php echo _("Monthly traffic amount"); ?></h4>
+                    <label for="cbxInterfacemonthly"><?php echo _('interface'); ?></label> 
+                    <select id="cbxInterfacemonthly" class="form-control" name="interfacemonthly">
 <?php
 foreach ($interfacesWlo as $interface) {
-    echo '                            <option value="' , htmlentities($interface, ENT_QUOTES) , '">' ,
-            htmlentities($interface, ENT_QUOTES) , '</option>' , PHP_EOL;
+echo '                            <option value="' , htmlentities($interface, ENT_QUOTES) , '">' ,
+    htmlentities($interface, ENT_QUOTES) , '</option>' , PHP_EOL;
 }
 ?>
-                            </select>
-                            <div class="hidden alert alert-info" id="divLoaderBandwidthmonthly">
-                            <?php echo sprintf(_("Loading %s bandwidth chart"), _('monthly')); ?>
-                            </div>
-                            <div id="divChartBandwidthmonthly"></div>
-                            <div id="divTableBandwidthmonthly"></div>
-                          </div>
-                        </div>
-                      </div><!-- /.tab-pane -->
-                    </div><!-- /.tabsBandwidth -->
-                  </div><!-- /.panel-default -->
-                </div><!-- /.col-md-6 -->
-              </div><!-- /.row -->
+                    </select>
+                    <div class="hidden alert alert-info" id="divLoaderBandwidthmonthly">
+                    <?php echo sprintf(_("Loading %s bandwidth chart"), _('monthly')); ?>
+                    </div>
+                    <div id="divChartBandwidthmonthly"></div>
+                    <div id="divTableBandwidthmonthly"></div>
+                  </div>
+                </div>
+              </div><!-- /.tab-pane -->
+            </div><!-- /.tabsBandwidth -->
+
            </div><!-- /.panel-body -->
          </div><!-- /.panel-primary -->
        <div class="panel-footer"><?php echo _("Information provided by vnstat"); ?></div>
diff --git a/includes/dhcp.php b/includes/dhcp.php
index 57c02d8b..8eeb4051 100755
--- a/includes/dhcp.php
+++ b/includes/dhcp.php
@@ -221,6 +221,7 @@ foreach ($interfaces as $inet) {
 
     <div class="tab-pane fade in" id="client-list">
     <h4>Client list</h4>
+    <div class="row">
     <div class="col-lg-12">
       <div class="panel panel-default">
       <div class="panel-heading"><?php echo _("Active DHCP leases"); ?></div>
@@ -254,7 +255,8 @@ foreach ($leases as $lease) {
         </div><!-- /.table-responsive -->
       </div><!-- /.panel-body -->
       </div><!-- /.panel -->
-    </div><!-- /.col-lg-6 -->
+    </div><!-- /.col-lg-12 -->
+    </div><!-- /.row -->
     </div><!-- /.tab-pane -->
 
     <div class="tab-pane fade in" id="static-leases">
diff --git a/includes/system.php b/includes/system.php
index 617efba6..069151b9 100755
--- a/includes/system.php
+++ b/includes/system.php
@@ -152,10 +152,6 @@ if (isset($_POST['system_shutdown'])) {
 }
 ?>
 
-  <div class="row">
-  <div class="col-md-12">
-  <div class="panel panel-default">
-  <div class="panel-body">
   <p><?php $status->showMessages(); ?></p>
   <form role="form" action="?page=system_info" method="POST">
   <ul class="nav nav-tabs" role="tablist">
@@ -219,11 +215,8 @@ if (isset($_POST['system_shutdown'])) {
       </div>
     </div>
 
-    </div><!-- /.systemtabcontent -->
+  </div><!-- /.systemtabcontent -->
 
-    </div><!-- /.panel-default -->
-    </div><!-- /.col-md-6 -->
-    </div><!-- /.row -->
   </div><!-- /.panel-body -->
   </form>
   </div><!-- /.panel-primary -->
diff --git a/includes/themes.php b/includes/themes.php
index dac35e18..b0d43788 100755
--- a/includes/themes.php
+++ b/includes/themes.php
@@ -28,27 +28,19 @@ function DisplayThemeConfig()
   <div class="panel panel-primary">
   <div class="panel-heading"><i class="fa fa-wrench fa-fw"></i> <?php echo _("Change Theme"); ?></div>
   <div class="panel-body">
+
+    <h4><?php echo _("Theme settings"); ?></h4>
+
     <div class="row">
-    <div class="col-md-6">
-    <div class="panel panel-default">
-    <div class="panel-body">
-      <h4><?php echo _("Theme settings"); ?></h4>
-
-  <div class="row">
-          <div class="form-group col-md-6">
-            <label for="code"><?php echo _("Select a theme"); ?></label>  
-              <select class="form-control" id="theme-select"><?php echo _("Select a Theme"); ?>
-                <option value="default" class="theme-link"<?php echo $cselected; ?>>RaspAP (default)</option>
-                <option value="hackernews" class="theme-link"<?php echo $hselected; ?>>HackerNews</option>
-                <option value="terminal" class="theme-link"<?php echo $tselected; ?>>Terminal</option>
-              </select>
-          </div>
-        </div>
-
-    </div><!-- /.panel-body -->
-    </div><!-- /.panel-default -->
-    </div><!-- /.col-md-6 -->
-    </div><!-- /.row -->
+      <div class="form-group col-md-6">
+        <label for="code"><?php echo _("Select a theme"); ?></label>
+          <select class="form-control" id="theme-select"><?php echo _("Select a Theme"); ?>
+            <option value="default" class="theme-link"<?php echo $cselected; ?>>RaspAP (default)</option>
+            <option value="hackernews" class="theme-link"<?php echo $hselected; ?>>HackerNews</option>
+            <option value="terminal" class="theme-link"<?php echo $tselected; ?>>Terminal</option>
+          </select>
+      </div>
+    </div>
 
     <form action="?page=system_info" method="POST">
       <input type="button" class="btn btn-outline btn-primary" value="<?php echo _("Refresh"); ?>" onclick="document.location.reload(true)" />

From 916072f7fd654e950faaff59f5805485680bad17 Mon Sep 17 00:00:00 2001
From: glaszig <glaszig@gmail.com>
Date: Fri, 9 Aug 2019 16:21:58 +0200
Subject: [PATCH 2/2] bootstrap panel-footer goes directly after panel-body

https://getbootstrap.com/docs/3.3/components/#panels-footer
---
 includes/data_usage.php | 4 ++--
 includes/system.php     | 3 +--
 2 files changed, 3 insertions(+), 4 deletions(-)

diff --git a/includes/data_usage.php b/includes/data_usage.php
index 5f34e38b..1eb40717 100755
--- a/includes/data_usage.php
+++ b/includes/data_usage.php
@@ -86,8 +86,8 @@ echo '                            <option value="' , htmlentities($interface, EN
             </div><!-- /.tabsBandwidth -->
 
            </div><!-- /.panel-body -->
-         </div><!-- /.panel-primary -->
-       <div class="panel-footer"><?php echo _("Information provided by vnstat"); ?></div>
+         <div class="panel-footer"><?php echo _("Information provided by vnstat"); ?></div>
+       </div><!-- /.panel-primary -->
       </div><!-- /.panel-primary -->
     </div><!-- /.col-lg-12 -->
   </div><!-- /.row -->
diff --git a/includes/system.php b/includes/system.php
index 069151b9..f5c71440 100755
--- a/includes/system.php
+++ b/includes/system.php
@@ -217,9 +217,8 @@ if (isset($_POST['system_shutdown'])) {
 
   </div><!-- /.systemtabcontent -->
 
-  </div><!-- /.panel-body -->
   </form>
-  </div><!-- /.panel-primary -->
+  </div><!-- /.panel-body -->
   <div class="panel-footer"></div>
   </div><!-- /.panel-primary -->
   </div><!-- /.col-lg-12 -->