Remove more tables from forms (#2991)

web/css/src/themes/default.css

@@ -2862,7 +2862,7 @@ a.button.cancel {
 .page-title {
   font-size: 1.4rem !important;
   font-weight: 500 !important;
-  padding-bottom: 10px !important;
+  padding-bottom: 20px !important;
   letter-spacing: -0.01em;
 }
 
@@ -3830,6 +3830,10 @@ li[aria-expanded="true"] a {
   clear: both;
 }
 
+.u-block {
+  display: block !important;
+}
+
 .u-hidden {
   display: none !important;
 }
@@ -3902,6 +3906,10 @@ li[aria-expanded="true"] a {
   width: 380px !important;
 }
 
+.u-wide-input-width {
+  width: 600px !important;
+}
+
 .u-min-height100 {
   min-height: 100px !important;
 }

web/inc/main.php

@@ -217,24 +217,19 @@ function verify_csrf($method, $return = false)
     }
 }
 
-function show_error_panel($data)
-{
-    $msg_id = '';
-    $msg_icon = '';
-    $msg_text = '';
-    if (!empty($data['error_msg'])) {
-        $msg_icon = 'fa-exclamation-circle status-icon red';
-        $msg_text = htmlentities($data['error_msg']);
-        $msg_id = 'vst-error';
-    } else {
-        if (!empty($data['ok_msg'])) {
+function show_alert_message($data) {
+    if (!empty($data['error_msg']) || !empty($data['ok_msg'])) {
+        if (!empty($data['error_msg'])) {
+            $msg_icon = 'fa-exclamation-circle status-icon red';
+            $msg_text = htmlentities($data['error_msg']);
+            $msg_id = 'vst-error';
+        } else {
             $msg_icon = 'fa-check-circle status-icon green';
             $msg_text = $data['ok_msg'];
             $msg_id = 'vst-ok';
         }
-    } ?>
-<span class="<?=$msg_id; ?>"> <i class="fas <?=$msg_icon; ?>"></i> <?=$msg_text; ?></span>
-<?php
+        echo '<p class="'.$msg_id.' u-mb20"><i class="fas '.$msg_icon.'"></i> '.$msg_text.'</p>';
+    }
 }
 
 function top_panel($user, $TAB)

web/js/pages/edit_dns_rec.js

@@ -12,7 +12,7 @@ App.Actions.DB.update_dns_record_hint = function(elm, hint) {
         hint = '';
     }
 
-    // dont show pregix if domain name = rec value
+    // dont show prefix if domain name = rec value
     if (hint == GLOBAL.DNS_REC_PREFIX + '.') {
         hint = '';
     }

web/templates/pages/add_access_key.html

@@ -24,7 +24,7 @@
 
     <div class="app-form">
       <h1 class="page-title"><?= _('Adding Access Key'); ?></h1>
-      <?php show_error_panel($_SESSION);?>
+      <?php show_alert_message($_SESSION);?>
       <div class="u-input-width">
         <p class="u-mb10"><?= _('Permissions'); ?></p>
         <?php foreach ($apis as $api_name => $api_data) { ?>

web/templates/pages/add_cron.html

@@ -349,7 +349,7 @@
 						</tr>
 						<tr>
 							<td>
-								<?php show_error_panel($_SESSION);?>
+								<?php show_alert_message($_SESSION);?>
 							</td>
 						</tr>
 						<tr>

web/templates/pages/add_db.html

@@ -21,7 +21,7 @@
 
     <div class="app-form">
       <h1 class="page-title"><?=_('Adding database');?></h1>
-      <?php show_error_panel($_SESSION);?>
+      <?php show_alert_message($_SESSION);?>
       <div class="u-input-width">
         <?php if (($user_plain == 'admin') && (($_GET['accept'] !== "true"))) {?>
           <div class="alert alert-danger alert-with-icon" role="alert">
@@ -86,11 +86,11 @@
             </label>
             <input type="email" class="form-control" name="v_db_email" id="v_db_email" value="<?=htmlentities(trim($v_db_email, "'"))?>">
           </div>
-          <div class="u-mb10">
+          <div class="u-mb20">
             <a href="javascript:elementHideShow('advanced-opts');" class="vst-advanced"><?=_('Advanced options');?></a>
           </div>
           <div id="advanced-opts" style="display: none;">
-            <div class="u-mt15 u-mb10">
+            <div class="u-mb10">
               <label for="v_host" class="form-label"><?=_('Host');?></label>
               <select class="form-select u-mb20" name="v_host" id="v_host">
                 <?php

web/templates/pages/add_dns.html

@@ -37,7 +37,7 @@
 						</tr>
 						<tr>
 							<td>
-								<?php show_error_panel($_SESSION);?>
+								<?php show_alert_message($_SESSION);?>
 							</td>
 						</tr>
 						<?php if (($user_plain == 'admin') && (($_GET['accept'] !== "true"))) {?>
@@ -110,7 +110,7 @@
 							</tr>
 							<tr>
 								<td class="u-pt18">
-									<table style="display:<?php if (empty($v_adv)) echo 'none';?> ;" id="advtable">
+									<table id="advtable" style="display:<?php if (empty($v_adv)) echo 'none';?> ;">
 										<tr>
 											<td class="u-pt6">
 												<div class="form-check">

web/templates/pages/add_dns_rec.html

@@ -21,7 +21,7 @@
 
     <div class="app-form">
       <h1 class="page-title"><?=_('Adding DNS Record');?></h1>
-      <?php show_error_panel($_SESSION);?>
+      <?php show_alert_message($_SESSION);?>
       <div class="u-input-width">
         <div class="u-mb10">
           <label for="v_domain" class="form-label"><?=_('Domain');?></label>

web/templates/pages/add_firewall.html

@@ -21,7 +21,7 @@
 
     <div class="app-form">
       <h1 class="page-title"><?=_('Adding Firewall Rule');?></h1>
-      <?php show_error_panel($_SESSION);?>
+      <?php show_alert_message($_SESSION);?>
       <div class="u-input-width">
         <div class="u-mb10">
           <label for="v_action" class="form-label"><?=_('Action') ?></label>
@@ -69,8 +69,8 @@
 </div>
 
 <script>
-  var iplists = JSON.parse('<?=$ipset_lists_json?>');
-  iplists.sort(function (a, b) {
+  var ipLists = JSON.parse('<?=$ipset_lists_json?>');
+  ipLists.sort(function (a, b) {
     return a.name > b.name;
   });
 
@@ -82,7 +82,7 @@
     newEl.disabled = true;
     targetElement.appendChild(newEl);
 
-    iplists.forEach(iplist => {
+    ipLists.forEach(iplist => {
       var newEl = document.createElement("option");
       newEl.text = iplist.name;
       newEl.value = "ipset:" + iplist.name;

web/templates/pages/add_firewall_banlist.html

@@ -21,7 +21,7 @@
 
     <div class="app-form">
       <h1 class="page-title"><?=_('Adding IP Address to Banlist');?></h1>
-      <?php show_error_panel($_SESSION);?>
+      <?php show_alert_message($_SESSION);?>
       <div class="u-input-width">
         <div class="u-mb20">
           <label for="v_ip" class="form-label">

web/templates/pages/add_firewall_ipset.html

@@ -21,7 +21,7 @@
 
     <div class="app-form">
       <h1 class="page-title"><?=_('Adding Firewall Ipset List');?></h1>
-      <?php show_error_panel($_SESSION);?>
+      <?php show_alert_message($_SESSION);?>
       <div class="u-input-width">
         <div class="u-mb10">
           <label for="v_ipname" class="form-label"><?=_('Ip List Name') ?></label>

web/templates/pages/add_ip.html

@@ -21,7 +21,7 @@
 
     <div class="app-form">
       <h1 class="page-title"><?=_('Adding IP address');?></h1>
-      <?php show_error_panel($_SESSION);?>
+      <?php show_alert_message($_SESSION);?>
       <div class="u-input-width">
         <div class="u-mb10">
           <label for="v_ip" class="form-label"><?=_('IP address') ?></label>

web/templates/pages/add_key.html

@@ -25,8 +25,8 @@
 
     <div class="app-form">
       <h1 class="page-title"><?=_('Add SSH Key');?></h1>
-      <?php show_error_panel($_SESSION);?>
-      <div style="max-width: 600px;">
+      <?php show_alert_message($_SESSION);?>
+      <div class="u-wide-input-width">
         <label for="v_key" class="form-label"><?=_('SSH KEY') ?></label>
         <textarea class="form-control u-min-height100" name="v_key" id="v_key"><?=htmlentities(trim($v_key, "'"))?></textarea>
       </div>

web/templates/pages/add_mail.html

@@ -21,7 +21,7 @@
 
     <div class="app-form">
       <h1 class="page-title"><?=_('Adding Mail Domain');?></h1>
-      <?php show_error_panel($_SESSION);?>
+      <?php show_alert_message($_SESSION);?>
       <div class="u-input-width">
         <?php if (($user_plain == 'admin') && (($_GET['accept'] !== "true"))) {?>
           <div class="alert alert-danger alert-with-icon" role="alert">
@@ -100,7 +100,7 @@
               </label>
             </div>
           </div>
-          <div class="u-pl50" style="display:<?php if ($v_smtp_relay == 'true'){echo 'block';} else {echo 'none';} ?>;" id="smtp_relay_table">
+          <div id="smtp_relay_table" class="u-pl50" style="display:<?php if ($v_smtp_relay == 'true'){echo 'block';} else {echo 'none';} ?>;">
             <div class="u-mb10">
               <label for="v_smtp_relay_host" class="form-label"><?=_('Host');?></label>
               <input type="text" class="form-control" name="v_smtp_relay_host" id="v_smtp_relay_host" value="<?=htmlentities(trim($v_smtp_relay_host, "'"))?>">

web/templates/pages/add_mail_acc.html

@@ -21,7 +21,7 @@
 
     <div class="app-form">
       <h1 class="page-title"><?=_('Adding Mail Account');?></h1>
-      <?php show_error_panel($_SESSION);?>
+      <?php show_alert_message($_SESSION);?>
       <div style="display: flex; justify-content: space-between;">
         <div class="u-input-width">
           <div class="u-mb10">
@@ -53,7 +53,7 @@
             <a href="javascript:elementHideShow('advtable');" class="vst-advanced"><?=_('Advanced options');?></a>
           </div>
           <div id="advtable" style="display:<?php if (empty($v_adv)) echo 'none';?> ;">
-            <div class="u-mt15 u-mb10">
+            <div class="u-mb10">
               <label for="v_quota" class="form-label">
                 <?=_('Quota');?> <span class="optional">(<?=_('in megabytes');?>)</span>
               </label>

web/templates/pages/add_package.html

@@ -37,7 +37,7 @@
 						</tr>
 						<tr>
 							<td>
-								<?php show_error_panel($_SESSION);?>
+								<?php show_alert_message($_SESSION);?>
 							</td>
 						</tr>
 						<tr>

web/templates/pages/add_user.html

@@ -21,7 +21,7 @@
 
     <div class="app-form">
       <h1 class="page-title"><?=_('Adding User');?></h1>
-      <?php show_error_panel($_SESSION);?>
+      <?php show_alert_message($_SESSION);?>
       <div class="u-input-width">
         <div class="u-mb10">
           <label for="v_username" class="form-label"><?=_('Username');?></label>

web/templates/pages/add_web.html

@@ -23,7 +23,7 @@
 
     <div class="app-form">
       <h1 class="page-title"><?=_('Add Web Domain');?></h1>
-      <?php show_error_panel($_SESSION);?>
+      <?php show_alert_message($_SESSION);?>
       <div class="u-input-width">
         <?php if (($user_plain == 'admin') && (($_GET['accept'] !== "true"))) {?>
           <div class="alert alert-danger alert-with-icon" role="alert">
@@ -56,13 +56,11 @@
           </div>
           <?php if ((isset($_SESSION['DNS_SYSTEM'])) && (!empty($_SESSION['DNS_SYSTEM']))) {?>
             <?php if($panel[$user_plain]['DNS_DOMAINS'] != "0") { ?>
-              <div class="u-mb10">
-                <div class="form-check">
-                  <input class="form-check-input" type="checkbox" name="v_dns" id="v_dns" <?php if (empty($v_dns)&&$panel[$user_plain]['DNS_DOMAINS'] != "0") ?>>
-                  <label for="v_dns">
-                    <?=_('DNS Support');?>
-                  </label>
-                </div>
+              <div class="form-check u-mb10">
+                <input class="form-check-input" type="checkbox" name="v_dns" id="v_dns" <?php if (empty($v_dns)&&$panel[$user_plain]['DNS_DOMAINS'] != "0") ?>>
+                <label for="v_dns">
+                  <?=_('DNS Support');?>
+                </label>
               </div>
             <?php } ?>
           <?php } ?>

web/templates/pages/edit_backup_exclusions.html

@@ -1,13 +1,13 @@
 <!-- Begin toolbar -->
 <div class="l-center edit">
-	<div class="l-sort clearfix">
-		<div class="l-unit-toolbar__buttonstrip">
-			<a class="ui-button cancel" dir="ltr" id="btn-back" href="/list/backup/exclusions/"><i class="fas fa-arrow-left status-icon blue"></i><?=_('Back');?></a>
-		</div>
-		<div class="l-unit-toolbar__buttonstrip float-right">
-			<a href="#" class="ui-button" data-action="submit" data-id="vstobjects"><i class="fas fa-save status-icon purple"></i><?=_('Save');?></a>
-		</div>
-	</div>
+  <div class="l-sort clearfix">
+    <div class="l-unit-toolbar__buttonstrip">
+      <a class="ui-button cancel" dir="ltr" id="btn-back" href="/list/backup/exclusions/"><i class="fas fa-arrow-left status-icon blue"></i><?=_('Back');?></a>
+    </div>
+    <div class="l-unit-toolbar__buttonstrip float-right">
+      <a href="#" class="ui-button" data-action="submit" data-id="vstobjects"><i class="fas fa-save status-icon purple"></i><?=_('Save');?></a>
+    </div>
+  </div>
 </div>
 <!-- End toolbar -->
 
@@ -15,59 +15,33 @@
 
 <div class="l-center edit animated fadeIn">
 
-	<form id="vstobjects" name="v_edit_backup_exclusions" method="post" class="<?=_($v_status)?>">
-		<input type="hidden" name="token" value="<?=$_SESSION['token']?>">
-		<input type="hidden" name="save" value="save">
+  <form id="vstobjects" name="v_edit_backup_exclusions" method="post" class="<?=_($v_status)?>">
+    <input type="hidden" name="token" value="<?=$_SESSION['token']?>">
+    <input type="hidden" name="save" value="save">
+
+    <div class="app-form">
+      <h1 class="page-title"><?=_('Editing Backup Exclusions');?></h1>
+      <?php show_alert_message($_SESSION);?>
+      <div class="u-wide-input-width">
+        <div class="u-mb10">
+          <label for="v_web" class="form-label"><?=_('Web Domains');?></label>
+          <textarea class="form-control" name="v_web" id="v_web" placeholder="<?=_('WEB_EXCLUSIONS') ?>"><?=htmlentities(trim($v_web, "'"))?></textarea>
+        </div>
+        <div class="u-mb10">
+          <label for="v_mail" class="form-label"><?=_('Mail Domains');?></label>
+          <textarea class="form-control" name="v_mail" id="v_mail" placeholder="<?=_('MAIL_EXCLUSIONS') ?>"><?=htmlentities(trim($v_mail, "'"))?></textarea>
+        </div>
+        <div class="u-mb10">
+          <label for="v_db" class="form-label"><?=_('Databases');?></label>
+          <textarea class="form-control" name="v_db" id="v_db" placeholder="<?=_('DB_EXCLUSIONS') ?>"><?=htmlentities(trim($v_db, "'"))?></textarea>
+        </div>
+        <div class="u-mb10">
+          <label for="v_userdir" class="form-label"><?=_('User Directories');?></label>
+          <textarea class="form-control" name="v_userdir" id="v_userdir" placeholder="<?=_('USER_EXCLUSIONS') ?>"><?=htmlentities(trim($v_userdir, "'"))?></textarea>
+        </div>
+      </div>
+    </div>
+
+  </form>
 
-		<table class="data">
-			<tr class="data-add">
-				<td class="data-dotted">
-					<table class="data-col1">
-						<tr>
-							<td></td>
-						</tr>
-					</table>
-				</td>
-				<td class="data-dotted">
-					<table class="data-col2" width="600px">
-						<tr>
-							<td class="u-pt18">
-								<span class="page-title"><?=_('Editing Backup Exclusions');?></span>
-							</td>
-						</tr>
-						<tr>
-							<td>
-								<?php show_error_panel($_SESSION);?>
-							</td>
-						</tr>
-						<tr>
-							<td class="u-pt18">
-								<label for="v_web" class="form-label"><?=_('Web Domains');?></label>
-								<textarea class="form-control" name="v_web" id="v_web" placeholder="<?=_('WEB_EXCLUSIONS') ?>"><?=htmlentities(trim($v_web, "'"))?></textarea>
-							</td>
-						</tr>
-						<tr>
-							<td class="u-pt6">
-								<label for="v_mail" class="form-label"><?=_('Mail Domains');?></label>
-								<textarea class="form-control" name="v_mail" id="v_mail" placeholder="<?=_('MAIL_EXCLUSIONS') ?>"><?=htmlentities(trim($v_mail, "'"))?></textarea>
-							</td>
-						</tr>
-						<tr>
-							<td class="u-pt6">
-								<label for="v_db" class="form-label"><?=_('Databases');?></label>
-								<textarea class="form-control" name="v_db" id="v_db" placeholder="<?=_('DB_EXCLUSIONS') ?>"><?=htmlentities(trim($v_db, "'"))?></textarea>
-							</td>
-						</tr>
-						<tr>
-							<td class="u-pt6">
-								<label for="v_userdir" class="form-label"><?=_('User Directories');?></label>
-								<textarea class="form-control" name="v_userdir" id="v_userdir" placeholder="<?=_('USER_EXCLUSIONS') ?>"><?=htmlentities(trim($v_userdir, "'"))?></textarea>
-							</td>
-						</tr>
-					</table>
-					<table class="data-col2"></table>
-				</td>
-			</tr>
-		</table>
-	</form>
 </div>

web/templates/pages/edit_cron.html

@@ -349,7 +349,7 @@
 						</tr>
 						<tr>
 							<td>
-								<?php show_error_panel($_SESSION);?>
+								<?php show_alert_message($_SESSION);?>
 							</td>
 						</tr>
 						<tr>

web/templates/pages/edit_db.html

@@ -21,11 +21,11 @@
 
     <div class="app-form">
       <h1 class="page-title"><?=_('Editing Database');?></h1>
-      <?php show_error_panel($_SESSION);?>
+      <?php show_alert_message($_SESSION);?>
       <div class="u-input-width">
         <div class="u-mb10">
           <label for="v_database" class="form-label"><?=_('Database');?></label>
-          <input type="text" class="form-control u-input-width" name="v_database" id="v_database" value="<?=htmlentities(trim($v_database, "'"))?>" disabled>
+          <input type="text" class="form-control" name="v_database" id="v_database" value="<?=htmlentities(trim($v_database, "'"))?>" disabled>
           <small class="hint"></small>
         </div>
         <div class="u-mb10">
@@ -33,7 +33,7 @@
             <?=_('Username');?>
             &nbsp;&nbsp;&nbsp;&nbsp;<em><small>(<?=sprintf(_('maximum characters length, including prefix'), 32);?>)</small></em>
           </label>
-          <input type="text" class="form-control u-input-width" name="v_dbuser" id="v_dbuser" value="<?=htmlentities(trim($v_dbuser, "'"))?>">
+          <input type="text" class="form-control" name="v_dbuser" id="v_dbuser" value="<?=htmlentities(trim($v_dbuser, "'"))?>">
           <small class="hint"></small>
         </div>
         <div class="u-mb10">
@@ -54,15 +54,15 @@
         </ul>
         <div class="u-mb10">
           <label for="v_type" class="form-label"><?=_('Type');?></label>
-          <input type="text" class="form-control u-input-width" name="v_type" id="v_type" value="<?=htmlentities(trim($v_type, "'"))?>" disabled>
+          <input type="text" class="form-control" name="v_type" id="v_type" value="<?=htmlentities(trim($v_type, "'"))?>" disabled>
         </div>
         <div class="u-mb10">
           <label for="v_host" class="form-label"><?=_('Host');?></label>
-          <input type="text" class="form-control u-input-width" name="v_host" id="v_host" value="<?=htmlentities(trim($v_host, "'"))?>" disabled>
+          <input type="text" class="form-control" name="v_host" id="v_host" value="<?=htmlentities(trim($v_host, "'"))?>" disabled>
         </div>
         <div class="u-mb10">
           <label for="v_charset" class="form-label"><?=_('Charset');?></label>
-          <input type="text" class="form-control u-input-width" name="v_charset" id="v_charset" value="<?=htmlentities(trim($v_charset, "'"))?>" disabled>
+          <input type="text" class="form-control" name="v_charset" id="v_charset" value="<?=htmlentities(trim($v_charset, "'"))?>" disabled>
         </div>
       </div>
     </div>

web/templates/pages/edit_dns.html

@@ -1,13 +1,13 @@
 <!-- Begin toolbar -->
 <div class="l-center edit">
-	<div class="l-sort clearfix">
-		<div class="l-unit-toolbar__buttonstrip">
-			<a class="ui-button cancel" dir="ltr" id="btn-back" href="/list/dns/"><i class="fas fa-arrow-left status-icon blue"></i><?=_('Back');?></a>
-		</div>
-		<div class="l-unit-toolbar__buttonstrip float-right">
-			<a href="#" class="ui-button" data-action="submit" data-id="vstobjects"><i class="fas fa-save status-icon purple"></i><?=_('Save');?></a>
-		</div>
-	</div>
+  <div class="l-sort clearfix">
+    <div class="l-unit-toolbar__buttonstrip">
+      <a class="ui-button cancel" dir="ltr" id="btn-back" href="/list/dns/"><i class="fas fa-arrow-left status-icon blue"></i><?=_('Back');?></a>
+    </div>
+    <div class="l-unit-toolbar__buttonstrip float-right">
+      <a href="#" class="ui-button" data-action="submit" data-id="vstobjects"><i class="fas fa-save status-icon purple"></i><?=_('Save');?></a>
+    </div>
+  </div>
 </div>
 <!-- End toolbar -->
 
@@ -15,111 +15,79 @@
 
 <div class="l-center animated fadeIn">
 
-	<form id="vstobjects" name="v_edit_dns" method="post" class="<?=$v_status?>">
-		<input type="hidden" name="token" value="<?=$_SESSION['token']?>">
-		<input type="hidden" name="save" value="save">
+  <form id="vstobjects" name="v_edit_dns" method="post" class="<?=$v_status?>">
+    <input type="hidden" name="token" value="<?=$_SESSION['token']?>">
+    <input type="hidden" name="save" value="save">
+
+    <div class="app-form">
+      <h1 class="page-title"><?=_('Editing DNS Domain');?></h1>
+      <?php show_alert_message($_SESSION);?>
+      <div class="u-input-width">
+        <div class="u-mb10">
+          <label for="v_domain" class="form-label"><?=_('Domain');?></label>
+          <input type="text" class="form-control" name="v_domain" id="v_domain" value="<?=htmlentities(trim($v_domain, "'"))?>" disabled>
+          <input type="hidden" name="v_domain" value="<?=htmlentities(trim($v_domain, "'"))?>">
+        </div>
+        <div class="u-mb10">
+          <label for="v_ip" class="form-label"><?=_('IP address');?></label>
+          <div class="u-pos-relative">
+            <select class="form-select" tabindex="-1" onchange="this.nextElementSibling.value=this.value">
+              <option value="">clear</option>
+              <?php
+                foreach ($v_ips as $ip => $value) {
+                  $display_ip = empty($value['NAT']) ? $ip : "{$value['NAT']}";
+                  $ip_selected = ((!empty($v_ip) && ($v_ip==$ip||$v_ip==$display_ip) ))? 'selected' : '';
+                  echo "<option value='{$display_ip}' {$ip_selected}>" . htmlentities($display_ip) . "</option>\n";
+                }
+              ?>
+            </select>
+            <input type="text" class="form-control list-editor" name="v_ip" id="v_ip" value="<?=htmlentities(trim($v_ip, "'"))?>">
+          </div>
+        </div>
+        <?php if (($_SESSION['userContext'] === 'admin') || ($_SESSION['userContext'] === 'user') && ($_SESSION['POLICY_USER_EDIT_DNS_TEMPLATES'] === 'yes')) { ?>
+          <div class="u-mb10">
+            <label for="v_template" class="form-label">
+              <?=_('Template') . "<span class='optional'>" . strtoupper($_SESSION['DNS_SYSTEM']) . "</span>";?>
+            </label>
+            <select class="form-select" name="v_template" id="v_template">
+              <?php
+                foreach ($templates as $key => $value) {
+                  echo "\t\t\t\t<option value=\"".htmlentities($value)."\"";
+                  $svalue = "'".$value."'";
+                  if ((!empty($v_template)) && ( $value == $v_template ) || ($svalue == $v_template)){
+                    echo ' selected' ;
+                  }
+                  echo ">".htmlentities($value)."</option>\n";
+                }
+              ?>
+            </select>
+          </div>
+        <?php } ?>
+        <div class="u-mb10">
+          <div class="form-check">
+            <input class="form-check-input" type="checkbox" name="v_dnssec" id="v_dnssec" value="yes" <?php if($v_dnssec === 'yes'){ echo ' checked'; } ?>>
+            <label for="v_dnssec">
+              <?=_('Enable DNSEC');?>
+            </label>
+          </div>
+        </div>
+        <div class="u-mb10">
+          <label for="v_exp" class="form-label">
+            <?=_('Expiration Date');?><span class="optional">(<?=_('YYYY-MM-DD');?>)</span>
+          </label>
+          <input type="text" class="form-control" name="v_exp" id="v_exp" value="<?=htmlentities(trim($v_exp, "'"))?>">
+        </div>
+        <div class="u-mb10">
+          <label for="v_soa" class="form-label"><?=_('SOA');?></label>
+          <input type="text" class="form-control" name="v_soa" id="v_soa" value="<?=htmlentities(trim($v_soa, "'"))?>">
+        </div>
+        <div class="u-mb10">
+          <label for="v_ttl" class="form-label"><?=_('TTL');?></label>
+          <input type="text" class="form-control" name="v_ttl" id="v_ttl" value="<?=htmlentities(trim($v_ttl, "'"))?>">
+        </div>
+      </div>
+    </div>
+
+  </form>
 
-		<table class="data">
-			<tr class="data-add">
-				<td class="data-dotted">
-					<table class="data-col1">
-						<tr>
-							<td></td>
-						</tr>
-					</table>
-				</td>
-				<td class="data-dotted">
-					<table class="data-col2">
-						<tr>
-							<td class="u-pt18">
-								<span class="page-title"><?=_('Editing DNS Domain');?></span>
-							</td>
-						</tr>
-						<tr>
-							<td>
-								<?php show_error_panel($_SESSION);?>
-							</td>
-						</tr>
-						<tr>
-							<td class="u-pt18">
-								<label for="v_domain" class="form-label"><?=_('Domain');?></label>
-								<input type="text" class="form-control u-input-width" name="v_domain" id="v_domain" value="<?=htmlentities(trim($v_domain, "'"))?>" disabled>
-								<input type="hidden" name="v_domain" value="<?=htmlentities(trim($v_domain, "'"))?>">
-							</td>
-						</tr>
-						<tr>
-							<td class="u-pt6">
-								<label for="v_ip" class="form-label"><?=_('IP address');?></label>
-								<div class="u-pos-relative">
-									<select class="form-select" tabindex="-1" onchange="this.nextElementSibling.value=this.value">
-										<option value="">clear</option>
-										<?php
-											foreach ($v_ips as $ip => $value) {
-												$display_ip = empty($value['NAT']) ? $ip : "{$value['NAT']}";
-												$ip_selected = ((!empty($v_ip) && ($v_ip==$ip||$v_ip==$display_ip) ))? 'selected' : '';
-												echo "<option value='{$display_ip}' {$ip_selected}>" . htmlentities($display_ip) . "</option>\n";
-											}
-										?>
-									</select>
-									<input type="text" class="form-control list-editor" name="v_ip" id="v_ip" value="<?=htmlentities(trim($v_ip, "'"))?>">
-								</div>
-							</td>
-						</tr>
-						<?php if (($_SESSION['userContext'] === 'admin') || ($_SESSION['userContext'] === 'user') && ($_SESSION['POLICY_USER_EDIT_DNS_TEMPLATES'] === 'yes')) { ?>
-							<tr>
-								<td class="u-pt6">
-									<label for="v_template" class="form-label">
-										<?=_('Template') . "<span class='optional'>" . strtoupper($_SESSION['DNS_SYSTEM']) . "</span>";?>
-									</label>
-									<select class="form-select u-input-width" name="v_template" id="v_template">
-										<?php
-											foreach ($templates as $key => $value) {
-												echo "\t\t\t\t<option value=\"".htmlentities($value)."\"";
-												$svalue = "'".$value."'";
-												if ((!empty($v_template)) && ( $value == $v_template ) || ($svalue == $v_template)){
-													echo ' selected' ;
-												}
-												echo ">".htmlentities($value)."</option>\n";
-											}
-										?>
-									</select>
-								</td>
-							</tr>
-						<?php } ?>
-						<tr>
-							<td class="u-pt6">
-								<div class="form-check">
-									<input class="form-check-input" type="checkbox" name="v_dnssec" id="v_dnssec" value="yes" <?php if($v_dnssec === 'yes'){ echo ' checked'; } ?>>
-									<label for="v_dnssec">
-										<?=_('Enable DNSEC');?>
-									</label>
-								</div>
-							</td>
-						</tr>
-						<tr>
-							<td class="u-pt6">
-								<label for="v_exp" class="form-label">
-									<?=_('Expiration Date');?><span class="optional">(<?=_('YYYY-MM-DD');?>)</span>
-								</label>
-								<input type="text" class="form-control u-input-width" name="v_exp" id="v_exp" value="<?=htmlentities(trim($v_exp, "'"))?>">
-							</td>
-						</tr>
-						<tr>
-							<td class="u-pt6">
-								<label for="v_soa" class="form-label"><?=_('SOA');?></label>
-								<input type="text" class="form-control u-input-width" name="v_soa" id="v_soa" value="<?=htmlentities(trim($v_soa, "'"))?>">
-							</td>
-						</tr>
-						<tr>
-							<td class="u-pt6">
-								<label for="v_ttl" class="form-label"><?=_('TTL');?></label>
-								<input type="text" class="form-control u-input-width" name="v_ttl" id="v_ttl" value="<?=htmlentities(trim($v_ttl, "'"))?>">
-							</td>
-						</tr>
-					</table>
-					<table class="data-col2"></table>
-				</td>
-			</tr>
-		</table>
-	</form>
 </div>

web/templates/pages/edit_dns_rec.html

@@ -1,13 +1,13 @@
 <!-- Begin toolbar -->
 <div class="l-center edit">
-	<div class="l-sort clearfix">
-		<div class="l-unit-toolbar__buttonstrip">
-			<a class="ui-button cancel" dir="ltr" id="btn-back" href="/list/dns/?domain=<?=htmlentities(trim($v_domain, "'"))?>&token=<?=$_SESSION['token']?>"><i class="fas fa-arrow-left status-icon blue"></i><?=_('Back');?></a>
-		</div>
-		<div class="l-unit-toolbar__buttonstrip float-right">
-			<a href="#" class="ui-button" data-action="submit" data-id="vstobjects"><i class="fas fa-save status-icon purple"></i><?=_('Save');?></a>
-		</div>
-	</div>
+  <div class="l-sort clearfix">
+    <div class="l-unit-toolbar__buttonstrip">
+      <a class="ui-button cancel" dir="ltr" id="btn-back" href="/list/dns/?domain=<?=htmlentities(trim($v_domain, "'"))?>&token=<?=$_SESSION['token']?>"><i class="fas fa-arrow-left status-icon blue"></i><?=_('Back');?></a>
+    </div>
+    <div class="l-unit-toolbar__buttonstrip float-right">
+      <a href="#" class="ui-button" data-action="submit" data-id="vstobjects"><i class="fas fa-save status-icon purple"></i><?=_('Save');?></a>
+    </div>
+  </div>
 </div>
 <!-- End toolbar -->
 
@@ -15,108 +15,78 @@
 
 <div class="l-center animated fadeIn">
 
-	<form id="vstobjects" name="v_edit_dns_rec" method="post" class="<?=$v_status?>">
-		<input type="hidden" name="token" value="<?=$_SESSION['token']?>">
-		<input type="hidden" name="save" value="save">
+  <form id="vstobjects" name="v_edit_dns_rec" method="post" class="<?=$v_status?>">
+    <input type="hidden" name="token" value="<?=$_SESSION['token']?>">
+    <input type="hidden" name="save" value="save">
+
+    <div class="app-form">
+      <h1 class="page-title"><?=_('Editing DNS Record');?></h1>
+      <?php show_alert_message($_SESSION);?>
+      <div class="u-input-width">
+        <div class="u-mb10">
+          <label for="v_domain" class="form-label"><?=_('Domain');?></label>
+          <input type="text" class="form-control" name="v_domain" id="v_domain" value="<?=htmlentities(trim($v_domain, "'"))?>" disabled>
+          <input type="hidden" name="v_domain" value="<?=htmlentities(trim($v_domain, "'"))?>">
+        </div>
+        <div class="u-mb10">
+          <label for="v_rec" class="form-label"><?=_('Record');?></label>
+          <input type="text" class="form-control" name="v_rec" id="v_rec" value="<?=htmlentities(trim($v_rec, "'"))?>">
+          <input type="hidden" name="v_record_id" value="<?=htmlentities(trim($v_record_id, "'"))?>">
+          <small class="hint"></small>
+        </div>
+        <div class="u-mb10">
+          <label for="v_type" class="form-label"><?=_('Type');?></label>
+          <select class="form-select" name="v_type" id="v_type">
+            <option value="A" <?php if ($v_type == 'A') echo "selected"; ?>>A</option>
+            <option value="AAAA" <?php if ($v_type == 'AAAA') echo "selected"; ?>>AAAA</option>
+            <option value="CAA" <?php if ($v_type == 'CAA') echo "selected"; ?>>CAA</option>
+            <option value="CNAME" <?php if ($v_type == 'CNAME') echo "selected"; ?>>CNAME</option>
+            <option value="DNSKEY" <?php if ($v_type == 'DNSKEY') echo "selected"; ?>>DNSKEY</option>
+            <option value="IPSECKEY" <?php if ($v_type == 'IPSECKEY') echo "selected"; ?>>IPSECKEY</option>
+            <option value="KEY" <?php if ($v_type == 'KEY') echo "selected"; ?>>KEY</option>
+            <option value="MX" <?php if ($v_type == 'MX') echo "selected"; ?>>MX</option>
+            <option value="NS" <?php if ($v_type == 'NS') echo "selected"; ?>>NS</option>
+            <option value="PTR" <?php if ($v_type == 'PTR') echo "selected"; ?>>PTR</option>
+            <option value="SPF" <?php if ($v_type == 'SPF') echo "selected"; ?>>SPF</option>
+            <option value="SRV" <?php if ($v_type == 'SRV') echo "selected"; ?>>SRV</option>
+            <option value="TLSA" <?php if ($v_type == 'TLSA') echo "selected"; ?>>TLSA</option>
+            <option value="TXT" <?php if ($v_type == 'TXT') echo "selected"; ?>>TXT</option>
+          </select>
+        </div>
+        <div class="u-mb10">
+          <label for="v_val" class="form-label"><?=_('IP or Value');?></label>
+          <div class="u-pos-relative">
+            <select class="form-select" tabindex="-1" onchange="this.nextElementSibling.value=this.value">
+              <option value="">&nbsp;</option>
+              <?php
+                foreach ($v_ips as $ip => $value) {
+                  $display_ip = empty($value['NAT']) ? $ip : "{$value['NAT']}";
+                  echo "<option value='{$display_ip}'>" . htmlentities($display_ip) . "</option>\n";
+                }
+              ?>
+            </select>
+            <input type="text" class="form-control list-editor" name="v_val" id="v_val" value="<?=htmlentities(trim($v_val, "'"))?>">
+          </div>
+        </div>
+        <div class="u-mb10">
+          <label for="v_priority" class="form-label">
+            <?=_('Priority');?> <span class="optional">(<?=_('optional');?>)</span>
+          </label>
+          <input type="text" class="form-control" name="v_priority" id="v_priority" value="<?=htmlentities(trim($v_priority, "'"))?>">
+        </div>
+        <div class="u-mb10">
+          <label for="v_ttl" class="form-label">
+            <?=_('TTL');?> <span class="optional">(<?=_('optional');?>)</span>
+          </label>
+          <input type="text" class="form-control" name="v_ttl" id="v_ttl" value="<?=htmlentities(trim($v_ttl, "'"))?>">
+        </div>
+      </div>
+    </div>
+
+  </form>
 
-		<table class="data">
-			<tr class="data-add">
-				<td class="data-dotted">
-					<table class="data-col1">
-						<tr>
-							<td></td>
-						</tr>
-					</table>
-				</td>
-				<td class="data-dotted">
-					<table class="data-col2">
-						<tr>
-							<td class="u-pt18">
-								<span class="page-title"><?=_('Editing DNS Record');?></span>
-							</td>
-						</tr>
-						<tr>
-							<td>
-								<?php show_error_panel($_SESSION);?>
-							</td>
-						</tr>
-						<tr>
-							<td class="u-pt18">
-								<label for="v_domain" class="form-label"><?=_('Domain');?></label>
-								<input type="text" class="form-control u-input-width" name="v_domain" id="v_domain" value="<?=htmlentities(trim($v_domain, "'"))?>" disabled>
-								<input type="hidden" name="v_domain" value="<?=htmlentities(trim($v_domain, "'"))?>">
-							</td>
-						</tr>
-						<tr>
-							<td class="u-pt6">
-								<label for="v_rec" class="form-label"><?=_('Record');?></label>
-								<input type="text" class="form-control u-input-width" name="v_rec" id="v_rec" value="<?=htmlentities(trim($v_rec, "'"))?>">
-								<input type="hidden" name="v_record_id" value="<?=htmlentities(trim($v_record_id, "'"))?>">
-								<small class="hint"></small>
-							</td>
-						</tr>
-						<tr>
-							<td class="u-pt6">
-								<label for="v_type" class="form-label"><?=_('Type');?></label>
-								<select class="form-select u-input-width" name="v_type" id="v_type">
-									<option value="A" <?php if ($v_type == 'A') echo "selected"; ?>>A</option>
-									<option value="AAAA" <?php if ($v_type == 'AAAA') echo "selected"; ?>>AAAA</option>
-									<option value="CAA" <?php if ($v_type == 'CAA') echo "selected"; ?>>CAA</option>
-									<option value="CNAME" <?php if ($v_type == 'CNAME') echo "selected"; ?>>CNAME</option>
-									<option value="DNSKEY" <?php if ($v_type == 'DNSKEY') echo "selected"; ?>>DNSKEY</option>
-									<option value="IPSECKEY" <?php if ($v_type == 'IPSECKEY') echo "selected"; ?>>IPSECKEY</option>
-									<option value="KEY" <?php if ($v_type == 'KEY') echo "selected"; ?>>KEY</option>
-									<option value="MX" <?php if ($v_type == 'MX') echo "selected"; ?>>MX</option>
-									<option value="NS" <?php if ($v_type == 'NS') echo "selected"; ?>>NS</option>
-									<option value="PTR" <?php if ($v_type == 'PTR') echo "selected"; ?>>PTR</option>
-									<option value="SPF" <?php if ($v_type == 'SPF') echo "selected"; ?>>SPF</option>
-									<option value="SRV" <?php if ($v_type == 'SRV') echo "selected"; ?>>SRV</option>
-									<option value="TLSA" <?php if ($v_type == 'TLSA') echo "selected"; ?>>TLSA</option>
-									<option value="TXT" <?php if ($v_type == 'TXT') echo "selected"; ?>>TXT</option>
-								</select>
-							</td>
-						</tr>
-						<tr>
-							<td class="u-pt6">
-								<label for="v_val" class="form-label"><?=_('IP or Value');?></label>
-								<div class="u-pos-relative u-input-width">
-									<select class="form-select" tabindex="-1" onchange="this.nextElementSibling.value=this.value">
-										<option value="">&nbsp;</option>
-										<?php
-											foreach ($v_ips as $ip => $value) {
-												$display_ip = empty($value['NAT']) ? $ip : "{$value['NAT']}";
-												echo "<option value='{$display_ip}'>" . htmlentities($display_ip) . "</option>\n";
-											}
-										?>
-									</select>
-									<input type="text" class="form-control list-editor" name="v_val" id="v_val" value="<?=htmlentities(trim($v_val, "'"))?>">
-								</div>
-							</td>
-						</tr>
-						<tr>
-							<td class="u-pt6">
-								<label for="v_priority" class="form-label">
-									<?=_('Priority');?> <span class="optional">(<?=_('optional');?>)</span>
-								</label>
-								<input type="text" class="form-control u-input-width" name="v_priority" id="v_priority" value="<?=htmlentities(trim($v_priority, "'"))?>">
-							</td>
-						</tr>
-						<tr>
-							<td class="u-pt6">
-								<label for="v_ttl" class="form-label">
-									<?=_('TTL');?> <span class="optional">(<?=_('optional');?>)</span>
-								</label>
-								<input type="text" class="form-control u-input-width" name="v_ttl" id="v_ttl" value="<?=htmlentities(trim($v_ttl, "'"))?>">
-							</td>
-						</tr>
-					</table>
-					<table class="data-col2"></table>
-				</td>
-			</tr>
-		</table>
-	</form>
 </div>
 
 <script>
-	GLOBAL.DNS_REC_PREFIX = "<?=htmlentities($_GET['domain']); ?>";
+  GLOBAL.DNS_REC_PREFIX = "<?=htmlentities($_GET['domain']); ?>";
 </script>

web/templates/pages/edit_firewall.html

@@ -1,13 +1,13 @@
 <!-- Begin toolbar -->
 <div class="l-center edit">
-	<div class="l-sort clearfix">
-		<div class="l-unit-toolbar__buttonstrip">
-			<a class="ui-button cancel" dir="ltr" id="btn-back" href="/list/firewall/"><i class="fas fa-arrow-left status-icon blue"></i><?=_('Back');?></a>
-		</div>
-		<div class="l-unit-toolbar__buttonstrip float-right">
-			<a href="#" class="ui-button" data-action="submit" data-id="vstobjects"><i class="fas fa-save status-icon purple"></i><?=_('Save');?></a>
-		</div>
-	</div>
+  <div class="l-sort clearfix">
+    <div class="l-unit-toolbar__buttonstrip">
+      <a class="ui-button cancel" dir="ltr" id="btn-back" href="/list/firewall/"><i class="fas fa-arrow-left status-icon blue"></i><?=_('Back');?></a>
+    </div>
+    <div class="l-unit-toolbar__buttonstrip float-right">
+      <a href="#" class="ui-button" data-action="submit" data-id="vstobjects"><i class="fas fa-save status-icon purple"></i><?=_('Save');?></a>
+    </div>
+  </div>
 </div>
 <!-- End toolbar -->
 
@@ -15,106 +15,78 @@
 
 <div class="l-center animated fadeIn">
 
-	<form id="vstobjects" name="v_edit_firewall" method="post" class="<?=$v_status?>">
-		<input type="hidden" name="token" value="<?=$_SESSION['token']?>">
-		<input type="hidden" name="save" value="save">
+  <form id="vstobjects" name="v_edit_firewall" method="post" class="<?=$v_status?>">
+    <input type="hidden" name="token" value="<?=$_SESSION['token']?>">
+    <input type="hidden" name="save" value="save">
+
+    <div class="app-form">
+      <h1 class="page-title"><?=_('Editing Firewall Rule');?></h1>
+      <?php show_alert_message($_SESSION);?>
+      <div class="u-input-width">
+        <div class="u-mb10">
+          <label for="v_action" class="form-label"><?=_('Action') ?></label>
+          <select class="form-select" name="v_action" id="v_action">
+            <option value="DROP" <?php if ((!empty($v_action)) && ( $v_action == "DROP" )) echo 'selected'?>><?=_('DROP');?></option>
+            <option value="ACCEPT" <?php if ((!empty($v_action)) && ( $v_action == "ACCEPT" )) echo 'selected'?>><?=_('ACCEPT');?></option>
+          </select>
+        </div>
+        <div class="u-mb10">
+          <label for="v_protocol" class="form-label"><?=_('Protocol') ?></label>
+          <select class="form-select" name="v_protocol" id="v_protocol">
+            <option value="TCP" <?php if ((!empty($v_protocol)) && ( $v_protocol == "TCP" )) echo 'selected'?>><?=_('TCP');?></option>
+            <option value="UDP" <?php if ((!empty($v_protocol)) && ( $v_protocol == "UDP" )) echo 'selected'?>><?=_('UDP');?></option>
+            <option value="ICMP" <?php if ((!empty($v_protocol)) && ( $v_protocol == "ICMP" )) echo 'selected'?>><?=_('ICMP');?></option>
+          </select>
+        </div>
+        <div class="u-mb10">
+          <label for="v_port" class="form-label">
+            <?=_('Port');?> <span class="optional">(<?=_('Ranges and Lists are acceptable');?>)</span>
+          </label>
+          <input type="text" class="form-control" name="v_port" id="v_port" value="<?=htmlentities(trim($v_port, "'"))?>" placeholder="<?=_('All ports: 0, Range: 80-82, List: 80,443,8080,8443');?>">
+        </div>
+        <div class="u-mb10">
+          <label for="v_ip" class="form-label">
+            <?=_('IP address / IPset');?> <span class="optional">(<?=_('CIDR format is supported');?>)</span>
+          </label>
+          <div class="u-pos-relative">
+            <select class="form-select" tabindex="-1" id="quickips_list" onchange="this.nextElementSibling.value=this.value">
+              <option value="">&nbsp;</option>
+            </select>
+            <input type="text" class="form-control list-editor" name="v_ip" id="v_ip" value="<?=htmlentities(trim($v_ip, "'"))?>">
+          </div>
+        </div>
+        <div class="u-mb10">
+          <label for="v_comment" class="form-label">
+            <?=_('Comment');?> <span class="optional">(<?=_('optional');?>)</span>
+          </label>
+          <input type="text" class="form-control" name="v_comment" id="v_comment" maxlength="255" value="<?=htmlentities(trim($v_comment, "'"))?>">
+        </div>
+      </div>
+    </div>
+
+  </form>
 
-		<table class="data">
-			<tr class="data-add">
-				<td class="data-dotted">
-					<table class="data-col1">
-						<tr>
-							<td></td>
-						</tr>
-					</table>
-				</td>
-				<td class="data-dotted">
-					<table class="data-col2" width="600px">
-						<tr>
-							<td class="u-pt18">
-								<span class="page-title"><?=_('Editing Firewall Rule');?></span>
-							</td>
-						</tr>
-						<tr>
-							<td>
-								<?php show_error_panel($_SESSION);?>
-							</td>
-						</tr>
-						<tr>
-							<td class="u-pt18">
-								<label for="v_action" class="form-label"><?=_('Action') ?></label>
-								<select class="form-select u-input-width" name="v_action" id="v_action">
-									<option value="DROP" <?php if ((!empty($v_action)) && ( $v_action == "DROP" )) echo 'selected'?>><?=_('DROP');?></option>
-									<option value="ACCEPT" <?php if ((!empty($v_action)) && ( $v_action == "ACCEPT" )) echo 'selected'?>><?=_('ACCEPT');?></option>
-								</select>
-							</td>
-						</tr>
-						<tr>
-							<td class="u-pt6">
-								<label for="v_protocol" class="form-label"><?=_('Protocol') ?></label>
-								<select class="form-select u-input-width" name="v_protocol" id="v_protocol">
-									<option value="TCP" <?php if ((!empty($v_protocol)) && ( $v_protocol == "TCP" )) echo 'selected'?>><?=_('TCP');?></option>
-									<option value="UDP" <?php if ((!empty($v_protocol)) && ( $v_protocol == "UDP" )) echo 'selected'?>><?=_('UDP');?></option>
-									<option value="ICMP" <?php if ((!empty($v_protocol)) && ( $v_protocol == "ICMP" )) echo 'selected'?>><?=_('ICMP');?></option>
-								</select>
-							</td>
-						</tr>
-						<tr>
-							<td class="u-pt6">
-								<label for="v_port" class="form-label">
-									<?=_('Port');?> <span class="optional">(<?=_('Ranges and Lists are acceptable');?>)</span>
-								</label>
-								<input type="text" class="form-control u-input-width" name="v_port" id="v_port" value="<?=htmlentities(trim($v_port, "'"))?>" placeholder="<?=_('All ports: 0, Range: 80-82, List: 80,443,8080,8443');?>">
-							</td>
-						</tr>
-						<tr>
-							<td class="u-pt6">
-								<label for="v_ip" class="form-label">
-									<?=_('IP address / IPset');?> <span class="optional">(<?=_('CIDR format is supported');?>)</span>
-								</label>
-								<div class="u-pos-relative u-input-width">
-									<select class="form-select" tabindex="-1" id="quickips_list" onchange="this.nextElementSibling.value=this.value">
-										<option value="">&nbsp;</option>
-									</select>
-									<input type="text" class="form-control list-editor" name="v_ip" id="v_ip" value="<?=htmlentities(trim($v_ip, "'"))?>">
-								</div>
-							</td>
-						</tr>
-						<tr>
-							<td class="u-pt6">
-								<label for="v_comment" class="form-label">
-									<?=_('Comment');?> <span class="optional">(<?=_('optional');?>)</span>
-								</label>
-								<input type="text" class="form-control u-input-width" name="v_comment" id="v_comment" maxlength="255" value="<?=htmlentities(trim($v_comment, "'"))?>">
-							</td>
-						</tr>
-					</table>
-					<table class="data-col2"></table>
-				</td>
-			</tr>
-		</table>
-	</form>
 </div>
 
 <script>
-	var iplists = JSON.parse('<?=$ipset_lists_json?>');
-	iplists.sort(function (a, b) {
-		return a.name > b.name;
-	});
+  var ipLists = JSON.parse('<?=$ipset_lists_json?>');
+  ipLists.sort(function (a, b) {
+    return a.name > b.name;
+  });
 
-	$(function () {
-		var targetElement = document.getElementById('quickips_list');
+  $(function () {
+    var targetElement = document.getElementById('quickips_list');
 
-		var newEl = document.createElement("option");
-		newEl.text = "IP address lists:";
-		newEl.disabled = true;
-		targetElement.appendChild(newEl);
+    var newEl = document.createElement("option");
+    newEl.text = "IP address lists:";
+    newEl.disabled = true;
+    targetElement.appendChild(newEl);
 
-		iplists.forEach(iplist => {
-			var newEl = document.createElement("option");
-			newEl.text = iplist.name;
-			newEl.value = "ipset:" + iplist.name;
-			targetElement.appendChild(newEl);
-		});
-	});
+    ipLists.forEach(iplist => {
+      var newEl = document.createElement("option");
+      newEl.text = iplist.name;
+      newEl.value = "ipset:" + iplist.name;
+      targetElement.appendChild(newEl);
+    });
+  });
 </script>

web/templates/pages/edit_ip.html

@@ -1,13 +1,13 @@
 <!-- Begin toolbar -->
 <div class="l-center edit">
-	<div class="l-sort clearfix">
-		<div class="l-unit-toolbar__buttonstrip">
-			<a class="ui-button cancel" dir="ltr" id="btn-back" href="/list/ip/"><i class="fas fa-arrow-left status-icon blue"></i><?=_('Back');?></a>
-		</div>
-		<div class="l-unit-toolbar__buttonstrip float-right">
-			<a href="#" class="ui-button" data-action="submit" data-id="vstobjects"><i class="fas fa-save status-icon purple"></i><?=_('Save');?></a>
-		</div>
-	</div>
+  <div class="l-sort clearfix">
+    <div class="l-unit-toolbar__buttonstrip">
+      <a class="ui-button cancel" dir="ltr" id="btn-back" href="/list/ip/"><i class="fas fa-arrow-left status-icon blue"></i><?=_('Back');?></a>
+    </div>
+    <div class="l-unit-toolbar__buttonstrip float-right">
+      <a href="#" class="ui-button" data-action="submit" data-id="vstobjects"><i class="fas fa-save status-icon purple"></i><?=_('Save');?></a>
+    </div>
+  </div>
 </div>
 <!-- End toolbar -->
 
@@ -15,94 +15,62 @@
 
 <div class="l-center animated fadeIn">
 
-	<form id="vstobjects" name="v_edit_ip" method="post">
-		<input type="hidden" name="token" value="<?=$_SESSION['token']?>">
-		<input type="hidden" name="save" value="save">
+  <form id="vstobjects" name="v_edit_ip" method="post">
+    <input type="hidden" name="token" value="<?=$_SESSION['token']?>">
+    <input type="hidden" name="save" value="save">
+
+    <div class="app-form">
+      <h1 class="page-title"><?=_('Editing IP Address');?></h1>
+      <?php show_alert_message($_SESSION);?>
+      <div class="u-input-width">
+        <div class="u-mb10">
+          <label for="v_ip" class="form-label"><?=_('IP address') ?></label>
+          <input type="text" class="form-control" name="v_ip" id="v_ip" value="<?=htmlentities(trim($v_ip, "'"))?>" disabled>
+          <input type="hidden" name="v_ip" value="<?=htmlentities(trim($v_ip, "'"))?>">
+        </div>
+        <div class="u-mb10">
+          <label for="v_netmask" class="form-label"><?=_('Netmask');?></label>
+          <input type="text" class="form-control" name="v_netmask" id="v_netmask" value="<?=htmlentities(trim($v_netmask, "'"))?>" disabled>
+        </div>
+        <div class="u-mb10">
+          <label for="v_interface" class="form-label"><?=_('Interface'); ?></label>
+          <input type="text" class="form-control" name="v_interface" id="v_interface" value="<?=htmlentities(trim($v_interface, "'"))?>" disabled>
+        </div>
+        <div class="form-check u-mb10">
+          <input class="form-check-input" type="checkbox" name="v_shared" id="v_shared" <?php if (empty($v_dedicated)) echo 'checked' ?> onclick="javascript:elementHideShow('usrtable');">
+          <label for="v_shared">
+            <?=_('Shared');?>
+          </label>
+        </div>
+        <div id="usrtable" style="display:<?php if (empty($v_dedicated)) { echo 'none';} else {echo 'block';}?> ;">
+          <div class="u-mb10">
+            <label for="v_owner" class="form-label"><?=_('Assigned user');?></label>
+            <select class="form-select" name="v_owner" id="v_owner">
+              <?php
+                foreach ($users as $key => $value) {
+                  echo "\t\t\t\t<option value=\"".htmlentities($value)."\"";
+                  if ((!empty($v_owner)) && ( $value == $v_owner )) echo ' selected';
+                  echo ">".htmlentities($value)."</option>\n";
+                }
+              ?>
+            </select>
+          </div>
+        </div>
+        <div class="u-mb10">
+          <label for="v_name" class="form-label">
+            <?=_('Assigned domain');?> <span class="optional">(<?=_('optional');?>)</span>
+          </label>
+          <input type="text" class="form-control" name="v_name" id="v_name" value="<?=htmlentities(trim($v_name, "'"))?>">
+        </div>
+        <div class="u-mb10">
+          <label for="v_nat" class="form-label">
+            <?=_('NAT IP association');?> <span class="optional">(<?=_('optional');?>)</span>
+          </label>
+          <input type="text" class="form-control" name="v_nat" id="v_nat" value="<?=htmlentities(trim($v_nat, "'"))?>">
+        </div>
+      </div>
+    </div>
+
+  </form>
 
-		<table class="data">
-			<tr class="data-add">
-				<td class="data-dotted">
-					<table class="data-col1">
-						<tr>
-							<td></td>
-						</tr>
-					</table>
-				</td>
-				<td class="data-dotted">
-					<table class="data-col2" width="600px">
-						<tr>
-							<td class="u-pt18">
-								<span class="page-title"><?=_('Editing IP Address');?></span>
-							</td>
-						</tr>
-						<tr>
-							<td>
-								<?php show_error_panel($_SESSION);?>
-							</td>
-						</tr>
-						<tr>
-							<td class="u-pt18">
-								<label for="v_ip" class="form-label"><?=_('IP address') ?></label>
-								<input type="text" class="form-control u-input-width" name="v_ip" id="v_ip" value="<?=htmlentities(trim($v_ip, "'"))?>" disabled>
-								<input type="hidden" name="v_ip" value="<?=htmlentities(trim($v_ip, "'"))?>">
-							</td>
-						</tr>
-						<tr>
-							<td class="u-pt6">
-								<label for="v_netmask" class="form-label"><?=_('Netmask');?></label>
-								<input type="text" class="form-control u-input-width" name="v_netmask" id="v_netmask" value="<?=htmlentities(trim($v_netmask, "'"))?>" disabled>
-							</td>
-						</tr>
-						<tr>
-							<td class="u-pt6">
-								<label for="v_interface" class="form-label"><?=_('Interface'); ?></label>
-								<input type="text" class="form-control u-input-width" name="v_interface" id="v_interface" value="<?=htmlentities(trim($v_interface, "'"))?>" disabled>
-							</td>
-						</tr>
-						<tr>
-							<td class="u-pt6">
-								<div class="form-check">
-									<input class="form-check-input" type="checkbox" name="v_shared" id="v_shared" <?php if (empty($v_dedicated)) echo 'checked' ?> onclick="javascript:elementHideShow('usrtable');">
-									<label for="v_shared">
-										<?=_('Shared');?>
-									</label>
-								</div>
-							</td>
-						</tr>
-						<tr>
-							<td class="u-pt6" style="display:<?php if (empty($v_dedicated)) { echo 'none';} else {echo 'block';}?> ;" id="usrtable">
-								<label for="v_owner" class="form-label"><?=_('Assigned user');?></label>
-								<select class="form-select u-input-width" name="v_owner" id="v_owner">
-									<?php
-										foreach ($users as $key => $value) {
-											echo "\t\t\t\t<option value=\"".htmlentities($value)."\"";
-											if ((!empty($v_owner)) && ( $value == $v_owner )) echo ' selected';
-											echo ">".htmlentities($value)."</option>\n";
-										}
-									?>
-								</select>
-							</td>
-						</tr>
-						<tr>
-							<td class="u-pt6">
-								<label for="v_name" class="form-label">
-									<?=_('Assigned domain');?> <span class="optional">(<?=_('optional');?>)</span>
-								</label>
-								<input type="text" class="form-control u-input-width" name="v_name" id="v_name" value="<?=htmlentities(trim($v_name, "'"))?>">
-							</td>
-						</tr>
-						<tr>
-							<td class="u-pt6">
-								<label for="v_nat" class="form-label">
-									<?=_('NAT IP association');?> <span class="optional">(<?=_('optional');?>)</span>
-								</label>
-								<input type="text" class="form-control u-input-width" name="v_nat" id="v_nat" value="<?=htmlentities(trim($v_nat, "'"))?>">
-							</td>
-						</tr>
-					</table>
-					<table class="data-col2 u-mb20"></table>
-				</td>
-			</tr>
-		</table>
-	</form>
 </div>

web/templates/pages/edit_mail.html

@@ -21,7 +21,7 @@
 
     <div class="app-form">
       <h1 class="page-title"><?=_('Editing Mail Domain');?></h1>
-      <?php show_error_panel($_SESSION);?>
+      <?php show_alert_message($_SESSION);?>
       <div class="u-input-width">
         <div class="u-mb20">
           <label for="v_domain" class="form-label"><?=_('Domain');?></label>
@@ -98,7 +98,7 @@
             </label>
           </div>
         </div>
-        <div class="u-pl50" id="ssltable" style="display:<?php if ($v_ssl == 'no' ) { echo 'none';} else {echo 'block';}?> ;">
+        <div id="ssltable" class="u-pl50" style="display:<?php if ($v_ssl == 'no' ) { echo 'none';} else {echo 'block';}?> ;">
           <div class="u-mb10">
             <div class="form-check">
               <input class="form-check-input" type="checkbox" name="v_letsencrypt" id="v_letsencrypt" onclick="javascript:elementHideShow('ssl-details');App.Actions.MAIL.toggle_letsencrypt(this);" <?php if($v_letsencrypt == 'yes' || $v_letsencrypt == 'on') echo 'checked' ?>">
@@ -206,7 +206,7 @@
             </div>
           </label>
         </div>
-        <div class="u-pl50" id="smtp_relay_table" style="display:<?php if ($v_smtp_relay == 'true') {echo 'block';} else {echo 'none';} ?>;">
+        <div id="smtp_relay_table" class="u-pl50" style="display:<?php if ($v_smtp_relay == 'true') {echo 'block';} else {echo 'none';} ?>;">
           <div class="u-mb10">
             <label for="v_smtp_relay_host" class="form-label"><?=_('Host');?></label>
             <input type="text" class="form-control" name="v_smtp_relay_host" id="v_smtp_relay_host" value="<?=htmlentities(trim($v_smtp_relay_host, "'"))?>">

web/templates/pages/edit_mail_acc.html

@@ -21,7 +21,7 @@
 
     <div class="app-form">
       <h1 class="page-title"><?=_('Editing Mail Account');?></h1>
-      <?php show_error_panel($_SESSION);?>
+      <?php show_alert_message($_SESSION);?>
       <div style="display: flex; justify-content: space-between;">
         <div class="u-input-width">
           <div class="u-mb10">

web/templates/pages/edit_package.html

@@ -37,7 +37,7 @@
 						</tr>
 						<tr>
 							<td>
-								<?php show_error_panel($_SESSION);?>
+								<?php show_alert_message($_SESSION);?>
 							</td>
 						</tr>
 						<tr>

web/templates/pages/edit_server.html

@@ -41,20 +41,20 @@
 						</tr>
 						<tr>
 							<td>
-								<?php show_error_panel($_SESSION);?>
+								<?php show_alert_message($_SESSION);?>
 							</td>
 						</tr>
 						<!-- Basic options tab -->
 						<tr>
 							<td class="advanced-options">
 								<a href="javascript:elementHideShow('basic');" class="vst-text">
-									<i class="fas fa-cog"></i><b><?=_('Basic options');?> <img src="/images/arrow.png"></b>
+									<i class="fas fa-cog"></i><b><?=_('Basic options');?> <img src="/images/arrow.png" alt=""></b>
 								</a>
 							</td>
 						</tr>
 						<tr>
 							<td class="u-pl50 u-pt6">
-								<table style="display:<?php if (empty($v_adv)) echo 'none';?> ;" id="basic">
+								<table id="basic" style="display:<?php if (empty($v_adv)) echo 'none';?> ;">
 									<tr>
 										<td class="u-pt18">
 											<label for="v_hostname" class="form-label"><?=_('Hostname');?></label>
@@ -140,13 +140,13 @@
 						<tr>
 							<td class="advanced-options">
 								<a href="javascript:elementHideShow('version');" class="vst-text">
-									<i class="fas fa-code-branch"></i><b><?=_('Updates');?> <img src="/images/arrow.png"></b>
+									<i class="fas fa-code-branch"></i><b><?=_('Updates');?> <img src="/images/arrow.png" alt=""></b>
 								</a>
 							</td>
 						</tr>
 						<tr>
 							<td class="u-pl50 u-pt6">
-								<table style="display:<?php if (empty($v_adv)) echo 'none';?> ;" id="version">
+								<table id="version" style="display:<?php if (empty($v_adv)) echo 'none';?> ;">
 									<tr>
 										<td class="u-pt18">
 											<?=_('Version'); ?>: <span class="optional"><?=$_SESSION['VERSION'];?></span>
@@ -218,13 +218,13 @@
 						<tr>
 							<td class="advanced-options">
 								<a href="javascript:elementHideShow('web');" class="vst-text">
-									<i class="fas fa-globe-americas"></i><b><?=_('Web Server');?> <img src="/images/arrow.png"></b>
+									<i class="fas fa-globe-americas"></i><b><?=_('Web Server');?> <img src="/images/arrow.png" alt=""></b>
 								</a>
 							</td>
 						</tr>
 						<tr>
 							<td class="u-pl50 u-pt6">
-								<table style="display:<?php if (empty($v_adv)) echo 'none';?> ;" id="web" class="u-pt18">
+								<table id="web" class="u-pt18" style="display:<?php if (empty($v_adv)) echo 'none';?> ;">
 									<?php if (!empty($_SESSION['PROXY_SYSTEM'])) { ?>
 										<tr>
 											<td>
@@ -329,13 +329,13 @@
 							<tr>
 								<td class="advanced-options">
 									<a href="javascript:elementHideShow('dns');" class="vst-text">
-										<i class="fas fa-atlas"></i><b><?=_('DNS Server');?> <img src="/images/arrow.png"></b>
+										<i class="fas fa-atlas"></i><b><?=_('DNS Server');?> <img src="/images/arrow.png" alt=""></b>
 									</a>
 								</td>
 							</tr>
 							<tr>
 								<td class="u-pl50 u-pt6">
-									<table style="display:<?php if (empty($v_adv)) echo 'none';?> ;" class="u-mb20" id="dns">
+									<table id="dns" class="u-mb20" style="display:<?php if (empty($v_adv)) echo 'none';?> ;">
 										<tr>
 											<td class="u-pt18">
 												<?=_('DNS Server');?>: <span class="optional"><?=$_SESSION['DNS_SYSTEM']; ?> <a href="/edit/server/<? echo $_SESSION['DNS_SYSTEM'] ?>/"><i class="fas fa-pencil-alt status-icon orange icon-pad-right"></i></a></span>
@@ -367,13 +367,13 @@
 							<tr>
 								<td class="advanced-options">
 									<a href="javascript:elementHideShow('mail');" class="vst-text">
-										<i class="fas fa-mail-bulk"></i><b><?=_('Mail Server');?> <img src="/images/arrow.png"></b>
+										<i class="fas fa-mail-bulk"></i><b><?=_('Mail Server');?> <img src="/images/arrow.png" alt=""></b>
 									</a>
 								</td>
 							</tr>
 							<tr>
 								<td class="u-pl50 u-pt6">
-									<table style="display:<?php if (empty($v_mail_adv)) echo 'none';?> ;" id="mail">
+									<table id="mail" style="display:<?php if (empty($v_mail_adv)) echo 'none';?> ;">
 										<tr>
 											<td class="u-pt18">
 												<?=_('Mail Server');?>: <span class="optional"><?=$_SESSION['MAIL_SYSTEM']; ?> <a href="/edit/server/<? echo $_SESSION['MAIL_SYSTEM'] ?>/"><i class="fas fa-pencil-alt status-icon orange icon-pad-right"></i></a></span>
@@ -415,7 +415,7 @@
 										</tr>
 										<tr>
 											<td class="u-pl50">
-												<table style="display:<?php if ($v_smtp_relay == 'true') {echo 'block';} else {echo 'none';} ?>;" id="smtp_relay_table">
+												<table id="smtp_relay_table" style="display:<?php if ($v_smtp_relay == 'true') {echo 'block';} else {echo 'none';} ?>;">
 													<tr>
 														<td class="u-pt6">
 															<label for="v_smtp_relay_host" class="form-label"><?=_('Host');?></label>
@@ -459,13 +459,13 @@
 							<tr>
 								<td class="advanced-options">
 									<a href="javascript:elementHideShow('db');" class="vst-text">
-										<i class="fas fa-database"></i><b><?=_('Databases');?> <img src="/images/arrow.png"></b>
+										<i class="fas fa-database"></i><b><?=_('Databases');?> <img src="/images/arrow.png" alt=""></b>
 									</a>
 								</td>
 							</tr>
 							<tr>
 								<td class="u-pl50 u-pt6">
-									<table style="display:<?php if (empty($v_db_adv)) echo 'none';?> ;" id="db">
+									<table id="db" style="display:<?php if (empty($v_db_adv)) echo 'none';?> ;">
 										<tr>
 											<td class="u-pt18">
 												<label for="v_mysql" class="form-label">
@@ -592,7 +592,7 @@
 						<tr>
 							<td class="advanced-options">
 								<a href="javascript:elementHideShow('backup');" class="vst-text">
-									<i class="fas fa-undo"></i><b><?=_('Backups');?> <img src="/images/arrow.png"></b>
+									<i class="fas fa-undo"></i><b><?=_('Backups');?> <img src="/images/arrow.png" alt=""></b>
 								</a>
 							</td>
 						</tr>
@@ -651,7 +651,7 @@
 									</tr>
 									<tr>
 										<td class="u-pl50 u-pt6">
-											<table style="display:<?php if (empty($v_backup_remote_adv)) echo 'none';?> ;" id="remote_backup">
+											<table id="remote_backup" style="display:<?php if (empty($v_backup_remote_adv)) echo 'none';?> ;">
 												<tr>
 													<td class="u-pt6">
 														<label for="backup_type" class="form-label">
@@ -754,13 +754,13 @@
 						<tr>
 							<td class="advanced-options">
 								<a href="javascript:elementHideShow('ssl');" class="vst-text">
-									<i class="fas fa-lock"></i><b><?=_('SSL');?><img src="/images/arrow.png"></b>
+									<i class="fas fa-lock"></i><b><?=_('SSL');?><img src="/images/arrow.png" alt=""></b>
 								</a>
 							</td>
 						</tr>
 						<tr>
 							<td class="u-pl50 u-pt6">
-								<table style="display:<?php if (empty($v_adv)) echo 'none';?> ;" id="ssl">
+								<table id="ssl" style="display:<?php if (empty($v_adv)) echo 'none';?> ;">
 									<tr>
 										<td class="u-pt18">
 											<label for="v_ssl_crt" class="form-label">
@@ -846,7 +846,7 @@
 						<tr>
 							<td class="advanced-options">
 								<a href="javascript:elementHideShow('security');" class="vst-text">
-									<i class="fas fa-key"></i><b><?=_('Security');?> <img src="/images/arrow.png"></b>
+									<i class="fas fa-key"></i><b><?=_('Security');?> <img src="/images/arrow.png" alt=""></b>
 								</a>
 							</td>
 						</tr>
@@ -1085,13 +1085,13 @@
 						<tr>
 							<td class="advanced-options">
 								<a href="javascript:elementHideShow('hestia');" class="vst-text">
-									<i class="fas fa-puzzle-piece"></i><b><?=_('Hestia Control Panel Plugins');?> <img src="/images/arrow.png"></b>
+									<i class="fas fa-puzzle-piece"></i><b><?=_('Hestia Control Panel Plugins');?> <img src="/images/arrow.png" alt=""></b>
 								</a>
 							</td>
 						</tr>
 						<tr>
 							<td class="u-pl50 u-pt6">
-								<table style="display:<?php if (empty($v_adv)) echo 'none';?> ;" id="hestia">
+								<table id="hestia" style="display:<?php if (empty($v_adv)) echo 'none';?> ;">
 									<tr>
 										<td class="u-pt18">
 											<label for="v_plugin_app_installer" class="form-label"><?=_('Quick App Installer');?></label>

web/templates/pages/edit_server_bind9.html

@@ -1,13 +1,13 @@
 <!-- Begin toolbar -->
 <div class="l-center edit">
-	<div class="l-sort clearfix">
-		<div class="l-unit-toolbar__buttonstrip">
-			<a class="ui-button cancel" dir="ltr" id="btn-back" href="/list/server/"><i class="fas fa-arrow-left status-icon blue"></i><?=_('Back');?></a>
-		</div>
-		<div class="l-unit-toolbar__buttonstrip float-right">
-			<a href="#" class="ui-button" data-action="submit" data-id="vstobjects"><i class="fas fa-save status-icon purple"></i><?=_('Save');?></a>
-		</div>
-	</div>
+  <div class="l-sort clearfix">
+    <div class="l-unit-toolbar__buttonstrip">
+      <a class="ui-button cancel" dir="ltr" id="btn-back" href="/list/server/"><i class="fas fa-arrow-left status-icon blue"></i><?=_('Back');?></a>
+    </div>
+    <div class="l-unit-toolbar__buttonstrip float-right">
+      <a href="#" class="ui-button" data-action="submit" data-id="vstobjects"><i class="fas fa-save status-icon purple"></i><?=_('Save');?></a>
+    </div>
+  </div>
 </div>
 <!-- End toolbar -->
 
@@ -15,55 +15,31 @@
 
 <div class="l-center animated fadeIn">
 
-	<form id="vstobjects" name="v_configure_server" method="post">
-		<input type="hidden" name="token" value="<?=$_SESSION['token']?>">
-		<input type="hidden" name="save" value="save">
+  <form id="vstobjects" name="v_configure_server" method="post">
+    <input type="hidden" name="token" value="<?=$_SESSION['token']?>">
+    <input type="hidden" name="save" value="save">
+
+    <div class="app-form">
+      <h1 class="page-title"><?=_('Configuring Server');?>: <?=$v_service_name;?></h1>
+      <?php show_alert_message($_SESSION);?>
+      <div class="u-wide-input-width">
+        <div class="u-mb20">
+          <label for="v_options" class="form-label"><?=$v_options_path;?></label>
+          <textarea class="form-control u-min-height300 u-console" name="v_options" id="v_options"><?=$v_options;?></textarea>
+        </div>
+        <div class="u-mb20">
+          <label for="v_config" class="form-label"><?=$v_config_path;?></label>
+          <textarea class="form-control u-min-height300 u-console" name="v_config" id="v_config"><?=$v_config;?></textarea>
+        </div>
+        <div class="form-check">
+          <input class="form-check-input" type="checkbox" name="v_restart" id="v_restart" checked>
+          <label for="v_restart">
+            <?=_('restart');?>
+          </label>
+        </div>
+      </div>
+    </div>
+
+  </form>
 
-		<table class="data">
-			<tr class="data-add">
-				<td class="data-dotted">
-					<table class="data-col1">
-						<tr>
-							<td></td>
-						</tr>
-					</table>
-				</td>
-				<td>
-					<table class="data-col2" width="600px">
-						<tr>
-							<td class="u-pt18">
-								<span class="page-title"><?=_('Configuring Server');?>: <?=$v_service_name;?></span>
-							</td>
-						</tr>
-						<tr>
-							<td>
-								<?php show_error_panel($_SESSION);?>
-							</td>
-						</tr>
-						<tr>
-							<td class="u-pt18">
-								<label for="v_options" class="form-label"><?=$v_options_path;?></label>
-								<textarea class="form-control u-min-height300 u-console" name="v_options" id="v_options"><?=$v_options;?></textarea>
-							</td>
-						</tr>
-						<tr>
-							<td class="u-pt18">
-								<label for="v_config" class="form-label"><?=$v_config_path;?></label>
-								<textarea class="form-control u-min-height300 u-console" name="v_config" id="v_config"><?=$v_config;?></textarea>
-							</td>
-						</tr>
-						<td class="u-pt6" style="text-transform: capitalize;">
-							<div class="form-check">
-								<input class="form-check-input" type="checkbox" name="v_restart" id="v_restart" checked>
-								<label for="v_restart">
-									<?=_('restart');?>
-								</label>
-							</div>
-						</td>
-					</table>
-					<table class="data-col2"></table>
-				</td>
-			</tr>
-		</table>
-	</form>
 </div>

web/templates/pages/edit_server_dovecot.html

@@ -1,13 +1,13 @@
 <!-- Begin toolbar -->
 <div class="l-center edit">
-	<div class="l-sort clearfix">
-		<div class="l-unit-toolbar__buttonstrip">
-			<a class="ui-button cancel" dir="ltr" id="btn-back" href="/list/server/"><i class="fas fa-arrow-left status-icon blue"></i><?=_('Back');?></a>
-		</div>
-		<div class="l-unit-toolbar__buttonstrip float-right">
-			<a href="#" class="ui-button" data-action="submit" data-id="vstobjects"><i class="fas fa-save status-icon purple"></i><?=_('Save');?></a>
-		</div>
-	</div>
+  <div class="l-sort clearfix">
+    <div class="l-unit-toolbar__buttonstrip">
+      <a class="ui-button cancel" dir="ltr" id="btn-back" href="/list/server/"><i class="fas fa-arrow-left status-icon blue"></i><?=_('Back');?></a>
+    </div>
+    <div class="l-unit-toolbar__buttonstrip float-right">
+      <a href="#" class="ui-button" data-action="submit" data-id="vstobjects"><i class="fas fa-save status-icon purple"></i><?=_('Save');?></a>
+    </div>
+  </div>
 </div>
 <!-- End toolbar -->
 
@@ -15,99 +15,61 @@
 
 <div class="l-center animated fadeIn">
 
-	<form id="vstobjects" name="v_configure_server" method="post">
-		<input type="hidden" name="token" value="<?=$_SESSION['token']?>">
-		<input type="hidden" name="save" value="save">
+  <form id="vstobjects" name="v_configure_server" method="post">
+    <input type="hidden" name="token" value="<?=$_SESSION['token']?>">
+    <input type="hidden" name="save" value="save">
+
+    <div class="app-form">
+      <h1 class="page-title"><?=_('Configuring Server');?>: <?=$v_service_name;?></h1>
+      <?php show_alert_message($_SESSION);?>
+      <div class="u-wide-input-width">
+        <div class="u-mb20">
+          <label for="v_config" class="form-label"><?=$v_config_path;?></label>
+          <textarea class="form-control u-min-height300 u-console" name="v_config" id="v_config"><?=$v_config?></textarea>
+        </div>
+        <?php if (!empty($v_config_path1)) { ?>
+          <div class="u-mb20">
+            <label for="v_config1" class="form-label"><?=$v_config_path1;?></label>
+            <textarea class="form-control u-min-height300 u-console" name="v_config1" id="v_config1"><?=$v_config1?></textarea>
+          </div>
+          <div class="u-mb20">
+            <label for="v_config2" class="form-label"><?=$v_config_path2;?></label>
+            <textarea class="form-control u-min-height300 u-console" name="v_config2" id="v_config2"><?=$v_config2?></textarea>
+          </div>
+          <div class="u-mb20">
+            <label for="v_config3" class="form-label"><?=$v_config_path3;?></label>
+            <textarea class="form-control u-min-height300 u-console" name="v_config3" id="v_config3"><?=$v_config3?></textarea>
+          </div>
+          <div class="u-mb20">
+            <label for="v_config4" class="form-label"><?=$v_config_path4;?></label>
+            <textarea class="form-control u-min-height300 u-console" name="v_config4" id="v_config4"><?=$v_config4?></textarea>
+          </div>
+          <div class="u-mb20">
+            <label for="v_config5" class="form-label"><?=$v_config_path5;?></label>
+            <textarea class="form-control u-min-height300 u-console" name="v_config5" id="v_config5"><?=$v_config5?></textarea>
+          </div>
+          <div class="u-mb20">
+            <label for="v_config6" class="form-label"><?=$v_config_path6;?></label>
+            <textarea class="form-control u-min-height300 u-console" name="v_config6" id="v_config6"><?=$v_config6?></textarea>
+          </div>
+          <div class="u-mb20">
+            <label for="v_config7" class="form-label"><?=$v_config_path7;?></label>
+            <textarea class="form-control u-min-height300 u-console" name="v_config7" id="v_config7"><?=$v_config7?></textarea>
+          </div>
+          <div class="u-mb20">
+            <label for="v_config8" class="form-label"><?=$v_config_path8;?></label>
+            <textarea class="form-control u-min-height300 u-console" name="v_config8" id="v_config8"><?=$v_config8?></textarea>
+          </div>
+        <?php } ?>
+        <div class="form-check">
+          <input class="form-check-input" type="checkbox" name="v_restart" id="v_restart" checked>
+          <label for="v_restart">
+            <?=_('restart');?>
+          </label>
+        </div>
+      </div>
+    </div>
+
+  </form>
 
-		<table class="data">
-			<tr class="data-add">
-				<td class="data-dotted">
-					<table class="data-col1">
-						<tr>
-							<td></td>
-						</tr>
-					</table>
-				</td>
-				<td>
-					<table class="data-col2" width="600px">
-						<tr>
-							<td class="u-pt18">
-								<span class="page-title"><?=_('Configuring Server');?>: <?=$v_service_name;?></span>
-							</td>
-						</tr>
-						<tr>
-							<td>
-								<?php show_error_panel($_SESSION);?>
-							</td>
-						</tr>
-						<tr>
-							<td class="u-pt18">
-								<label for="v_config" class="form-label"><?=$v_config_path;?></label>
-								<textarea class="form-control u-min-height300 u-console" name="v_config" id="v_config"><?=$v_config?></textarea>
-							</td>
-						</tr>
-						<?php if (!empty($v_config_path1)) { ?>
-							<tr>
-								<td class="u-pt18">
-									<label for="v_config1" class="form-label"><?=$v_config_path1;?></label>
-									<textarea class="form-control u-min-height300 u-console" name="v_config1" id="v_config1"><?=$v_config1?></textarea>
-								</td>
-							</tr>
-							<tr>
-								<td class="u-pt18">
-									<label for="v_config2" class="form-label"><?=$v_config_path2;?></label>
-									<textarea class="form-control u-min-height300 u-console" name="v_config2" id="v_config2"><?=$v_config2?></textarea>
-								</td>
-							</tr>
-							<tr>
-								<td class="u-pt18">
-									<label for="v_config3" class="form-label"><?=$v_config_path3;?></label>
-									<textarea class="form-control u-min-height300 u-console" name="v_config3" id="v_config3"><?=$v_config3?></textarea>
-								</td>
-							</tr>
-							<tr>
-								<td class="u-pt18">
-									<label for="v_config4" class="form-label"><?=$v_config_path4;?></label>
-									<textarea class="form-control u-min-height300 u-console" name="v_config4" id="v_config4"><?=$v_config4?></textarea>
-								</td>
-							</tr>
-							<tr>
-								<td class="u-pt18">
-									<label for="v_config5" class="form-label"><?=$v_config_path5;?></label>
-									<textarea class="form-control u-min-height300 u-console" name="v_config5" id="v_config5"><?=$v_config5?></textarea>
-								</td>
-							</tr>
-							<tr>
-								<td class="u-pt18">
-									<label for="v_config6" class="form-label"><?=$v_config_path6;?></label>
-									<textarea class="form-control u-min-height300 u-console" name="v_config6" id="v_config6"><?=$v_config6?></textarea>
-								</td>
-							</tr>
-							<tr>
-								<td class="u-pt18">
-									<label for="v_config7" class="form-label"><?=$v_config_path7;?></label>
-									<textarea class="form-control u-min-height300 u-console" name="v_config7" id="v_config7"><?=$v_config7?></textarea>
-								</td>
-							</tr>
-							<tr>
-								<td class="u-pt18">
-									<label for="v_config8" class="form-label"><?=$v_config_path8;?></label>
-									<textarea class="form-control u-min-height300 u-console" name="v_config8" id="v_config8"><?=$v_config8?></textarea>
-								</td>
-							</tr>
-						<?php } ?>
-						<td class="u-pt6" style="text-transform: capitalize;">
-							<div class="form-check">
-								<input class="form-check-input" type="checkbox" name="v_restart" id="v_restart" checked>
-								<label for="v_restart">
-									<?=_('restart');?>
-								</label>
-							</div>
-						</td>
-					</table>
-					<table class="data-col2"></table>
-				</td>
-			</tr>
-		</table>
-	</form>
 </div>

web/templates/pages/edit_server_httpd.html

@@ -1,14 +1,14 @@
 <!-- Begin toolbar -->
 <div class="l-center edit">
-	<div class="l-sort clearfix">
-		<div class="l-unit-toolbar__buttonstrip">
-			<a class="ui-button cancel" dir="ltr" id="btn-back" href="/list/server/"><i class="fas fa-arrow-left status-icon blue"></i><?=_('Back');?></a>
-			<a href="/edit/server/php/" class="ui-button cancel" dir="ltr"><i class="fas fa-pencil-alt status-icon orange"></i><?=_('Configure');?> PHP</a>
-		</div>
-		<div class="l-unit-toolbar__buttonstrip float-right">
-			<a href="#" class="ui-button" data-action="submit" data-id="vstobjects"><i class="fas fa-save status-icon purple"></i><?=_('Save');?></a>
-		</div>
-	</div>
+  <div class="l-sort clearfix">
+    <div class="l-unit-toolbar__buttonstrip">
+      <a class="ui-button cancel" dir="ltr" id="btn-back" href="/list/server/"><i class="fas fa-arrow-left status-icon blue"></i><?=_('Back');?></a>
+      <a href="/edit/server/php/" class="ui-button cancel" dir="ltr"><i class="fas fa-pencil-alt status-icon orange"></i><?=_('Configure');?> PHP</a>
+    </div>
+    <div class="l-unit-toolbar__buttonstrip float-right">
+      <a href="#" class="ui-button" data-action="submit" data-id="vstobjects"><i class="fas fa-save status-icon purple"></i><?=_('Save');?></a>
+    </div>
+  </div>
 </div>
 <!-- End toolbar -->
 
@@ -16,51 +16,27 @@
 
 <div class="l-center animated fadeIn">
 
-	<form id="vstobjects" name="v_configure_server" method="post">
-		<input type="hidden" name="token" value="<?=$_SESSION['token']?>">
-		<input type="hidden" name="save" value="save">
+  <form id="vstobjects" name="v_configure_server" method="post">
+    <input type="hidden" name="token" value="<?=$_SESSION['token']?>">
+    <input type="hidden" name="save" value="save">
+
+    <div class="app-form">
+      <h1 class="page-title"><?=_('Configuring Server');?>: <?=$v_service_name;?></h1>
+      <?php show_alert_message($_SESSION);?>
+      <div class="u-wide-input-width">
+        <div class="u-mb20">
+          <label for="v_config" class="form-label"><?=$v_config_path;?></label>
+          <textarea class="form-control u-min-height300 u-console" name="v_config" id="v_config"><?=$v_config;?></textarea>
+        </div>
+        <div class="form-check">
+          <input class="form-check-input" type="checkbox" name="v_restart" id="v_restart" checked>
+          <label for="v_restart">
+            <?=_('restart');?>
+          </label>
+        </div>
+      </div>
+    </div>
+
+  </form>
 
-		<table class="data">
-			<tr class="data-add">
-				<td class="data-dotted">
-					<table class="data-col1">
-						<tr>
-							<td></td>
-						</tr>
-					</table>
-				</td>
-				<td class="data-dotted">
-					<table class="data-col2" width="600px">
-						<tr class="u-pt18">
-							<td class="u-pt18">
-								<span class="page-title"><?=_('Configuring Server');?>: <?=$v_service_name;?></span>
-							</td>
-						</tr>
-						<tr>
-							<td>
-								<?php show_error_panel($_SESSION);?>
-							</td>
-						</tr>
-						<tr>
-							<td class="u-pt18">
-								<label for="v_config" class="form-label"><?=$v_config_path;?></label>
-								<textarea class="form-control u-min-height300 u-console" name="v_config" id="v_config"><?=$v_config;?></textarea>
-							</td>
-						</tr>
-						<tr>
-							<td class="u-pt6" style="text-transform: capitalize;">
-								<div class="form-check">
-									<input class="form-check-input" type="checkbox" name="v_restart" id="v_restart" checked>
-									<label for="v_restart">
-										<?=_('restart');?>
-									</label>
-								</div>
-							</td>
-						</tr>
-					</table>
-					<table class="data-col2"></table>
-				</td>
-			</tr>
-		</table>
-	</form>
 </div>

web/templates/pages/edit_server_mysql.html

@@ -1,13 +1,13 @@
 <!-- Begin toolbar -->
 <div class="l-center edit">
-	<div class="l-sort clearfix">
-		<div class="l-unit-toolbar__buttonstrip">
-			<a class="ui-button cancel" dir="ltr" id="btn-back" href="/list/server/"><i class="fas fa-arrow-left status-icon blue"></i><?=_('Back');?></a>
-		</div>
-		<div class="l-unit-toolbar__buttonstrip float-right">
-			<a href="#" class="ui-button" data-action="submit" data-id="vstobjects"><i class="fas fa-save status-icon purple"></i><?=_('Save');?></a>
-		</div>
-	</div>
+  <div class="l-sort clearfix">
+    <div class="l-unit-toolbar__buttonstrip">
+      <a class="ui-button cancel" dir="ltr" id="btn-back" href="/list/server/"><i class="fas fa-arrow-left status-icon blue"></i><?=_('Back');?></a>
+    </div>
+    <div class="l-unit-toolbar__buttonstrip float-right">
+      <a href="#" class="ui-button" data-action="submit" data-id="vstobjects"><i class="fas fa-save status-icon purple"></i><?=_('Save');?></a>
+    </div>
+  </div>
 </div>
 <!-- End toolbar -->
 
@@ -15,94 +15,55 @@
 
 <div class="l-center animated fadeIn">
 
-	<form id="vstobjects" name="v_configure_server" method="post">
-		<input type="hidden" name="token" value="<?=$_SESSION['token']?>">
-		<input type="hidden" name="save" value="save">
+  <form id="vstobjects" name="v_configure_server" method="post">
+    <input type="hidden" name="token" value="<?=$_SESSION['token']?>">
+    <input type="hidden" name="save" value="save">
+
+    <div class="app-form">
+      <h1 class="page-title"><?=_('Configuring Server');?>: <?=$v_service_name;?></h1>
+      <?php show_alert_message($_SESSION);?>
+      <div id="basic-options" class="u-input-width">
+        <div class="u-mb10">
+          <label for="v_max_connections" class="form-label">max_connections</label>
+          <input type="text" class="form-control" regexp="max_connections" prev_value="<?=htmlentities($v_max_connections)?>" name="v_max_connections" id="v_max_connections" value="<?=htmlentities($v_max_connections)?>">
+        </div>
+        <div class="u-mb10">
+          <label for="v_max_user_connections" class="form-label">max_user_connections</label>
+          <input type="text" class="form-control" regexp="max_user_connections" prev_value="<?=htmlentities($v_max_user_connections)?>" name="v_max_user_connections" id="v_max_user_connections" value="<?=htmlentities($v_max_user_connections)?>">
+        </div>
+        <div class="u-mb10">
+          <label for="v_wait_timeout" class="form-label">wait_timeout</label>
+          <input type="text" class="form-control" regexp="wait_timeout" prev_value="<?=htmlentities($v_wait_timeout)?>" name="v_wait_timeout" id="v_wait_timeout" value="<?=htmlentities($v_wait_timeout)?>">
+        </div>
+        <div class="u-mb10">
+          <label for="v_interactive_timeout" class="form-label">interactive_timeout</label>
+          <input type="text" class="form-control" regexp="interactive_timeout" prev_value="<?=htmlentities($v_interactive_timeout)?>" name="v_interactive_timeout" id="v_interactive_timeout" value="<?=htmlentities($v_interactive_timeout)?>">
+        </div>
+        <div class="u-mb20">
+          <label for="v_display_errors" class="form-label">max_allowed_packet</label>
+          <input type="text" class="form-control" regexp="max_allowed_packet" prev_value="<?=htmlentities($v_max_allowed_packet)?>" name="v_display_errors" id="v_display_errors" value="<?=htmlentities($v_max_allowed_packet)?>">
+        </div>
+        <div class="u-mb20">
+          <a href="javascript:toggleOptions();" class="vst-advanced"><?=_('Advanced options');?></a>
+        </div>
+      </div>
+      <div id="advanced-options" class="u-wide-input-width" style="display:<?php if (empty($v_adv)) echo 'none';?> ;">
+        <div class="u-mb20">
+          <a href="javascript:toggleOptions();" class="vst-advanced"><?=_('Basic options');?></a>
+        </div>
+        <div class="u-mb20">
+          <label for="v_config" class="form-label"><?=$v_config_path;?></label>
+          <textarea class="form-control u-min-height300 u-console" name="v_config" id="v_config"><?=$v_config;?></textarea>
+        </div>
+        <div class="form-check">
+          <input class="form-check-input" type="checkbox" name="v_restart" id="v_restart" checked>
+          <label for="v_restart">
+            <?=_('restart');?>
+          </label>
+        </div>
+      </div>
+    </div>
+
+  </form>
 
-		<table class="data">
-			<tr class="data-add">
-				<td class="data-dotted">
-					<table class="data-col1">
-						<tr>
-							<td></td>
-						</tr>
-					</table>
-				</td>
-				<td class="data-dotted">
-					<table class="data-col2" width="600px" id="basic-options">
-						<tr>
-							<td class="u-pt18">
-								<span class="page-title"><?=_('Configuring Server');?>: <?=$v_service_name;?></span>
-							</td>
-						</tr>
-						<tr>
-							<td>
-								<?php show_error_panel($_SESSION);?>
-							</td>
-						</tr>
-						<tr>
-							<td class="u-pt18">
-								<label for="v_max_connections" class="form-label">max_connections</label>
-								<input type="text" class="form-control u-input-width" regexp="max_connections" prev_value="<?=htmlentities($v_max_connections)?>" name="v_max_connections" id="v_max_connections" value="<?=htmlentities($v_max_connections)?>">
-							</td>
-						</tr>
-						<tr>
-							<td class="u-pt18">
-								<label for="v_max_user_connections" class="form-label">max_user_connections</label>
-								<input type="text" class="form-control u-input-width" regexp="max_user_connections" prev_value="<?=htmlentities($v_max_user_connections)?>" name="v_max_user_connections" id="v_max_user_connections" value="<?=htmlentities($v_max_user_connections)?>">
-							</td>
-						</tr>
-						<tr>
-							<td class="u-pt18">
-								<label for="v_wait_timeout" class="form-label">wait_timeout</label>
-								<input type="text" class="form-control u-input-width" regexp="wait_timeout" prev_value="<?=htmlentities($v_wait_timeout)?>" name="v_wait_timeout" id="v_wait_timeout" value="<?=htmlentities($v_wait_timeout)?>">
-							</td>
-						</tr>
-						<tr>
-							<td class="u-pt18">
-								<label for="v_interactive_timeout" class="form-label">interactive_timeout</label>
-								<input type="text" class="form-control u-input-width" regexp="interactive_timeout" prev_value="<?=htmlentities($v_interactive_timeout)?>" name="v_interactive_timeout" id="v_interactive_timeout" value="<?=htmlentities($v_interactive_timeout)?>">
-							</td>
-						</tr>
-						<tr>
-							<td class="u-pt18">
-								<label for="v_display_errors" class="form-label">max_allowed_packet</label>
-								<input type="text" class="form-control u-input-width u-mb20" regexp="max_allowed_packet" prev_value="<?=htmlentities($v_max_allowed_packet)?>" name="v_display_errors" id="v_display_errors" value="<?=htmlentities($v_max_allowed_packet)?>">
-							</td>
-						</tr>
-						<tr>
-						<tr>
-							<td class="u-pt6">
-								<a href="javascript:toggleOptions();" class="vst-advanced"><?=_('Advanced options');?></a>
-							</td>
-						</tr>
-					</table>
-					<table class="data-col2" width="600px" style="display:<?php if (empty($v_adv)) echo 'none';?> ;" id="advanced-options">
-						<tr>
-							<td class="u-pt6">
-								<a href="javascript:toggleOptions();" class="vst-advanced"><?=_('Basic options');?></a>
-							</td>
-						</tr>
-						<tr>
-							<td class="u-pt18">
-								<label for="v_config" class="form-label"><?=$v_config_path;?></label>
-								<textarea class="form-control u-min-height300 u-console" name="v_config" id="v_config"><?=$v_config;?></textarea>
-							</td>
-						</tr>
-						<tr>
-							<td class="u-pt6" style="text-transform: capitalize;">
-								<div class="form-check">
-									<input class="form-check-input" type="checkbox" name="v_restart" id="v_restart" checked>
-									<label for="v_restart">
-										<?=_('restart');?>
-									</label>
-								</div>
-							</td>
-						</tr>
-					</table>
-					<table class="data-col2"></table>
-				</td>
-			</tr>
-		</table>
-	</form>
 </div>

web/templates/pages/edit_server_nginx.html

@@ -1,14 +1,14 @@
 <!-- Begin toolbar -->
 <div class="l-center edit">
-	<div class="l-sort clearfix">
-		<div class="l-unit-toolbar__buttonstrip">
-			<a class="ui-button cancel" dir="ltr" id="btn-back" href="/list/server/"><i class="fas fa-arrow-left status-icon blue"></i><?=_('Back');?></a>
-			<a href="/edit/server/php/" class="ui-button cancel" dir="ltr"><i class="fas fa-pencil-alt status-icon orange"></i> <?=_('Configure');?> PHP</a>
-		</div>
-		<div class="l-unit-toolbar__buttonstrip float-right">
-			<a href="#" class="ui-button" data-action="submit" data-id="vstobjects"><i class="fas fa-save status-icon purple"></i><?=_('Save');?></a>
-		</div>
-	</div>
+  <div class="l-sort clearfix">
+    <div class="l-unit-toolbar__buttonstrip">
+      <a class="ui-button cancel" dir="ltr" id="btn-back" href="/list/server/"><i class="fas fa-arrow-left status-icon blue"></i><?=_('Back');?></a>
+      <a href="/edit/server/php/" class="ui-button cancel" dir="ltr"><i class="fas fa-pencil-alt status-icon orange"></i> <?=_('Configure');?> PHP</a>
+    </div>
+    <div class="l-unit-toolbar__buttonstrip float-right">
+      <a href="#" class="ui-button" data-action="submit" data-id="vstobjects"><i class="fas fa-save status-icon purple"></i><?=_('Save');?></a>
+    </div>
+  </div>
 </div>
 <!-- End toolbar -->
 
@@ -16,125 +16,75 @@
 
 <div class="l-center animated fadeIn">
 
-	<form id="vstobjects" name="v_configure_server" method="post">
-		<input type="hidden" name="token" value="<?=$_SESSION['token']?>">
-		<input type="hidden" name="save" value="save">
+  <form id="vstobjects" name="v_configure_server" method="post">
+    <input type="hidden" name="token" value="<?=$_SESSION['token']?>">
+    <input type="hidden" name="save" value="save">
 
-		<table class="data">
-			<tr class="data-add">
-				<td class="data-dotted">
-					<table class="data-col1">
-						<tr>
-							<td></td>
-						</tr>
-					</table>
-				</td>
-				<td class="data-dotted">
-					<table class="data-col2" width="600px" id="basic-options">
-						<tr>
-							<td class="u-pt18">
-								<span class="page-title"><?=_('Configuring Server');?>: <?=$v_service_name;?></span>
-							</td>
-						</tr>
-						<tr>
-							<td>
-								<?php show_error_panel($_SESSION);?>
-							</td>
-						</tr>
-						<tr>
-							<td class="u-pt18">
-								<label for="v_worker_processes" class="form-label">worker_processes</label>
-								<input type="text" class="form-control u-input-width" regexp="worker_processes" prev_value="<?=htmlentities($v_worker_processes)?>" name="v_worker_processes" id="v_worker_processes" value="<?=htmlentities($v_worker_processes)?>">
-							</td>
-						</tr>
-						<tr>
-							<td class="u-pt18">
-								<label for="v_worker_connections" class="form-label">worker_connections</label>
-								<input type="text" class="form-control u-input-width" regexp="worker_connections" prev_value="<?=htmlentities($v_worker_connections)?>" name="v_worker_connections" id="v_worker_connections" value="<?=htmlentities($v_worker_connections)?>">
-							</td>
-						</tr>
-						<tr>
-							<td class="u-pt18">
-								<label for="v_client_max_body_size" class="form-label">client_max_body_size</label>
-								<input type="text" class="form-control u-input-width" regexp="client_max_body_size" prev_value="<?=htmlentities($v_client_max_body_size)?>" name="v_client_max_body_size" id="v_client_max_body_size" value="<?=htmlentities($v_client_max_body_size)?>">
-							</td>
-						</tr>
-						<tr>
-							<td class="u-pt18">
-								<label for="v_send_timeout" class="form-label">send_timeout</label>
-								<input type="text" class="form-control u-input-width" regexp="send_timeout" prev_value="<?=htmlentities($v_send_timeout)?>" name="v_send_timeout" id="v_send_timeout" value="<?=htmlentities($v_send_timeout)?>">
-							</td>
-						</tr>
-						<tr>
-							<td class="u-pt18">
-								<label for="v_proxy_connect_timeout" class="form-label">proxy_connect_timeout</label>
-								<input type="text" class="form-control u-input-width" regexp="proxy_connect_timeout" prev_value="<?=htmlentities($v_proxy_connect_timeout)?>" name="v_proxy_connect_timeout" id="v_proxy_connect_timeout" value="<?=htmlentities($v_proxy_connect_timeout)?>">
-							</td>
-						</tr>
-						<tr>
-							<td class="u-pt18">
-								<label for="v_proxy_send_timeout" class="form-label">proxy_send_timeout</label>
-								<input type="text" class="form-control u-input-width" regexp="proxy_send_timeout" prev_value="<?=htmlentities($v_proxy_send_timeout)?>" name="v_proxy_send_timeout" id="v_proxy_send_timeout" value="<?=htmlentities($v_proxy_send_timeout)?>">
-							</td>
-						</tr>
-						<tr>
-							<td class="u-pt18">
-								<label for="v_proxy_read_timeout" class="form-label">proxy_read_timeout</label>
-								<input type="text" class="form-control u-input-width" regexp="proxy_read_timeout" prev_value="<?=htmlentities($v_proxy_read_timeout)?>" name="v_proxy_read_timeout" id="v_proxy_read_timeout" value="<?=htmlentities($v_proxy_read_timeout)?>">
-							</td>
-						</tr>
-						<tr>
-							<td class="u-pt18">
-								<label for="v_gzip" class="form-label">gzip</label>
-								<input type="text" class="form-control u-input-width" regexp="gzip" prev_value="<?=htmlentities($v_gzip)?>" name="v_gzip" id="v_gzip" value="<?=htmlentities($v_gzip)?>">
-							</td>
-						</tr>
-						<tr>
-							<td class="u-pt18">
-								<label for="v_gzip_comp_level" class="form-label">gzip_comp_level</label>
-								<input type="text" class="form-control u-input-width" regexp="gzip_comp_level" prev_value="<?=htmlentities($v_gzip_comp_level)?>" name="v_gzip_comp_level" id="v_gzip_comp_level" value="<?=htmlentities($v_gzip_comp_level)?>">
-							</td>
-						</tr>
-						<tr>
-							<td class="u-pt18">
-								<label for="v_charset" class="form-label">charset</label>
-								<input type="text" class="form-control u-input-width u-mb20" regexp="charset" prev_value="<?=htmlentities($v_charset)?>" name="v_charset" id="v_charset" value="<?=htmlentities($v_charset)?>">
-							</td>
-						</tr>
-						<tr>
-							<td class="u-pt6">
-								<a href="javascript:toggleOptions();" class="vst-advanced"><?=_('Advanced options');?></a>
-							</td>
-						</tr>
-					</table>
+    <div class="app-form">
+      <h1 class="page-title"><?=_('Configuring Server');?>: <?=$v_service_name;?></h1>
+      <?php show_alert_message($_SESSION);?>
+      <div id="basic-options" class="u-input-width">
+        <div class="u-mb10">
+          <label for="v_worker_processes" class="form-label">worker_processes</label>
+          <input type="text" class="form-control" regexp="worker_processes" prev_value="<?=htmlentities($v_worker_processes)?>" name="v_worker_processes" id="v_worker_processes" value="<?=htmlentities($v_worker_processes)?>">
+        </div>
+        <div class="u-mb10">
+          <label for="v_worker_connections" class="form-label">worker_connections</label>
+          <input type="text" class="form-control" regexp="worker_connections" prev_value="<?=htmlentities($v_worker_connections)?>" name="v_worker_connections" id="v_worker_connections" value="<?=htmlentities($v_worker_connections)?>">
+        </div>
+        <div class="u-mb10">
+          <label for="v_client_max_body_size" class="form-label">client_max_body_size</label>
+          <input type="text" class="form-control" regexp="client_max_body_size" prev_value="<?=htmlentities($v_client_max_body_size)?>" name="v_client_max_body_size" id="v_client_max_body_size" value="<?=htmlentities($v_client_max_body_size)?>">
+        </div>
+        <div class="u-mb10">
+          <label for="v_send_timeout" class="form-label">send_timeout</label>
+          <input type="text" class="form-control" regexp="send_timeout" prev_value="<?=htmlentities($v_send_timeout)?>" name="v_send_timeout" id="v_send_timeout" value="<?=htmlentities($v_send_timeout)?>">
+        </div>
+        <div class="u-mb10">
+          <label for="v_proxy_connect_timeout" class="form-label">proxy_connect_timeout</label>
+          <input type="text" class="form-control" regexp="proxy_connect_timeout" prev_value="<?=htmlentities($v_proxy_connect_timeout)?>" name="v_proxy_connect_timeout" id="v_proxy_connect_timeout" value="<?=htmlentities($v_proxy_connect_timeout)?>">
+        </div>
+        <div class="u-mb10">
+          <label for="v_proxy_send_timeout" class="form-label">proxy_send_timeout</label>
+          <input type="text" class="form-control" regexp="proxy_send_timeout" prev_value="<?=htmlentities($v_proxy_send_timeout)?>" name="v_proxy_send_timeout" id="v_proxy_send_timeout" value="<?=htmlentities($v_proxy_send_timeout)?>">
+        </div>
+        <div class="u-mb10">
+          <label for="v_proxy_read_timeout" class="form-label">proxy_read_timeout</label>
+          <input type="text" class="form-control" regexp="proxy_read_timeout" prev_value="<?=htmlentities($v_proxy_read_timeout)?>" name="v_proxy_read_timeout" id="v_proxy_read_timeout" value="<?=htmlentities($v_proxy_read_timeout)?>">
+        </div>
+        <div class="u-mb10">
+          <label for="v_gzip" class="form-label">gzip</label>
+          <input type="text" class="form-control" regexp="gzip" prev_value="<?=htmlentities($v_gzip)?>" name="v_gzip" id="v_gzip" value="<?=htmlentities($v_gzip)?>">
+        </div>
+        <div class="u-mb10">
+          <label for="v_gzip_comp_level" class="form-label">gzip_comp_level</label>
+          <input type="text" class="form-control" regexp="gzip_comp_level" prev_value="<?=htmlentities($v_gzip_comp_level)?>" name="v_gzip_comp_level" id="v_gzip_comp_level" value="<?=htmlentities($v_gzip_comp_level)?>">
+        </div>
+        <div class="u-mb20">
+          <label for="v_charset" class="form-label">charset</label>
+          <input type="text" class="form-control" regexp="charset" prev_value="<?=htmlentities($v_charset)?>" name="v_charset" id="v_charset" value="<?=htmlentities($v_charset)?>">
+        </div>
+        <div class="u-mb20">
+          <a href="javascript:toggleOptions();" class="vst-advanced"><?=_('Advanced options');?></a>
+        </div>
+      </div>
+      <div id="advanced-options" class="u-wide-input-width" style="display:<?php if (empty($v_adv)) echo 'none';?> ;">
+        <div class="u-mb20">
+          <a href="javascript:toggleOptions();" class="vst-advanced"><?=_('Basic options');?></a>
+        </div>
+        <div class="u-mb20">
+          <label for="v_config" class="form-label"><?=$v_config_path;?></label>
+          <textarea class="form-control u-min-height300 u-console" name="v_config" id="v_config"><?=$v_config;?></textarea>
+        </div>
+        <div class="form-check">
+          <input class="form-check-input" type="checkbox" name="v_restart" id="v_restart" checked>
+          <label for="v_restart">
+            <?=_('restart');?>
+          </label>
+        </div>
+      </div>
+    </div>
 
-					<table class="data-col2" width="600px" style="display:<?php if (empty($v_adv)) echo 'none';?> ;" id="advanced-options">
-						<tr>
-							<td class="u-pt6">
-								<a href="javascript:toggleOptions();" class="vst-advanced"><?=_('Basic options');?></a>
-							</td>
-						</tr>
-						<tr>
-							<td class="u-pt18">
-								<label for="v_config" class="form-label"><?=$v_config_path;?></label>
-								<textarea class="form-control u-min-height300 u-console" name="v_config" id="v_config"><?=$v_config;?></textarea>
-							</td>
-						</tr>
-						<tr>
-							<td class="u-pt6" style="text-transform: capitalize;">
-								<div class="form-check">
-									<input class="form-check-input" type="checkbox" name="v_restart" id="v_restart" checked>
-									<label for="v_restart">
-										<?=_('restart');?>
-									</label>
-								</div>
-							</td>
-						</tr>
-					</table>
+  </form>
 
-					<table class="data-col2"></table>
-				</td>
-			</tr>
-		</table>
-	</form>
 </div>

web/templates/pages/edit_server_pgsql.html

@@ -1,13 +1,13 @@
 <!-- Begin toolbar -->
 <div class="l-center edit">
-	<div class="l-sort clearfix">
-		<div class="l-unit-toolbar__buttonstrip">
-			<a class="ui-button cancel" dir="ltr" id="btn-back" href="/list/server/"><i class="fas fa-arrow-left status-icon blue"></i><?=_('Back');?></a>
-		</div>
-		<div class="l-unit-toolbar__buttonstrip float-right">
-			<a href="#" class="ui-button" data-action="submit" data-id="vstobjects"><i class="fas fa-save status-icon purple"></i><?=_('Save');?></a>
-		</div>
-	</div>
+  <div class="l-sort clearfix">
+    <div class="l-unit-toolbar__buttonstrip">
+      <a class="ui-button cancel" dir="ltr" id="btn-back" href="/list/server/"><i class="fas fa-arrow-left status-icon blue"></i><?=_('Back');?></a>
+    </div>
+    <div class="l-unit-toolbar__buttonstrip float-right">
+      <a href="#" class="ui-button" data-action="submit" data-id="vstobjects"><i class="fas fa-save status-icon purple"></i><?=_('Save');?></a>
+    </div>
+  </div>
 </div>
 <!-- End toolbar -->
 
@@ -15,56 +15,31 @@
 
 <div class="l-center animated fadeIn">
 
-	<form id="vstobjects" name="v_configure_server" method="post">
-		<input type="hidden" name="token" value="<?=$_SESSION['token']?>">
-		<input type="hidden" name="save" value="save">
+  <form id="vstobjects" name="v_configure_server" method="post">
+    <input type="hidden" name="token" value="<?=$_SESSION['token']?>">
+    <input type="hidden" name="save" value="save">
 
-		<table class="data">
-			<tr class="data-add">
-				<td class="data-dotted">
-					<table class="data-col1">
-						<tr>
-							<td></td>
-						</tr>
-					</table>
-				</td>
-				<td class="data-dotted">
-					<table class="data-col2" width="600px" id="basic-options">
-						<tr>
-							<td class="u-pt18">
-								<span class="page-title"><?=_('Configuring Server');?>: <?=$v_service_name;?></span>
-							</td>
-						</tr>
-						<tr>
-							<td>
-								<?php show_error_panel($_SESSION);?>
-							</td>
-						</tr>
-						<tr>
-							<td class="u-pt18">
-								<label for="v_options" class="form-label"><?=$v_options_path;?></label>
-								<textarea class="form-control u-min-height300 u-console" name="v_options" id="v_options"><?=$v_options;?></textarea>
-							</td>
-						</tr>
-						<tr>
-							<td class="u-pt18">
-								<label for="v_config" class="form-label"><?=$v_config_path;?></label>
-								<textarea class="form-control u-min-height300 u-console" name="v_config" id="v_config"><?=$v_config;?></textarea>
-							</td>
-						</tr>
-						<td class="u-pt6" style="text-transform: capitalize;">
-							<div class="form-check">
-								<input class="form-check-input" type="checkbox" name="v_restart" id="v_restart" checked>
-								<label for="v_restart">
-									<?=_('restart');?>
-								</label>
-							</div>
-						</td>
-					</table>
+    <div class="app-form">
+      <h1 class="page-title"><?=_('Configuring Server');?>: <?=$v_service_name;?></h1>
+      <?php show_alert_message($_SESSION);?>
+      <div class="u-wide-input-width">
+        <div class="u-mb20">
+          <label for="v_options" class="form-label"><?=$v_options_path;?></label>
+          <textarea class="form-control u-min-height300 u-console" name="v_options" id="v_options"><?=$v_options;?></textarea>
+        </div>
+        <div class="u-mb20">
+          <label for="v_config" class="form-label"><?=$v_config_path;?></label>
+          <textarea class="form-control u-min-height300 u-console" name="v_config" id="v_config"><?=$v_config;?></textarea>
+        </div>
+        <div class="form-check">
+          <input class="form-check-input" type="checkbox" name="v_restart" id="v_restart" checked>
+          <label for="v_restart">
+            <?=_('restart');?>
+          </label>
+        </div>
+      </div>
+    </div>
+
+  </form>
 
-					<table class="data-col2"></table>
-				</td>
-			</tr>
-		</table>
-	</form>
 </div>

web/templates/pages/edit_server_php.html

@@ -1,13 +1,13 @@
 <!-- Begin toolbar -->
 <div class="l-center edit">
-	<div class="l-sort clearfix">
-		<div class="l-unit-toolbar__buttonstrip">
-			<a class="ui-button cancel" dir="ltr" id="btn-back" href="/list/server/"><i class="fas fa-arrow-left status-icon blue"></i><?=_('Back');?></a>
-		</div>
-		<div class="l-unit-toolbar__buttonstrip float-right">
-			<a href="#" class="ui-button" data-action="submit" data-id="vstobjects"><i class="fas fa-save status-icon purple"></i><?=_('Save');?></a>
-		</div>
-	</div>
+  <div class="l-sort clearfix">
+    <div class="l-unit-toolbar__buttonstrip">
+      <a class="ui-button cancel" dir="ltr" id="btn-back" href="/list/server/"><i class="fas fa-arrow-left status-icon blue"></i><?=_('Back');?></a>
+    </div>
+    <div class="l-unit-toolbar__buttonstrip float-right">
+      <a href="#" class="ui-button" data-action="submit" data-id="vstobjects"><i class="fas fa-save status-icon purple"></i><?=_('Save');?></a>
+    </div>
+  </div>
 </div>
 <!-- End toolbar -->
 
@@ -15,103 +15,63 @@
 
 <div class="l-center animated fadeIn">
 
-	<form id="vstobjects" name="v_configure_server" method="post">
-		<input type="hidden" name="token" value="<?=$_SESSION['token']?>">
-		<input type="hidden" name="save" value="save">
+  <form id="vstobjects" name="v_configure_server" method="post">
+    <input type="hidden" name="token" value="<?=$_SESSION['token']?>">
+    <input type="hidden" name="save" value="save">
+
+    <div class="app-form">
+      <h1 class="page-title"><?=_('Configuring Server');?>: PHP</h1>
+      <?php show_alert_message($_SESSION);?>
+      <div id="basic-options" class="u-input-width">
+        <div class="u-mb10">
+          <label for="v_max_execution_time" class="form-label">max_execution_time</label>
+          <input type="text" class="form-control" regexp="max_execution_time" prev_value="<?=htmlentities($v_max_execution_time)?>" name="v_max_execution_time" id="v_max_execution_time" value="<?=htmlentities($v_max_execution_time)?>">
+        </div>
+        <div class="u-mb10">
+          <label for="v_worker_connections" class="form-label">max_input_time</label>
+          <input type="text" class="form-control" regexp="max_input_time" prev_value="<?=htmlentities($v_max_input_time)?>" name="v_worker_connections" id="v_worker_connections" value="<?=htmlentities($v_max_input_time)?>">
+        </div>
+        <div class="u-mb10">
+          <label for="v_memory_limit" class="form-label">memory_limit</label>
+          <input type="text" class="form-control" regexp="memory_limit" prev_value="<?=htmlentities($v_memory_limit)?>" name="v_memory_limit" id="v_memory_limit" value="<?=htmlentities($v_memory_limit)?>">
+        </div>
+        <div class="u-mb10">
+          <label for="v_error_reporting" class="form-label">error_reporting</label>
+          <input type="text" class="form-control" regexp="error_reporting" prev_value="<?=htmlentities($v_error_reporting)?>" name="v_error_reporting" id="v_error_reporting" value="<?=htmlentities($v_error_reporting)?>">
+        </div>
+        <div class="u-mb10">
+          <label for="v_display_errors" class="form-label">display_errors</label>
+          <input type="text" class="form-control" regexp="display_errors" prev_value="<?=htmlentities($v_display_errors)?>" name="v_display_errors" id="v_display_errors" value="<?=htmlentities($v_display_errors)?>">
+        </div>
+        <div class="u-mb10">
+          <label for="v_post_max_size" class="form-label">post_max_size</label>
+          <input type="text" class="form-control" regexp="post_max_size" prev_value="<?=htmlentities($v_post_max_size)?>" name="v_post_max_size" id="v_post_max_size" value="<?=htmlentities($v_post_max_size)?>">
+        </div>
+        <div class="u-mb20">
+          <label for="v_upload_max_filesize" class="form-label">upload_max_filesize</label>
+          <input type="text" class="form-control" regexp="upload_max_filesize" prev_value="<?=htmlentities($v_upload_max_filesize)?>" name="v_upload_max_filesize" id="v_upload_max_filesize" value="<?=htmlentities($v_upload_max_filesize)?>">
+        </div>
+        <div class="u-mb20">
+          <a href="javascript:toggleOptions();" class="vst-advanced"><?=_('Advanced options');?></a>
+        </div>
+      </div>
+      <div id="advanced-options" class="u-wide-input-width" style="display:<?php if (empty($v_adv)) echo 'none';?> ;">
+        <div class="u-mb20">
+          <a href="javascript:toggleOptions();" class="vst-advanced"><?=_('Basic options');?></a>
+        </div>
+        <div class="u-mb20">
+          <label for="v_config" class="form-label"><?=$v_config_path;?></label>
+          <textarea class="form-control u-min-height300 u-console" name="v_config" id="v_config"><?=$v_config;?></textarea>
+        </div>
+        <div class="form-check">
+          <input class="form-check-input" type="checkbox" name="v_restart" id="v_restart" checked>
+          <label for="v_restart">
+            <?=_('restart');?>
+          </label>
+        </div>
+      </div>
+    </div>
+
+  </form>
 
-		<table class="data">
-			<tr class="data-add">
-				<td class="data-dotted">
-					<table class="data-col1">
-						<tr>
-							<td></td>
-						</tr>
-					</table>
-				</td>
-				<td class="data-dotted">
-					<table class="data-col2" width="600px" id="basic-options">
-						<tr>
-							<td class="u-pt18">
-								<span class="page-title"><?=_('Configuring Server');?>: PHP</span>
-							</td>
-						</tr>
-						<tr>
-							<td>
-								<?php show_error_panel($_SESSION);?>
-							</td>
-						</tr>
-						<tr>
-							<td class="u-pt18">
-								<label for="v_max_execution_time" class="form-label">max_execution_time</label>
-								<input type="text" class="form-control u-input-width" regexp="max_execution_time" prev_value="<?=htmlentities($v_max_execution_time)?>" name="v_max_execution_time" id="v_max_execution_time" value="<?=htmlentities($v_max_execution_time)?>">
-							</td>
-						</tr>
-						<tr>
-							<td class="u-pt18">
-								<label for="v_worker_connections" class="form-label">max_input_time</label>
-								<input type="text" class="form-control u-input-width" regexp="max_input_time" prev_value="<?=htmlentities($v_max_input_time)?>" name="v_worker_connections" id="v_worker_connections" value="<?=htmlentities($v_max_input_time)?>">
-							</td>
-						</tr>
-						<tr>
-							<td class="u-pt18">
-								<label for="v_memory_limit" class="form-label">memory_limit</label>
-								<input type="text" class="form-control u-input-width" regexp="memory_limit" prev_value="<?=htmlentities($v_memory_limit)?>" name="v_memory_limit" id="v_memory_limit" value="<?=htmlentities($v_memory_limit)?>">
-							</td>
-						</tr>
-						<tr>
-							<td class="u-pt18">
-								<label for="v_error_reporting" class="form-label">error_reporting</label>
-								<input type="text" class="form-control u-input-width" regexp="error_reporting" prev_value="<?=htmlentities($v_error_reporting)?>" name="v_error_reporting" id="v_error_reporting" value="<?=htmlentities($v_error_reporting)?>">
-							</td>
-						</tr>
-						<tr>
-							<td class="u-pt18">
-								<label for="v_display_errors" class="form-label">display_errors</label>
-								<input type="text" class="form-control u-input-width" regexp="display_errors" prev_value="<?=htmlentities($v_display_errors)?>" name="v_display_errors" id="v_display_errors" value="<?=htmlentities($v_display_errors)?>">
-							</td>
-						</tr>
-						<tr>
-							<td class="u-pt18">
-								<label for="v_post_max_size" class="form-label">post_max_size</label>
-								<input type="text" class="form-control u-input-width" regexp="post_max_size" prev_value="<?=htmlentities($v_post_max_size)?>" name="v_post_max_size" id="v_post_max_size" value="<?=htmlentities($v_post_max_size)?>">
-							</td>
-						</tr>
-						<tr>
-							<td class="u-pt18">
-								<label for="v_upload_max_filesize" class="form-label">upload_max_filesize</label>
-								<input type="text" class="form-control u-input-width u-mb20" regexp="upload_max_filesize" prev_value="<?=htmlentities($v_upload_max_filesize)?>" name="v_upload_max_filesize" id="v_upload_max_filesize" value="<?=htmlentities($v_upload_max_filesize)?>">
-							</td>
-						</tr>
-						<tr>
-							<td class="u-pt6">
-								<a href="javascript:toggleOptions();" class="vst-advanced"><?=_('Advanced options');?></a>
-							</td>
-						</tr>
-					</table>
-					<table class="data-col2" width="600px" style="display:<?php if (empty($v_adv)) echo 'none';?> ;" id="advanced-options">
-						<tr>
-							<td class="u-pt6">
-								<a href="javascript:toggleOptions();" class="vst-advanced"><?=_('Basic options');?></a>
-							</td>
-						</tr>
-						<tr>
-							<td class="u-pt18">
-								<label for="v_config" class="form-label"><?=$v_config_path;?></label>
-								<textarea class="form-control u-min-height300 u-console" name="v_config" id="v_config"><?=$v_config;?></textarea>
-							</td>
-						</tr>
-						<td class="u-pt6" style="text-transform: capitalize;">
-							<div class="form-check">
-								<input class="form-check-input" type="checkbox" name="v_restart" id="v_restart" checked>
-								<label for="v_restart">
-									<?=_('restart');?>
-								</label>
-							</div>
-						</td>
-					</table>
-					<table class="data-col2"></table>
-				</td>
-			</tr>
-		</table>
-	</form>
 </div>

web/templates/pages/edit_server_service.html

@@ -1,13 +1,13 @@
 <!-- Begin toolbar -->
 <div class="l-center edit">
-	<div class="l-sort clearfix">
-		<div class="l-unit-toolbar__buttonstrip">
-			<a class="ui-button cancel" dir="ltr" id="btn-back" href="/list/server/"><i class="fas fa-arrow-left status-icon blue"></i><?=_('Back');?></a>
-		</div>
-		<div class="l-unit-toolbar__buttonstrip float-right">
-			<a href="#" class="ui-button" data-action="submit" data-id="vstobjects"><i class="fas fa-save status-icon purple"></i><?=_('Save');?></a>
-		</div>
-	</div>
+  <div class="l-sort clearfix">
+    <div class="l-unit-toolbar__buttonstrip">
+      <a class="ui-button cancel" dir="ltr" id="btn-back" href="/list/server/"><i class="fas fa-arrow-left status-icon blue"></i><?=_('Back');?></a>
+    </div>
+    <div class="l-unit-toolbar__buttonstrip float-right">
+      <a href="#" class="ui-button" data-action="submit" data-id="vstobjects"><i class="fas fa-save status-icon purple"></i><?=_('Save');?></a>
+    </div>
+  </div>
 </div>
 <!-- End toolbar -->
 
@@ -15,51 +15,27 @@
 
 <div class="l-center animated fadeIn">
 
-	<form id="vstobjects" name="v_configure_server" method="post">
-		<input type="hidden" name="token" value="<?=$_SESSION['token']?>">
-		<input type="hidden" name="save" value="save">
+  <form id="vstobjects" name="v_configure_server" method="post">
+    <input type="hidden" name="token" value="<?=$_SESSION['token']?>">
+    <input type="hidden" name="save" value="save">
+
+    <div class="app-form">
+      <h1 class="page-title"><?=_('Configuring Server');?>: <?=$v_service_name;?></h1>
+      <?php show_alert_message($_SESSION);?>
+      <div class="u-wide-input-width">
+        <div class="u-mb20">
+          <label for="v_config" class="form-label"><?=$v_config_path;?></label>
+          <textarea class="form-control u-min-height300 u-console" name="v_config" id="v_config"><?=$v_config;?></textarea>
+        </div>
+        <div class="form-check">
+          <input class="form-check-input" type="checkbox" name="v_restart" id="v_restart" checked>
+          <label for="v_restart">
+            <?=_('restart');?>
+          </label>
+        </div>
+      </div>
+    </div>
+
+  </form>
 
-		<table class="data">
-			<tr class="data-add">
-				<td class="data-dotted">
-					<table class="data-col1">
-						<tr>
-							<td></td>
-						</tr>
-					</table>
-				</td>
-				<td>
-					<table class="data-col2" width="600px">
-						<tr>
-							<td class="u-pt18">
-								<span class="page-title"><?=_('Configuring Server');?>: <?=$v_service_name;?></span>
-							</td>
-						</tr>
-						<tr>
-							<td>
-								<?php show_error_panel($_SESSION);?>
-							</td>
-						</tr>
-						<tr>
-							<td class="u-pt18">
-								<label for="v_config" class="form-label"><?=$v_config_path;?></label>
-								<textarea class="form-control u-min-height300 u-console" name="v_config" id="v_config"><?=$v_config;?></textarea>
-							</td>
-						</tr>
-						<tr>
-							<td class="u-pt6" style="text-transform: capitalize;">
-								<div class="form-check">
-									<input class="form-check-input" type="checkbox" name="v_restart" id="v_restart" checked>
-									<label for="v_restart">
-										<?=_('restart');?>
-									</label>
-								</div>
-							</td>
-						</tr>
-					</table>
-					<table class="data-col2"></table>
-				</td>
-			</tr>
-		</table>
-	</form>
 </div>

web/templates/pages/edit_user.html

@@ -54,7 +54,7 @@
 
     <div class="app-form">
       <h1 class="page-title"><?=_('Editing User');?></h1>
-      <?php show_error_panel($_SESSION);?>
+      <?php show_alert_message($_SESSION);?>
       <div class="u-input-width">
         <div class="u-mb10">
           <label for="v_user" class="form-label"><?=_('Username');?></label>
@@ -198,9 +198,11 @@
               ?>
             </select>
           </div>
-          <a href="javascript:elementHideShow('advanced-opts');" class="vst-advanced"><?=_('Advanced options');?></a>
+          <div class="u-mb20">
+            <a href="javascript:elementHideShow('advanced-opts');" class="vst-advanced"><?=_('Advanced options');?></a>
+          </div>
           <div id="advanced-opts" style="display: none;">
-            <div class="u-mt15 u-mb10">
+            <div class="u-mb10">
               <label for="v_shell" class="form-label"><?=_('SSH Access');?></label>
               <select class="form-select" name="v_shell" id="v_shell">
                 <?php

web/templates/pages/edit_web.html

@@ -29,7 +29,7 @@
 
     <div class="app-form">
       <h1 class="page-title"><?=_('Editing Domain');?></h1>
-      <?php show_error_panel($_SESSION);?>
+      <?php show_alert_message($_SESSION);?>
       <div class="u-input-width">
         <div class="u-mb10">
           <label for="v_domain" class="form-label"><?=_('Domain');?></label>
@@ -86,7 +86,7 @@
         </div>
         <div class="stats-auth">
           <div class="u-pl50">
-            <div style="display:<?php if (empty($v_stats_user)) { echo 'none';} else {echo 'block';}?> ;" id="statstable" name="v-add-web-domain-stats-user">
+            <div id="statstable" name="v-add-web-domain-stats-user" style="display:<?php if (empty($v_stats_user)) { echo 'none';} else {echo 'block';}?> ;">
               <div class="u-mb10">
                 <label for="v_stats_user" class="form-label"><?=_('Username');?></label>
                 <input type="text" class="form-control" name="v_stats_user" id="v_stats_user" value="<?=htmlentities(trim($v_stats_user, "'"))?>">
@@ -108,171 +108,159 @@
             <?=_('Enable domain redirection');?>
           </label>
         </div>
-        <div class="u-pl50 u-mb10">
-          <div style="display:<?php if (empty($v_redirect)) { echo 'none';} else {echo 'block';}?> ;" id="v_redirect">
-            <div class="form-check">
-              <input class="form-check-input v-redirect-custom-value" type="radio" name="v-redirect" id="v-redirect-radio-1" value="<?='www.'.htmlentities($v_domain);?>" <?php if ($v_redirect == "www.".$v_domain) echo 'checked'; ?>>
-              <label for="v-redirect-radio-1">
-                <?=sprintf(_('Redirect visitors to %s'),"www.".htmlentities($v_domain));?>
-              </label>
-            </div>
-            <div class="form-check">
-              <input class="form-check-input v-redirect-custom-value" type="radio" name="v-redirect" id="v-redirect-radio-2" value="<?=htmlentities($v_domain);?>" <?php if( $v_redirect == $v_domain) echo 'checked';?> >
-              <label for="v-redirect-radio-2">
-                <?=sprintf(_('Redirect visitors to %s'),htmlentities($v_domain));?>
-              </label>
-            </div>
-            <div class="form-check">
-              <input class="form-check-input v-redirect-custom-value" type="radio" name="v-redirect" id="v-redirect-radio-3" value="custom" <?php if( !empty($v_redirect_custom)) echo 'checked';?>>
-              <label for="v-redirect-radio-3">
-                <?=_("Redirect visitors to a custom domain or web address");?>
-              </label>
+        <div id="v_redirect" class="u-pl50 u-mb20" style="display:<?php if (empty($v_redirect)) { echo 'none';} else {echo 'block';}?> ;">
+          <div class="form-check">
+            <input class="form-check-input v-redirect-custom-value" type="radio" name="v-redirect" id="v-redirect-radio-1" value="<?='www.'.htmlentities($v_domain);?>" <?php if ($v_redirect == "www.".$v_domain) echo 'checked'; ?>>
+            <label for="v-redirect-radio-1">
+              <?=sprintf(_('Redirect visitors to %s'),"www.".htmlentities($v_domain));?>
+            </label>
+          </div>
+          <div class="form-check">
+            <input class="form-check-input v-redirect-custom-value" type="radio" name="v-redirect" id="v-redirect-radio-2" value="<?=htmlentities($v_domain);?>" <?php if( $v_redirect == $v_domain) echo 'checked';?> >
+            <label for="v-redirect-radio-2">
+              <?=sprintf(_('Redirect visitors to %s'),htmlentities($v_domain));?>
+            </label>
+          </div>
+          <div class="form-check">
+            <input class="form-check-input v-redirect-custom-value" type="radio" name="v-redirect" id="v-redirect-radio-3" value="custom" <?php if( !empty($v_redirect_custom)) echo 'checked';?>>
+            <label for="v-redirect-radio-3">
+              <?=_("Redirect visitors to a custom domain or web address");?>
+            </label>
+          </div>
+          <div id="custom_redirect" style="margin-left: 22px; display:<?php if (empty($v_redirect_custom)) { echo 'none';} else {echo 'block';}?> ;">
+            <div class="u-mt15 u-mb10">
+              <label for="v-redirect-custom" class="form-label"><?=_('Target domain or URL');?></label>
+              <input type="text" class="form-control" name="v-redirect-custom" id="v-redirect-custom" value="<?=$v_redirect_custom;?>">
             </div>
-            <div id="custom_redirect" style="margin-left: 22px; display:<?php if (empty($v_redirect_custom)) { echo 'none';} else {echo 'block';}?> ;">
-              <div class="u-mt15 u-mb10">
-                <label for="v-redirect-custom" class="form-label"><?=_('Target domain or URL');?></label>
-                <input type="text" class="form-control" name="v-redirect-custom" id="v-redirect-custom" value="<?=$v_redirect_custom;?>">
-              </div>
-              <div class="u-mb20">
-                <label for="v-redirect-code" class="form-label"><?=_('Status code');?>:</label>
-                <select class="form-select" name="v-redirect-code" id="v-redirect-code">
-                  <?php foreach ($redirect_code_options as $status_code): ?>
-                  <option value="<?=$status_code;?>"
-                    <?=($v_redirect_code === $status_code || (empty($v_redirect_code) && $status_code === $v_redirect_code))?' selected="selected" ':''; ?>>
-                    <?=$status_code;?>
-                  </option>
-                  <?php endforeach; ?>
-                </select>
-              </div>
+            <div class="u-mb20">
+              <label for="v-redirect-code" class="form-label"><?=_('Status code');?>:</label>
+              <select class="form-select" name="v-redirect-code" id="v-redirect-code">
+                <?php foreach ($redirect_code_options as $status_code): ?>
+                <option value="<?=$status_code;?>"
+                  <?=($v_redirect_code === $status_code || (empty($v_redirect_code) && $status_code === $v_redirect_code))?' selected="selected" ':''; ?>>
+                  <?=$status_code;?>
+                </option>
+                <?php endforeach; ?>
+              </select>
             </div>
           </div>
         </div>
-        <div class="form-check">
+        <div class="form-check u-mb10">
           <input class="form-check-input" type="checkbox" name="v_ssl" id="v_ssl" <?php if ($v_ssl == 'yes') echo 'checked' ?> onclick="javascript:App.Actions.WEB.toggle_ssl(this);">
           <label for="v_ssl">
             <?=_('SSL Support');?>
           </label>
         </div>
-        <div class="u-pl50">
-          <div style="display:<?php if ($v_ssl == 'no' ) { echo 'none';} else {echo 'block';}?> ;" id="ssltable">
-            <div class="u-mt15 u-mb10">
-              <div class="form-check">
-                <input class="form-check-input" type="checkbox" name="v_letsencrypt" id="letsencrypt" <?php if($v_letsencrypt == 'yes' || $v_letsencrypt == 'on') echo 'checked' ?> onclick="elementHideShow('letsinfo');App.Actions.WEB.toggle_letsencrypt(this)">
-                <label for="letsencrypt">
-                  <?=_('Lets Encrypt Support');?>
-                </label>
-              </div>
-            </div>
+        <div id="ssltable" class="u-pl50" style="display:<?php if ($v_ssl == 'no' ) { echo 'none';} else {echo 'block';}?> ;">
+          <div class="form-check u-mb10">
+            <input class="form-check-input" type="checkbox" name="v_letsencrypt" id="letsencrypt" <?php if($v_letsencrypt == 'yes' || $v_letsencrypt == 'on') echo 'checked' ?> onclick="elementHideShow('letsinfo');App.Actions.WEB.toggle_letsencrypt(this)">
+            <label for="letsencrypt">
+              <?=_('Lets Encrypt Support');?>
+            </label>
+          </div>
+          <div class="form-check u-mb10">
+            <input class="form-check-input" type="checkbox" name="v_ssl_forcessl" id="v_ssl_forcessl" <?php if($v_ssl_forcessl == 'yes') echo 'checked' ?> onclick="">
+            <label for="v_ssl_forcessl">
+              <?=_('Force SSL/HTTPS');?>
+            </label>
+          </div>
+          <div class="form-check u-mb20">
+            <input class="form-check-input" type="checkbox" name="v_ssl_hsts" id="ssl_hsts" <?php if($v_ssl_hsts == 'yes') echo 'checked' ?>>
+            <label for="ssl_hsts">
+              <?=_('Enable SSL HSTS');?>
+            </label>
+          </div>
+          <div id="ssl-details" style="<?php if ($v_letsencrypt == 'yes' || $v_letsencrypt == 'on') { echo 'display: none;'; } ?>">
             <div class="u-mb10">
-              <div class="form-check">
-                <input class="form-check-input" type="checkbox" name="v_ssl_forcessl" id="v_ssl_forcessl" <?php if($v_ssl_forcessl == 'yes') echo 'checked' ?> onclick="">
-                <label for="v_ssl_forcessl">
-                  <?=_('Force SSL/HTTPS');?>
-                </label>
-              </div>
+              <label for="ssl_crt" class="form-label">
+                <?=_('SSL Certificate');?>
+                <span id="generate-csr"> / <a class="generate" target="_blank" href="/generate/ssl/?domain=<?=htmlentities($v_domain)?>"><?=_('Generate CSR');?></a></span>
+              </label>
+              <textarea class="form-control u-min-height100 u-console" name="v_ssl_crt" id="ssl_crt"><?=htmlentities(trim($v_ssl_crt, "'"))?></textarea>
             </div>
             <div class="u-mb10">
-              <div class="form-check">
-                <input class="form-check-input" type="checkbox" name="v_ssl_hsts" id="ssl_hsts" <?php if($v_ssl_hsts == 'yes') echo 'checked' ?>>
-                <label for="ssl_hsts">
-                  <?=_('Enable SSL HSTS');?>
-                </label>
-              </div>
+              <label for="v_ssl_key" class="form-label"><?=_('SSL Key');?></label>
+              <textarea class="form-control u-min-height100 u-console" name="v_ssl_key" id="v_ssl_key"><?=htmlentities(trim($v_ssl_key, "'"))?></textarea>
             </div>
-            <div id="ssl-details" style="<?php if ($v_letsencrypt == 'yes' || $v_letsencrypt == 'on') { echo 'display: none;'; } ?>">
-              <div class="u-mb10">
-                <label for="ssl_crt" class="form-label">
-                  <?=_('SSL Certificate');?>
-                  <span id="generate-csr"> / <a class="generate" target="_blank" href="/generate/ssl/?domain=<?=htmlentities($v_domain)?>"><?=_('Generate CSR');?></a></span>
-                </label>
-                <textarea class="form-control u-min-height100 u-console" name="v_ssl_crt" id="ssl_crt"><?=htmlentities(trim($v_ssl_crt, "'"))?></textarea>
-              </div>
-              <div class="u-mb10">
-                <label for="v_ssl_key" class="form-label"><?=_('SSL Key');?></label>
-                <textarea class="form-control u-min-height100 u-console" name="v_ssl_key" id="v_ssl_key"><?=htmlentities(trim($v_ssl_key, "'"))?></textarea>
-              </div>
-              <div class="u-mb10">
-                <label for="v_ssl_ca" class="form-label">
-                  <?=_('SSL Certificate Authority / Intermediate');?> <span class="optional">(<?=_('optional');?>)</span>
-                </label>
-                <textarea class="form-control u-min-height100 u-console" name="v_ssl_ca" id="v_ssl_ca"><?=htmlentities(trim($v_ssl_ca, "'"))?></textarea>
-              </div>
+            <div class="u-mb20">
+              <label for="v_ssl_ca" class="form-label">
+                <?=_('SSL Certificate Authority / Intermediate');?> <span class="optional">(<?=_('optional');?>)</span>
+              </label>
+              <textarea class="form-control u-min-height100 u-console" name="v_ssl_ca" id="v_ssl_ca"><?=htmlentities(trim($v_ssl_ca, "'"))?></textarea>
             </div>
-            <?php if ($v_ssl != 'no' ) { ?>
-              <table class="additional-info">
-                <tr>
-                  <td>
-                    <b><?=_('SUBJECT');?>:</b>
-                  </td>
-                  <td class="details">
-                    <?=$v_ssl_subject?>
-                  </td>
-                </tr>
-                <?php if ($v_ssl_aliases){?>
-                <tr>
-                  <td>
-                    <b><?=_('ALIASES');?>:</b>
-                  </td>
-                  <td class="details">
-                    <?=$v_ssl_aliases?>
-                  </td>
-                </tr>
-                <?php } ?>
-                <tr>
-                  <td>
-                    <b><?=_('NOT_BEFORE');?>:</b>
-                  </td>
-                  <td class="details">
-                    <?=$v_ssl_not_before?>
-                  </td>
-                </tr>
-                <tr>
-                  <td>
-                    <b><?=_('NOT_AFTER');?>:</b>
-                  </td>
-                  <td class="details">
-                    <?=$v_ssl_not_after?>
-                  </td>
-                </tr>
-                <tr>
-                  <td>
-                    <b><?=_('SIGNATURE');?>:</b>
-                  </td>
-                  <td class="details">
-                    <?=$v_ssl_signature?>
-                  </td>
-                </tr>
-                <tr>
-                  <td>
-                    <b><?=_('PUB_KEY');?>:</b>
-                  </td>
-                  <td class="details">
-                    <?=$v_ssl_pub_key?>
-                  </td>
-                </tr>
-                <tr>
-                  <td>
-                    <b><?=_('ISSUER');?>:</b>
-                  </td>
-                  <td class="details">
-                    <?=$v_ssl_issuer?>
-                  </td>
-                </tr>
-                <tr id="letsinfo" style="display:<?php if ($v_letsencrypt == 'yes' || $v_letsencrypt == 'on' ) { echo 'block';} else {echo 'none';} ?>">
-                  <td><a href="#" onclick="elementHideShow('ssl-details'); return false;" class="generate"><?=_('Show Certificate');?></a></td>
-                </tr>
-              </table>
-            <? } // if ssl is enabled ?>
           </div>
+          <?php if ($v_ssl != 'no' ) { ?>
+            <table class="additional-info">
+              <tr>
+                <td>
+                  <b><?=_('SUBJECT');?>:</b>
+                </td>
+                <td class="details">
+                  <?=$v_ssl_subject?>
+                </td>
+              </tr>
+              <?php if ($v_ssl_aliases){?>
+              <tr>
+                <td>
+                  <b><?=_('ALIASES');?>:</b>
+                </td>
+                <td class="details">
+                  <?=$v_ssl_aliases?>
+                </td>
+              </tr>
+              <?php } ?>
+              <tr>
+                <td>
+                  <b><?=_('NOT_BEFORE');?>:</b>
+                </td>
+                <td class="details">
+                  <?=$v_ssl_not_before?>
+                </td>
+              </tr>
+              <tr>
+                <td>
+                  <b><?=_('NOT_AFTER');?>:</b>
+                </td>
+                <td class="details">
+                  <?=$v_ssl_not_after?>
+                </td>
+              </tr>
+              <tr>
+                <td>
+                  <b><?=_('SIGNATURE');?>:</b>
+                </td>
+                <td class="details">
+                  <?=$v_ssl_signature?>
+                </td>
+              </tr>
+              <tr>
+                <td>
+                  <b><?=_('PUB_KEY');?>:</b>
+                </td>
+                <td class="details">
+                  <?=$v_ssl_pub_key?>
+                </td>
+              </tr>
+              <tr>
+                <td>
+                  <b><?=_('ISSUER');?>:</b>
+                </td>
+                <td class="details">
+                  <?=$v_ssl_issuer?>
+                </td>
+              </tr>
+              <tr id="letsinfo" style="display:<?php if ($v_letsencrypt == 'yes' || $v_letsencrypt == 'on' ) { echo 'block';} else {echo 'none';} ?>">
+                <td><a href="#" onclick="elementHideShow('ssl-details'); return false;" class="generate"><?=_('Show Certificate');?></a></td>
+              </tr>
+            </table>
+          <? } // if ssl is enabled ?>
         </div>
-
-        <div class="u-pt18">
+        <div class="u-mt15 u-mb20">
           <a href="javascript:elementHideShow('advanced-opts');" class="vst-advanced"><?=_('Advanced options');?></a>
         </div>
-
         <div id="advanced-opts" style="display: none;">
           <?php if (($_SESSION['userContext'] === 'admin') || ($_SESSION['userContext'] === 'user') && ($_SESSION['POLICY_USER_EDIT_WEB_TEMPLATES'] === 'yes')) { ?>
-            <div class="u-mt15 u-mb10">
+            <div class="u-mb10">
               <label for="v_template" class="form-label">
                 <?=_('Web Template') . "<span class='optional'>" . strtoupper($_SESSION['WEB_SYSTEM']) . "</span>";?>
               </label>
@@ -290,16 +278,14 @@
               </select>
             </div>
             <?php if($_SESSION['WEB_SYSTEM'] == 'nginx'){?>
-              <div class="u-mb10">
-                <div class="form-check">
-                  <input class="form-check-input" type="checkbox" name="v_nginx_cache_check" id="v_nginx_cache_check" <?php if ($v_nginx_cache == 'yes') echo 'checked' ?> onclick="javascript:elementHideShow('v_nginx_duration');">
-                  <label for="v_nginx_cache_check">
-                    <?=_('Enable FastCGI Cache'); ?>
-                    <a href="https://docs.hestiacp.com/admin_docs/web/fastcgi.html#nginx-fastcgi-cache" target="_blank">
-                      <i class="fas fa-question-circle"></i>
-                    </a>
-                  </label>
-                </div>
+              <div class="form-check u-mb10">
+                <input class="form-check-input" type="checkbox" name="v_nginx_cache_check" id="v_nginx_cache_check" <?php if ($v_nginx_cache == 'yes') echo 'checked' ?> onclick="javascript:elementHideShow('v_nginx_duration');">
+                <label for="v_nginx_cache_check">
+                  <?=_('Enable FastCGI Cache'); ?>
+                  <a href="https://docs.hestiacp.com/admin_docs/web/fastcgi.html#nginx-fastcgi-cache" target="_blank">
+                    <i class="fas fa-question-circle"></i>
+                  </a>
+                </label>
               </div>
               <div class="u-pl50">
                 <div id="v_nginx_duration" style="display:<?php if ($v_nginx_cache != 'yes' ) { echo 'none';} else {echo 'block';}?> ;">
@@ -343,7 +329,7 @@
                   </label>
                 </div>
               </div>
-              <div style="display:<?php if (empty($v_proxy)) { echo 'none';} else {echo 'block';}?> ;" id="proxytable">
+              <div id="proxytable" style="display:<?php if (empty($v_proxy)) { echo 'none';} else {echo 'block';}?> ;">
                 <div class="u-mb10">
                   <label for="v_proxy_template" class="form-label"><?=_('Proxy Template');?></label>
                   <select class="form-select" name="v_proxy_template" id="v_proxy_template">
@@ -378,7 +364,7 @@
             </div>
           </div>
           <div class="u-pl50">
-            <div style="display:<?php if (empty($v_custom_doc_root)) { echo 'none';} else {echo 'block';}?> ;" id="v_custom_doc_root">
+            <div id="v_custom_doc_root" style="display:<?php if (empty($v_custom_doc_root)) { echo 'none';} else {echo 'block';}?> ;">
               <div class="u-mb10">
                 <label for="v-custom-doc-domain" class="form-label"><?=_('Point to');?></label>
                 <input type="hidden" name="v-custom-doc-root_prepath" value="<?=$v_custom_doc_root_prepath;?>">
@@ -418,7 +404,7 @@
                 $v_ftp_email    = $ftp_user['v_ftp_email'];
                 $v_ftp_pre_path = $ftp_user['v_ftp_pre_path'];
               ?>
-              <div style="display:<?php if (empty($v_ftp_user)) { echo 'none';} else {echo 'block';}?> ;" class="js-ftp-account js-ftp-account-nrm" name="v_add_domain_ftp">
+              <div class="js-ftp-account js-ftp-account-nrm" name="v_add_domain_ftp" style="display:<?php if (empty($v_ftp_user)) { echo 'none';} else {echo 'block';}?> ;">
                 <div class="u-mb10">
                   <?=_('FTP');?> #<span class="ftp-user-number"><?=$i + 1; ?></span> <a class="ftp-remove-user additional-control" onclick="App.Actions.WEB.remove_ftp_user(this)"><?=_('delete');?></a>
                   <input type="hidden" class="v-ftp-user-deleted" name="v_ftp_user[<?=$i ?>][delete]" value="0">

web/templates/pages/generate_ssl.html

@@ -1,101 +1,69 @@
 <div class="l-center">
-	<div class="l-sort clearfix">
-		<div class="l-sort-toolbar clearfix float-left">
-			<?php show_error_panel($_SESSION);?>
-		</div>
-	</div>
+  <div class="l-sort clearfix">
+    <div class="l-sort-toolbar clearfix float-left">
+      <?php show_alert_message($_SESSION);?>
+    </div>
+  </div>
 </div>
 
 <div class="l-separator"></div>
 
 <div class="l-center animated fadeIn">
 
-	<form id="vstobjects" name="v_generate_csr" method="post">
-		<input type="hidden" name="token" value="<?=$_SESSION['token']?>">
-		<input type="hidden" name="generate" value="generate">
-		<table class="data">
-			<tr class="data-add">
-				<td class="data-dotted">
-					<table class="data-col1">
-						<tr>
-							<td></td>
-						</tr>
-					</table>
-				</td>
-				<td class="data-dotted">
-					<table class="data-col2">
-						<tr>
-							<td class="u-pt18">
-								<span class="page-title"><?=_('Generating CSR');?></span>
-							</td>
-						</tr>
-						<tr>
-							<td class="u-pt18">
-								<label for="v_domain" class="form-label"><?=_('Domain');?></label>
-								<input type="text" class="form-control u-input-width" name="v_domain" id="v_domain" value="<?=htmlentities(trim($v_domain, "'")) ?>">
-							</td>
-						</tr>
-						<tr>
-							<td class="u-pt6">
-								<label for="v_aliases" class="form-label"><?=_('Aliases');?></label>
-								<textarea class="form-control" name="v_aliases" id="v_aliases"><?=htmlentities(trim($v_aliases, "'"))?></textarea>
-							</td>
-						</tr>
-						<tr>
-							<td class="u-pt6">
-								<label for="v_email" class="form-label">
-									<?=_('Email');?>
-									<span class="optional">(<?php print _('optional');?>)</span>
-								</label>
-								<input type="email" class="form-control" name="v_email" id="v_email" value="<?=htmlentities(trim($v_email, "'")) ?>">
-							</td>
-						</tr>
-						<tr>
-							<td class="u-pt6">
-								<label for="v_country" class="form-label">
-									<?=_('Country'); ?>
-									<span class="optional">(<?=_('2 letter code');?>)</span>
-								</label>
-								<input type="text" class="form-control" name="v_country" id="v_country" value="<?=htmlentities(trim($v_country, "'")) ?>">
-							</td>
-						</tr>
-						<tr>
-							<td class="u-pt6">
-								<label for="v_state" class="form-label">
-									<?=_('State / Province');?>
-								</label>
-								<input type="text" class="form-control" name="v_state" id="v_state" value="<?=htmlentities(trim($v_state, "'")) ?>">
-							</td>
-						</tr>
-						<tr>
-							<td class="u-pt6">
-								<label for="v_locality" class="form-label">
-									<?=_('City / Locality');?>
-								</label>
-								<input type="text" class="form-control" name="v_locality" id="v_locality" value="<?=htmlentities(trim($v_locality, "'")) ?>">
-							</td>
-						</tr>
-						<tr>
-							<td class="u-pt6">
-								<label for="v_org" class="form-label">
-									<?=_('Organization');?>
-								</label>
-								<input type="text" class="form-control" name="v_org" id="v_org" value="<?=htmlentities(trim($v_org, "'")) ?>">
-							</td>
-						</tr>
-					</table>
-					<table class="data-col2 u-mb20">
-						<tr>
-							<td style="padding: 24px 0 0 0;" width="116px">
-								<input type="submit" class="button" name="generate" value="<?=_('Ok');?>">
-							</td>
-							<td style="padding: 24px 0 0 0;">
-								<input type="button" class="button cancel" value="<?=_('Back');?>" onclick="<?=$back?>">
-							</td>
-						</tr>
-					</table>
-				</td>
-			</tr>
-		</table>
-	</form>
+  <form id="vstobjects" name="v_generate_csr" method="post">
+    <input type="hidden" name="token" value="<?=$_SESSION['token']?>">
+    <input type="hidden" name="generate" value="generate">
+
+    <div class="app-form">
+      <h1 class="page-title"><?=_('Generating CSR');?></h1>
+      <div class="u-input-width">
+        <div class="u-mb10">
+          <label for="v_domain" class="form-label"><?=_('Domain');?></label>
+          <input type="text" class="form-control" name="v_domain" id="v_domain" value="<?=htmlentities(trim($v_domain, "'")) ?>">
+        </div>
+        <div class="u-mb10">
+          <label for="v_aliases" class="form-label"><?=_('Aliases');?></label>
+          <textarea class="form-control" name="v_aliases" id="v_aliases"><?=htmlentities(trim($v_aliases, "'"))?></textarea>
+        </div>
+        <div class="u-mb10">
+          <label for="v_email" class="form-label">
+            <?=_('Email');?>
+            <span class="optional">(<?php print _('optional');?>)</span>
+          </label>
+          <input type="email" class="form-control" name="v_email" id="v_email" value="<?=htmlentities(trim($v_email, "'")) ?>">
+        </div>
+        <div class="u-mb10">
+          <label for="v_country" class="form-label">
+            <?=_('Country'); ?>
+            <span class="optional">(<?=_('2 letter code');?>)</span>
+          </label>
+          <input type="text" class="form-control" name="v_country" id="v_country" value="<?=htmlentities(trim($v_country, "'")) ?>">
+        </div>
+        <div class="u-mb10">
+          <label for="v_state" class="form-label">
+            <?=_('State / Province');?>
+          </label>
+          <input type="text" class="form-control" name="v_state" id="v_state" value="<?=htmlentities(trim($v_state, "'")) ?>">
+        </div>
+        <div class="u-mb10">
+          <label for="v_locality" class="form-label">
+            <?=_('City / Locality');?>
+          </label>
+          <input type="text" class="form-control" name="v_locality" id="v_locality" value="<?=htmlentities(trim($v_locality, "'")) ?>">
+        </div>
+        <div class="u-mb20">
+          <label for="v_org" class="form-label">
+            <?=_('Organization');?>
+          </label>
+          <input type="text" class="form-control" name="v_org" id="v_org" value="<?=htmlentities(trim($v_org, "'")) ?>">
+        </div>
+        <div class="u-side-by-side">
+          <div><input type="submit" class="button" name="generate" value="<?=_('Ok');?>"></div>
+          <div class="u-ml10"><input type="button" class="button cancel" value="<?=_('Back');?>" onclick="<?=$back?>"></div>
+        </div>
+      </div>
+    </div>
+
+  </form>
+
 </div>

web/templates/pages/list_access_key.html

@@ -28,7 +28,7 @@ if (!empty($_POST['ok'])) {
 
     <div class="app-form">
       <h1 class="page-title"><?= _("Access Key") ?></h1>
-      <?php show_error_panel($_SESSION);?>
+      <?php show_alert_message($_SESSION);?>
       <div class="u-input-width">
         <?php if (!empty($key_data['ACCESS_KEY_ID'])) { ?>
           <div class="u-mt15 u-mb10">

web/templates/pages/list_rrd.html

@@ -19,9 +19,9 @@
 						<div class="timer-container" style="float:right;">
 							<span class="timer-button pause-stop" onclick="stopTimer()"><i class="fas fa-pause"></i></span>
 							<div class="timer-button spinner">
-								  <div class="spinner-inner"></div>
-								  <div class="spinner-mask"></div>
-								  <div class="spinner-mask-two"></div>
+								<div class="spinner-inner"></div>
+								<div class="spinner-mask"></div>
+								<div class="spinner-mask-two"></div>
 							</div>
 						</div>
 					</td>
@@ -36,25 +36,23 @@
 
 <div class="l-center units animated fadeIn">
 	<!-- Begin graph list item loop -->
-	<?php
-		foreach ($data as $key => $value) {
-		?>
+	<?php foreach ($data as $key => $value) { ?>
 		<div class="l-unit l-unit__stats">
 			<div class="l-unit__col l-unit__col--right">
 				<div class="l-unit__name separate">
 					<?= _($data[$key]['TITLE'])?>
 				</div>
 				<div>
-					<a href="/list/rrd/image.php?/rrd/<?=$data[$key]['TYPE']."/".$period."-".$data[$key]['RRD'].".png"?>" target="_blank"><img class="graph-rounded" src="/list/rrd/image.php?/rrd/<?=$data[$key]['TYPE']."/".$period."-".$data[$key]['RRD'].".png"?>"></a>
+					<a href="/list/rrd/image.php?/rrd/<?=$data[$key]['TYPE']."/".$period."-".$data[$key]['RRD'].".png"?>" class="u-block" target="_blank">
+						<img class="graph-rounded" src="/list/rrd/image.php?/rrd/<?=$data[$key]['TYPE']."/".$period."-".$data[$key]['RRD'].".png"?>" alt="">
+					</a>
 				</div>
 			</div>
 		</div>
 	<?php } ?>
-
 </div>
 
 <div id="vstobjects">
 	<div class="l-separator"></div>
-	<div class="l-center">
-	</div>
+	<div class="l-center"></div>
 </div>

web/templates/pages/list_ssl.html

@@ -31,7 +31,7 @@
 							</td>
 						<tr>
 							<td>
-								<?php show_error_panel($_SESSION);?>
+								<?php show_alert_message($_SESSION);?>
 							</td>
 						</tr>
 						</tr>

web/templates/pages/login/login.html

@@ -5,7 +5,7 @@
 				<table>
 					<tr>
 						<td style="padding: 22px 30px 0 42px; height: 280px; width: 170px;">
-							<a href="/"><img src="/images/logo.svg" title="<?=_('Hestia Control Panel');?>" style="margin-top: 70px;"></a>
+							<a href="/" class="u-block"><img src="/images/logo.svg" alt="<?=_('Hestia Control Panel');?>" style="margin-top: 70px;"></a>
 						</td>
 						<td style="padding: 40px 60px 0 0;">
 							<form method="post" action="/login/" id="form_login">

web/templates/pages/login/login_1.html

@@ -5,7 +5,7 @@
 				<table>
 					<tr>
 						<td style="padding: 22px 30px 0 42px; height: 280px; width: 170px;">
-							<a href="/"><img src="/images/logo.svg" title="<?=_('Hestia Control Panel');?>" style="margin-top: 70px;"></a>
+							<a href="/" class="u-block"><img src="/images/logo.svg" alt="<?=_('Hestia Control Panel');?>" style="margin-top: 70px;"></a>
 						</td>
 						<td style="padding: 40px 60px 0 0;" class="animated fadeIn">
 							<form method="post" action="/login/" id="form_login">

web/templates/pages/login/login_2.html

@@ -5,7 +5,7 @@
 				<table>
 					<tr>
 						<td style="padding: 22px 30px 0 42px; height: 280px; width: 170px;">
-							<a href="/"><img src="/images/logo.svg" title="<?=_('Hestia Control Panel');?>" style="margin-top: 70px;"></a>
+							<a href="/" class="u-block"><img src="/images/logo.svg" alt="<?=_('Hestia Control Panel');?>" style="margin-top: 70px;"></a>
 						</td>
 						<td style="padding: 40px 60px 0 0;" class="animated fadeIn">
 							<form method="post" action="/login/" id="form_login">

web/templates/pages/login/login_a.html

@@ -5,7 +5,7 @@
 				<table>
 					<tr>
 						<td style="padding: 22px 30px 0 42px; height: 280px; width: 170px;">
-							<a href="/"><img src="/images/logo.svg" title="<?=_('Hestia Control Panel');?>" style="margin-top: 70px;"></a>
+							<a href="/" class="u-block"><img src="/images/logo.svg" alt="<?=_('Hestia Control Panel');?>" style="margin-top: 70px;"></a>
 						</td>
 						<td style="padding: 40px 60px 0 0;">
 							<form method="post" action="/login/" id="form_login">

web/templates/pages/login/reset2fa.html

@@ -5,7 +5,7 @@
 				<table>
 					<tr>
 						<td style="padding: 22px 30px 0 42px; height: 280px; width: 170px;">
-							<a href="/"><img src="/images/logo.svg" title="<?=_('Hestia Control Panel');?>" style="margin-top: 70px;"></a>
+							<a href="/" class="u-block"><img src="/images/logo.svg" alt="<?=_('Hestia Control Panel');?>" style="margin-top: 70px;"></a>
 						</td>
 						<td style="padding: 40px 60px 0 0;" class="animated fadeIn">
 							<?php if ($success) {?>

web/templates/pages/login/reset_1.html

@@ -5,7 +5,7 @@
 				<table>
 					<tr>
 						<td style="padding: 22px 30px 0 42px; height: 280px; width: 170px;">
-							<a href="/"><img src="/images/logo.svg" title="<?=_('Hestia Control Panel');?>" style="margin-top: 70px;"></a>
+							<a href="/" class="u-block"><img src="/images/logo.svg" alt="<?=_('Hestia Control Panel');?>" style="margin-top: 70px;"></a>
 						</td>
 						<td style="padding: 40px 60px 0 0;" class="animated fadeIn">
 							<form method="post" action="/reset/">

web/templates/pages/login/reset_2.html

@@ -5,7 +5,7 @@
 				<table>
 					<tr>
 						<td style="padding: 22px 30px 0 42px; height: 280px; width: 170px;">
-							<a href="/"><img src="/images/logo.svg" title="<?=_('Hestia Control Panel');?>" style="margin-top: 70px;"></a>
+							<a href="/" class="u-block"><img src="/images/logo.svg" alt="<?=_('Hestia Control Panel');?>" style="margin-top: 70px;"></a>
 						</td>
 						<td style="padding: 40px 60px 0 0;" class="animated fadeIn">
 							<form method="get" action="/reset/">

web/templates/pages/login/reset_3.html

@@ -5,7 +5,7 @@
 				<table>
 					<tr>
 						<td style="padding: 22px 30px 0 42px; height: 280px; width: 170px;">
-							<a href="/"><img src="/images/logo.svg" title="<?=_('Hestia Control Panel');?>" style="margin-top: 70px;"></a>
+							<a href="/" class="u-block"><img src="/images/logo.svg" alt="<?=_('Hestia Control Panel');?>" style="margin-top: 70px;"></a>
 						</td>
 						<td style="padding: 40px 60px 0 0;" class="animated fadeIn">
 							<form method="post">