From a76bf19b9e521b85705bb6a80e621f342f75d8af Mon Sep 17 00:00:00 2001
From: Dennis Eichhorn <spl1nes.com@googlemail.com>
Date: Sun, 18 Apr 2021 22:29:45 +0200
Subject: [PATCH] new form layout and other tpl fixes

---
 Theme/Backend/accounts-list.tpl.php    |   4 +-
 Theme/Backend/groups-list.tpl.php      |   2 +-
 Theme/Backend/modules-list.tpl.php     |   2 +-
 Theme/Backend/settings-general.tpl.php | 859 ++++++++++++++-----------
 4 files changed, 478 insertions(+), 389 deletions(-)

diff --git a/Theme/Backend/accounts-list.tpl.php b/Theme/Backend/accounts-list.tpl.php
index 8e49350..f7d508b 100755
--- a/Theme/Backend/accounts-list.tpl.php
+++ b/Theme/Backend/accounts-list.tpl.php
@@ -33,7 +33,7 @@ echo $this->getData('nav')->render(); ?>
                 <?= $this->getHtml('Accounts'); ?>
                 <?php include __DIR__ . '/../../../../Web/Backend/Themes/popup-export-data.tpl.php'; ?>
             </div>
-            <table id="accountList" class="default">
+            <table id="accountList" class="default sticky">
                 <thead>
                 <template>
 
@@ -48,7 +48,7 @@ echo $this->getData('nav')->render(); ?>
                             <input id="accountList-r1-desc" name="accountList-sort" type="radio">
                             <i class="sort-desc fa fa-chevron-down"></i>
                         </label>
-                        <?php include __DIR__ . '/../../../../Web/Backend/Themes/popup-export-data.tpl.php'; ?>
+                        <?php include __DIR__ . '/../../../../Web/Backend/Themes/popup-filter-table.tpl.php'; ?>
                     <td><?= $this->getHtml('Status'); ?>
                         <label for="accountList-r2-asc">
                             <input id="accountList-r2-asc" name="accountList-sort" type="radio">
diff --git a/Theme/Backend/groups-list.tpl.php b/Theme/Backend/groups-list.tpl.php
index 8bdcba6..4bf3bd7 100755
--- a/Theme/Backend/groups-list.tpl.php
+++ b/Theme/Backend/groups-list.tpl.php
@@ -31,7 +31,7 @@ echo $this->getData('nav')->render(); ?>
     <div class="col-xs-12">
         <div class="portlet">
             <div class="portlet-head"><?= $this->getHtml('Groups'); ?><i class="fa fa-download floatRight download btn"></i></div>
-            <table id="groupList" class="default">
+            <table id="groupList" class="default sticky">
                 <thead>
                     <tr>
                         <td><?= $this->getHtml('ID', '0', '0'); ?>
diff --git a/Theme/Backend/modules-list.tpl.php b/Theme/Backend/modules-list.tpl.php
index d3619f0..100bb0a 100755
--- a/Theme/Backend/modules-list.tpl.php
+++ b/Theme/Backend/modules-list.tpl.php
@@ -28,7 +28,7 @@ $isntalled = $this->getData('isntalled') ?? [];
     <div class="col-xs-12">
         <div class="portlet">
             <div class="portlet-head"><?= $this->getHtml('Modules'); ?><i class="fa fa-download floatRight download btn"></i></div>
-            <table id="moduleList" class="default">
+            <table id="moduleList" class="default sticky">
                 <thead>
                 <tr>
                     <td><?= $this->getHtml('ID', '0', '0'); ?>
diff --git a/Theme/Backend/settings-general.tpl.php b/Theme/Backend/settings-general.tpl.php
index 29216b5..38c8654 100755
--- a/Theme/Backend/settings-general.tpl.php
+++ b/Theme/Backend/settings-general.tpl.php
@@ -57,15 +57,13 @@ $l11n = $this->getData('defaultlocalization') ?? new NullLocalization();
                         <form id="iGeneralSettings" action="<?= UriFactory::build('{/api}admin/settings/general'); ?>" method="post">
                             <div class="portlet-head"><?= $this->getHtml('Settings'); ?></div>
                             <div class="portlet-body">
-                                <table class="layout wf-100">
-                                    <tbody>
-                                        <tr><td><label for="iOname"><?= $this->getHtml('OrganizationName'); ?></label>
-                                        <tr><td>
-                                            <select id="iOname" name="settings_1000000009">
-                                                <?php $unit = UnitMapper::get((int) $generalSettings[1000000009]); ?>
-                                                    <option value="<?= $unit->getId(); ?>"><?= $this->printHtml($unit->name); ?>
-                                            </select>
-                                </table>
+                                <div class="form-group">
+                                    <label for="iOname"><?= $this->getHtml('OrganizationName'); ?></label>
+                                    <select id="iOname" name="settings_1000000009">
+                                        <?php $unit = UnitMapper::get((int) $generalSettings[1000000009]); ?>
+                                            <option value="<?= $unit->getId(); ?>"><?= $this->printHtml($unit->name); ?>
+                                    </select>
+                                </div>
                             </div>
                             <div class="portlet-foot"><input id="iSubmitGeneral" name="submitGeneral" type="submit" value="<?= $this->getHtml('Save', '0', '0'); ?>"></div>
                         </form>
@@ -77,53 +75,82 @@ $l11n = $this->getData('defaultlocalization') ?? new NullLocalization();
                         <form id="iSecuritySettings" action="<?= UriFactory::build('{/api}admin/settings/general'); ?>" method="post">
                             <div class="portlet-head"><?= $this->getHtml('Security'); ?></div>
                             <div class="portlet-body">
-                                <table class="layout wf-100">
-                                    <tbody>
-                                        <tr><td>
-                                            <label for="iPassword"><?= $this->getHtml('PasswordRegex'); ?></label>
-                                            <i class="tooltip" data-tooltip="<?= $this->getHtml('i:PasswordRegex'); ?>"><i class="fa fa-info-circle"></i></i>
-                                        <tr><td><input id="iPassword" name="settings_1000000001" type="text" value="<?= $this->printHtml($generalSettings['1000000001']['content']); ?>" placeholder="&#xf023; ^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[$@$!%*?&;:\(\)\[\]=\{\}\+\-])[A-Za-z\d$@$!%*?&;:\(\)\[\]=\{\}\+\-]{8,}">
-                                        <tr><td>
-                                            <label for="iLoginRetries"><?= $this->getHtml('LoginRetries'); ?></label>
-                                            <i class="tooltip" data-tooltip="<?= $this->getHtml('i:LoginRetries'); ?>"><i class="fa fa-info-circle"></i></i>
-                                        <tr><td><input id="iLoginRetries" name="settings_1000000005" type="number" value="<?= $this->printHtml($generalSettings['1000000005']['content']); ?>" min="-1">
-                                        <tr><td>
-                                            <label for="iTimeoutPeriod"><?= $this->getHtml('TimeoutPeriod'); ?></label>
-                                            <i class="tooltip" data-tooltip="<?= $this->getHtml('i:TimeoutPeriod'); ?>"><i class="fa fa-info-circle"></i></i>
-                                        <tr><td><input id="iTimeoutPeriod" name="settings_1000000002" type="number" value="<?= $this->printHtml($generalSettings['1000000002']['content']); ?>">
-                                        <tr><td>
-                                            <label for="iPasswordChangeInterval"><?= $this->getHtml('PasswordChangeInterval'); ?></label>
-                                            <i class="tooltip" data-tooltip="<?= $this->getHtml('i:PasswordChangeInterval'); ?>"><i class="fa fa-info-circle"></i></i>
-                                        <tr><td><input id="iPasswordChangeInterval" name="settings_1000000003" type="number" value="<?= $this->printHtml($generalSettings['1000000003']['content']); ?>">
-                                        <tr><td>
-                                            <label for="iPasswordHistory"><?= $this->getHtml('PasswordHistory'); ?></label>
-                                            <i class="tooltip" data-tooltip="<?= $this->getHtml('i:PasswordHistory'); ?>"><i class="fa fa-info-circle"></i></i>
-                                        <tr><td><input id="iPasswordHistory" name="settings_1000000004" type="number" value="<?= $this->printHtml($generalSettings['1000000004']['content']); ?>">
-                                </table>
+                                <div class="form-group">
+                                    <label for="iPassword">
+                                        <?= $this->getHtml('PasswordRegex'); ?>
+                                        <i class="tooltip" data-tooltip="<?= $this->getHtml('i:PasswordRegex'); ?>"><i class="fa fa-info-circle"></i></i>
+                                    </label>
+
+                                    <input id="iPassword" name="settings_1000000001" type="text" value="<?= $this->printHtml($generalSettings['1000000001']['content']); ?>" placeholder="&#xf023; ^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[$@$!%*?&;:\(\)\[\]=\{\}\+\-])[A-Za-z\d$@$!%*?&;:\(\)\[\]=\{\}\+\-]{8,}">
+                                </div>
+
+                                <div class="form-group">
+                                    <label for="iLoginRetries">
+                                        <?= $this->getHtml('LoginRetries'); ?>
+                                        <i class="tooltip" data-tooltip="<?= $this->getHtml('i:LoginRetries'); ?>"><i class="fa fa-info-circle"></i></i>
+                                    </label>
+
+                                    <input id="iLoginRetries" name="settings_1000000005" type="number" value="<?= $this->printHtml($generalSettings['1000000005']['content']); ?>" min="-1">
+                                </div>
+
+                                <div class="form-group">
+                                    <label for="iTimeoutPeriod">
+                                        <?= $this->getHtml('TimeoutPeriod'); ?>
+                                        <i class="tooltip" data-tooltip="<?= $this->getHtml('i:TimeoutPeriod'); ?>"><i class="fa fa-info-circle"></i></i>
+                                    </label>
+
+                                    <input id="iTimeoutPeriod" name="settings_1000000002" type="number" value="<?= $this->printHtml($generalSettings['1000000002']['content']); ?>">
+                                </div>
+
+                                <div class="form-group">
+                                    <label for="iPasswordChangeInterval">
+                                        <?= $this->getHtml('PasswordChangeInterval'); ?>
+                                        <i class="tooltip" data-tooltip="<?= $this->getHtml('i:PasswordChangeInterval'); ?>"><i class="fa fa-info-circle"></i></i>
+                                    </label>
+
+                                    <input id="iPasswordChangeInterval" name="settings_1000000003" type="number" value="<?= $this->printHtml($generalSettings['1000000003']['content']); ?>">
+                                </div>
+
+                                <div class="form-group">
+                                    <label for="iPasswordHistory">
+                                        <?= $this->getHtml('PasswordHistory'); ?>
+                                        <i class="tooltip" data-tooltip="<?= $this->getHtml('i:PasswordHistory'); ?>"><i class="fa fa-info-circle"></i></i>
+                                    </label>
+
+                                    <input id="iPasswordHistory" name="settings_1000000004" type="number" value="<?= $this->printHtml($generalSettings['1000000004']['content']); ?>">
+                                </div>
+
+                            </div>
+                            <div class="portlet-foot">
+                                <input id="iSubmitGeneral" name="submitGeneral" type="submit" value="<?= $this->getHtml('Save', '0', '0'); ?>">
                             </div>
-                            <div class="portlet-foot"><input id="iSubmitGeneral" name="submitGeneral" type="submit" value="<?= $this->getHtml('Save', '0', '0'); ?>"></div>
                         </form>
                     </section>
                 </div>
 
                 <div class="col-xs-12 col-md-6">
                     <section class="portlet">
-                        <form id="iLoggingSettings" action="<?= UriFactory::build('{/api}admin/settings/general'); ?>" method="post">
+                        <form id="iLoggingSettings"
+                            action="<?= UriFactory::build('{/api}admin/settings/general'); ?>"
+                            method="post">
                             <div class="portlet-head"><?= $this->getHtml('Logging'); ?></div>
                             <div class="portlet-body">
-                                <table class="layout wf-100">
-                                    <tbody>
-                                        <tr><td>
-                                            <label class="checkbox" for="iLog">
-                                                <input id="iLog" type="checkbox" name="settings_1000000006" value="1">
-                                                <span class="checkmark"></span>
-                                                <?= $this->getHtml('Log'); ?>
-                                            </label>
-                                        <tr><td><label for="iLogPath"><?= $this->getHtml('LogPath'); ?></label>
-                                        <tr><td><input id="iLogPath" name="settings_1000000007" type="text" value="<?= $this->printHtml($generalSettings['1000000007']['content']); ?>" placeholder="&#xf023; /Logs">
-                                </table>
+                                <div class="form-group">
+                                    <label class="checkbox" for="iLog">
+                                        <input id="iLog" type="checkbox" name="settings_1000000006" value="1">
+                                        <span class="checkmark"></span>
+                                        <?= $this->getHtml('Log'); ?>
+                                    </label>
+                                </div>
+
+                                <div class="form-group">
+                                    <label for="iLogPath"><?= $this->getHtml('LogPath'); ?></label>
+                                    <input id="iLogPath" name="settings_1000000007" type="text" value="<?= $this->printHtml($generalSettings['1000000007']['content']); ?>" placeholder="&#xf023; /Logs">
+                                </div>
+                            </div>
+                            <div class="portlet-foot">
+                                <input id="iSubmitGeneral" name="submitGeneral" type="submit" value="<?= $this->getHtml('Save', '0', '0'); ?>">
                             </div>
-                            <div class="portlet-foot"><input id="iSubmitGeneral" name="submitGeneral" type="submit" value="<?= $this->getHtml('Save', '0', '0'); ?>"></div>
                         </form>
                     </section>
                 </div>
@@ -134,45 +161,52 @@ $l11n = $this->getData('defaultlocalization') ?? new NullLocalization();
             <div class="row">
                 <div class="col-xs-12 col-md-4">
                     <div class="portlet">
-                        <form id="fLocalization" name="fLocalization" action="<?= UriFactory::build('{/api}profile/settings/localization'); ?>" method="post">
-                        <div class="portlet-head"><?= $this->getHtml('Localization'); ?></div>
-                        <div class="portlet-body">
-                                <table class="layout wf-100">
-                                    <tbody>
-                                    <tr><td><label for="iDefaultLocalizations"><?= $this->getHtml('Defaults'); ?></label>
-                                    <tr><td>
-                                        <div class="ipt-wrap">
-                                            <div class="ipt-first"><select id="iDefaultLocalizations" name="localization_load">
-                                                    <option selected disabled><?= $this->getHtml('Customized'); ?>
-                                                    <?php foreach ($l11nDefinitions as $def) : ?>
-                                                        <option value="<?= $this->printHtml(\explode('.', $def)[0]); ?>"><?= $this->printHtml(\explode('.', $def)[0]); ?>
-                                                    <?php endforeach; ?>
-                                                </select>
-                                            </div>
-                                            <div class="ipt-second"><input type="submit" name="loadDefaultLocalization" formaction="<?= UriFactory::build('{/api}profile/settings/localization?load=1'); ?>" value="<?= $this->getHtml('Load'); ?>"></div>
+                        <form id="fLocalization"
+                            name="fLocalization"
+                            action="<?= UriFactory::build('{/api}profile/settings/localization'); ?>"
+                            method="post">
+                            <div class="portlet-head"><?= $this->getHtml('Localization'); ?></div>
+                            <div class="portlet-body">
+                                <div class="form-group">
+                                    <label for="iDefaultLocalizations"><?= $this->getHtml('Defaults'); ?></label>
+                                    <div class="ipt-wrap wf-100">
+                                        <div class="ipt-first"><select id="iDefaultLocalizations" name="localization_load">
+                                                <option selected disabled><?= $this->getHtml('Customized'); ?>
+                                                <?php foreach ($l11nDefinitions as $def) : ?>
+                                                    <option value="<?= $this->printHtml(\explode('.', $def)[0]); ?>"><?= $this->printHtml(\explode('.', $def)[0]); ?>
+                                                <?php endforeach; ?>
+                                            </select>
                                         </div>
-                                    <tr><td colspan="2"><label for="iCountries"><?= $this->getHtml('Country'); ?></label>
-                                    <tr><td colspan="2">
-                                            <select id="iCountries" name="settings_country">
-                                                <?php foreach ($countryCodes as $code3 => $code2) : ?>
-                                                <option value="<?= $this->printHtml($code2); ?>"<?= $this->printHtml($code2 === $l11n->getCountry() ? ' selected' : ''); ?>><?= $this->printHtml($countries[$code3]); ?>
-                                                <?php endforeach; ?>
-                                            </select>
-                                    <tr><td colspan="2"><label for="iLanguages"><?= $this->getHtml('Language'); ?></label>
-                                    <tr><td colspan="2">
-                                            <select id="iLanguages" name="settings_language">
-                                                <?php foreach ($languages as $code => $language) : $code = \strtolower(\substr($code, 1)); ?>
-                                                <option value="<?= $this->printHtml($code); ?>"<?= $this->printHtml($code === $l11n->getLanguage() ? ' selected' : ''); ?>><?= $this->printHtml($language); ?>
-                                                <?php endforeach; ?>
-                                            </select>
-                                    <tr><td colspan="2"><label for="iTemperature"><?= $this->getHtml('Temperature'); ?></label>
-                                    <tr><td colspan="2">
-                                            <select id="iTemperature" name="settings_temperature">
-                                                <?php foreach ($temperatures as $temperature) : ?>
-                                                <option value="<?= $this->printHtml($temperature); ?>"<?= $this->printHtml($temperature === $l11n->getTemperature() ? ' selected' : ''); ?>><?= $this->printHtml($temperature); ?>
-                                                <?php endforeach; ?>
-                                            </select>
-                                </table>
+                                        <div class="ipt-second"><input type="submit" name="loadDefaultLocalization" formaction="<?= UriFactory::build('{/api}profile/settings/localization?load=1'); ?>" value="<?= $this->getHtml('Load'); ?>"></div>
+                                    </div>
+                                </div>
+
+                                <div class="form-group">
+                                    <label for="iCountries"><?= $this->getHtml('Country'); ?></label>
+                                    <select id="iCountries" name="settings_country">
+                                        <?php foreach ($countryCodes as $code3 => $code2) : ?>
+                                        <option value="<?= $this->printHtml($code2); ?>"<?= $this->printHtml($code2 === $l11n->getCountry() ? ' selected' : ''); ?>><?= $this->printHtml($countries[$code3]); ?>
+                                        <?php endforeach; ?>
+                                    </select>
+                                </div>
+
+                                <div class="form-group">
+                                    <label for="iLanguages"><?= $this->getHtml('Language'); ?></label>
+                                    <select id="iLanguages" name="settings_language">
+                                        <?php foreach ($languages as $code => $language) : $code = \strtolower(\substr($code, 1)); ?>
+                                        <option value="<?= $this->printHtml($code); ?>"<?= $this->printHtml($code === $l11n->getLanguage() ? ' selected' : ''); ?>><?= $this->printHtml($language); ?>
+                                        <?php endforeach; ?>
+                                    </select>
+                                </div>
+
+                                <div class="form-group">
+                                    <label for="iTemperature"><?= $this->getHtml('Temperature'); ?></label>
+                                    <select id="iTemperature" name="settings_temperature">
+                                        <?php foreach ($temperatures as $temperature) : ?>
+                                        <option value="<?= $this->printHtml($temperature); ?>"<?= $this->printHtml($temperature === $l11n->getTemperature() ? ' selected' : ''); ?>><?= $this->printHtml($temperature); ?>
+                                        <?php endforeach; ?>
+                                    </select>
+                                </div>
                             </div>
                             <div class="portlet-foot">
                                 <input id="iSubmitLocalization" name="submitLocalization" type="submit" value="<?= $this->getHtml('Save', '0', '0'); ?>">
@@ -185,29 +219,41 @@ $l11n = $this->getData('defaultlocalization') ?? new NullLocalization();
                     <div class="portlet">
                         <div class="portlet-head"><?= $this->getHtml('Time'); ?></div>
                         <div class="portlet-body">
-                            <form>
-                            <table class="layout wf-100">
-                                <tbody>
-                                <tr><td><label for="iTimezones"><?= $this->getHtml('Timezone'); ?></label>
-                                <tr><td>
-                                        <select form="fLocalization" id="iTimezones" name="settings_timezone">
-                                            <?php foreach ($timezones as $timezone) : ?>
-                                            <option value="<?= $this->printHtml($timezone); ?>"<?= $this->printHtml($timezone === $l11n->getTimezone() ? ' selected' : ''); ?>><?= $this->printHtml($timezone); ?>
-                                            <?php endforeach; ?>
-                                        </select>
-                                <tr><td><h2><?= $this->getHtml('Timeformat'); ?></h2>
-                                <tr><td><label for="iTimeformatVeryShort"><?= $this->getHtml('VeryShort'); ?></label>
-                                <tr><td><input form="fLocalization" id="iTimeformatVeryShort" name="settings_timeformat_vs" type="text" value="<?= $this->printHtml($l11n->getDatetime()['very_short']); ?>" placeholder="Y" required>
-                                <tr><td><label for="iTimeformatShort"><?= $this->getHtml('Short'); ?></label>
-                                <tr><td><input form="fLocalization" id="iTimeformatShort" name="settings_timeformat_s" type="text" value="<?= $this->printHtml($l11n->getDatetime()['short']); ?>" placeholder="Y" required>
-                                <tr><td><label for="iTimeformatMedium"><?= $this->getHtml('Medium'); ?></label>
-                                <tr><td><input form="fLocalization" id="iTimeformatMedium" name="settings_timeformat_m" type="text" value="<?= $this->printHtml($l11n->getDatetime()['medium']); ?>" placeholder="Y" required>
-                                <tr><td><label for="iTimeformatLong"><?= $this->getHtml('Long'); ?></label>
-                                <tr><td><input form="fLocalization" id="iTimeformatLong" name="settings_timeformat_l" type="text" value="<?= $this->printHtml($l11n->getDatetime()['long']); ?>" placeholder="Y" required>
-                                <tr><td><label for="iTimeformatVeryLong"><?= $this->getHtml('VeryLong'); ?></label>
-                                <tr><td><input form="fLocalization" id="iTimeformatVeryLong" name="settings_timeformat_vl" type="text" value="<?= $this->printHtml($l11n->getDatetime()['very_long']); ?>" placeholder="Y" required>
-                            </table>
-                            </form>
+                            <div class="form-group">
+                                <label for="iTimezones"><?= $this->getHtml('Timezone'); ?></label>
+                                <select form="fLocalization" id="iTimezones" name="settings_timezone">
+                                    <?php foreach ($timezones as $timezone) : ?>
+                                    <option value="<?= $this->printHtml($timezone); ?>"<?= $this->printHtml($timezone === $l11n->getTimezone() ? ' selected' : ''); ?>><?= $this->printHtml($timezone); ?>
+                                    <?php endforeach; ?>
+                                </select>
+                            </div>
+
+                            <div class="form-group">
+                                <label for="iTimeformatVeryShort"><?= $this->getHtml('VeryShort'); ?></label>
+                                <input form="fLocalization" id="iTimeformatVeryShort" name="settings_timeformat_vs" type="text" value="<?= $this->printHtml($l11n->getDatetime()['very_short']); ?>" placeholder="Y" required>
+                            </div>
+
+                            <h2><?= $this->getHtml('Timeformat'); ?></h2>
+
+                            <div class="form-group">
+                                <label for="iTimeformatShort"><?= $this->getHtml('Short'); ?></label>
+                                <input form="fLocalization" id="iTimeformatShort" name="settings_timeformat_s" type="text" value="<?= $this->printHtml($l11n->getDatetime()['short']); ?>" placeholder="Y" required>
+                            </div>
+
+                            <div class="form-group">
+                                <label for="iTimeformatMedium"><?= $this->getHtml('Medium'); ?></label>
+                                <input form="fLocalization" id="iTimeformatMedium" name="settings_timeformat_m" type="text" value="<?= $this->printHtml($l11n->getDatetime()['medium']); ?>" placeholder="Y" required>
+                            </div>
+
+                            <div class="form-group">
+                                <label for="iTimeformatLong"><?= $this->getHtml('Long'); ?></label>
+                                <input form="fLocalization" id="iTimeformatLong" name="settings_timeformat_l" type="text" value="<?= $this->printHtml($l11n->getDatetime()['long']); ?>" placeholder="Y" required>
+                            </div>
+
+                            <div class="form-group">
+                                <label for="iTimeformatVeryLong"><?= $this->getHtml('VeryLong'); ?></label>
+                                <input form="fLocalization" id="iTimeformatVeryLong" name="settings_timeformat_vl" type="text" value="<?= $this->printHtml($l11n->getDatetime()['very_long']); ?>" placeholder="Y" required>
+                            </div>
                         </div>
                     </div>
                 </div>
@@ -216,28 +262,36 @@ $l11n = $this->getData('defaultlocalization') ?? new NullLocalization();
                     <div class="portlet">
                         <div class="portlet-head"><?= $this->getHtml('Numeric'); ?></div>
                         <div class="portlet-body">
-                            <form>
-                            <table class="layout wf-100">
-                                        <tr><td colspan="2"><label for="iCurrencies"><?= $this->getHtml('Currency'); ?></label>
-                                    <tr><td colspan="2">
-                                            <select form="fLocalization" id="iCurrencies" name="settings_currency">
-                                                <?php foreach ($currencies as $code => $currency) : $code = \substr($code, 1); ?>
-                                                <option value="<?= $this->printHtml($code); ?>"<?= $this->printHtml($code === $l11n->getCurrency() ? ' selected' : ''); ?>><?= $this->printHtml($currency); ?>
-                                                    <?php endforeach; ?>
-                                            </select>
-                                    <tr><td colspan="2"><label><?= $this->getHtml('Currencyformat'); ?></label>
-                                    <tr><td colspan="2">
-                                            <select form="fLocalization" name="settings_currencyformat">
-                                                <option value="0"<?= $this->printHtml('0' === $l11n->getCurrencyFormat() ? ' selected' : ''); ?>><?= $this->getHtml('Amount') , ' ' , $this->printHtml($l11n->getCurrency()); ?>
-                                                <option value="1"<?= $this->printHtml('1' === $l11n->getCurrencyFormat() ? ' selected' : ''); ?>><?= $this->printHtml($l11n->getCurrency()) , ' ' , $this->getHtml('Amount'); ?>
-                                            </select>
-                                    <tr><td colspan="2"><h2><?= $this->getHtml('Numberformat'); ?></h2>
-                                    <tr><td><label for="iDecimalPoint"><?= $this->getHtml('DecimalPoint'); ?></label>
-                                        <td><label for="iThousandSep"><?= $this->getHtml('ThousandsSeparator'); ?></label>
-                                    <tr><td><input form="fLocalization" id="iDecimalPoint" name="settings_decimal" type="text" value="<?= $this->printHtml($l11n->getDecimal()); ?>" placeholder="." required>
-                                        <td><input form="fLocalization" id="iThousandSep" name="settings_thousands" type="text" value="<?= $this->printHtml($l11n->getThousands()); ?>" placeholder="," required>
-                                </table>
-                            </form>
+                            <div class="form-group">
+                                <label for="iCurrencies"><?= $this->getHtml('Currency'); ?></label>
+                                <select form="fLocalization" id="iCurrencies" name="settings_currency">
+                                    <?php foreach ($currencies as $code => $currency) : $code = \substr($code, 1); ?>
+                                    <option value="<?= $this->printHtml($code); ?>"<?= $this->printHtml($code === $l11n->getCurrency() ? ' selected' : ''); ?>><?= $this->printHtml($currency); ?>
+                                        <?php endforeach; ?>
+                                </select>
+                            </div>
+
+                            <div class="form-group">
+                                <label><?= $this->getHtml('Currencyformat'); ?></label>
+                                <select form="fLocalization" name="settings_currencyformat">
+                                    <option value="0"<?= $this->printHtml('0' === $l11n->getCurrencyFormat() ? ' selected' : ''); ?>><?= $this->getHtml('Amount') , ' ' , $this->printHtml($l11n->getCurrency()); ?>
+                                    <option value="1"<?= $this->printHtml('1' === $l11n->getCurrencyFormat() ? ' selected' : ''); ?>><?= $this->printHtml($l11n->getCurrency()) , ' ' , $this->getHtml('Amount'); ?>
+                                </select>
+                            </div>
+
+                            <h2><?= $this->getHtml('Numberformat'); ?></h2>
+
+                            <div class="form-group">
+                                <div class="input-control">
+                                    <label for="iDecimalPoint"><?= $this->getHtml('DecimalPoint'); ?></label>
+                                    <input form="fLocalization" id="iDecimalPoint" name="settings_decimal" type="text" value="<?= $this->printHtml($l11n->getDecimal()); ?>" placeholder="." required>
+                                </div>
+
+                                <div class="input-control">
+                                    <label for="iThousandSep"><?= $this->getHtml('ThousandsSeparator'); ?></label>
+                                    <input form="fLocalization" id="iThousandSep" name="settings_thousands" type="text" value="<?= $this->printHtml($l11n->getThousands()); ?>" placeholder="," required>
+                                </div>
+                            </div>
                         </div>
                     </div>
                 </div>
@@ -246,26 +300,30 @@ $l11n = $this->getData('defaultlocalization') ?? new NullLocalization();
                     <div class="portlet">
                         <div class="portlet-head"><?= $this->getHtml('Precision'); ?></div>
                         <div class="portlet-body">
-                            <form>
-                                <table class="layout wf-100">
-                                    <tbody>
-                                    <tr><td><label for="iPrecisionVeryShort"><?= $this->getHtml('VeryShort'); ?></label>
-                                    <tr><td>
-                                        <input form="fLocalization" id="iPrecisionVeryShort" name="settings_precision_vs" value="<?= $l11n->getPrecision()['very_short']; ?>" type="number">
-                                    <tr><td><label for="iPrecisionShort"><?= $this->getHtml('Short'); ?></label>
-                                    <tr><td>
-                                        <input form="fLocalization" id="iPrecisionLight" name="settings_precision_s" value="<?= $l11n->getPrecision()['short']; ?>" type="number">
-                                    <tr><td><label for="iPrecisionMedium"><?= $this->getHtml('Medium'); ?></label>
-                                    <tr><td>
-                                        <input form="fLocalization" id="iPrecisionMedium" name="settings_precision_m" value="<?= $l11n->getPrecision()['medium']; ?>" type="number">
-                                    <tr><td><label for="iPrecisionLong"><?= $this->getHtml('Long'); ?></label>
-                                    <tr><td>
-                                        <input form="fLocalization" id="iPrecisionLong" name="settings_precision_l" value="<?= $l11n->getPrecision()['long']; ?>" type="number">
-                                    <tr><td><label for="iPrecisionVeryLong"><?= $this->getHtml('VeryLong'); ?></label>
-                                    <tr><td>
-                                        <input form="fLocalization" id="iPrecisionVeryLong" name="settings_precision_vl" value="<?= $l11n->getPrecision()['very_long']; ?>" type="number">
-                                </table>
-                            </form>
+                            <div class="form-group">
+                                <label for="iPrecisionVeryShort"><?= $this->getHtml('VeryShort'); ?></label>
+                                <input form="fLocalization" id="iPrecisionVeryShort" name="settings_precision_vs" value="<?= $l11n->getPrecision()['very_short']; ?>" type="number">
+                            </div>
+
+                            <div class="form-group">
+                                <label for="iPrecisionShort"><?= $this->getHtml('Short'); ?></label>
+                                <input form="fLocalization" id="iPrecisionLight" name="settings_precision_s" value="<?= $l11n->getPrecision()['short']; ?>" type="number">
+                            </div>
+
+                            <div class="form-group">
+                                <label for="iPrecisionMedium"><?= $this->getHtml('Medium'); ?></label>
+                                <input form="fLocalization" id="iPrecisionMedium" name="settings_precision_m" value="<?= $l11n->getPrecision()['medium']; ?>" type="number">
+                            </div>
+
+                            <div class="form-group">
+                                <label for="iPrecisionLong"><?= $this->getHtml('Long'); ?></label>
+                                <input form="fLocalization" id="iPrecisionLong" name="settings_precision_l" value="<?= $l11n->getPrecision()['long']; ?>" type="number">
+                            </div>
+
+                            <div class="form-group">
+                                <label for="iPrecisionVeryLong"><?= $this->getHtml('VeryLong'); ?></label>
+                                <input form="fLocalization" id="iPrecisionVeryLong" name="settings_precision_vl" value="<?= $l11n->getPrecision()['very_long']; ?>" type="number">
+                            </div>
                         </div>
                     </div>
                 </div>
@@ -274,46 +332,50 @@ $l11n = $this->getData('defaultlocalization') ?? new NullLocalization();
                     <div class="portlet">
                         <div class="portlet-head"><?= $this->getHtml('Weight'); ?></div>
                         <div class="portlet-body">
-                            <form>
-                                <table class="layout wf-100">
-                                    <tbody>
-                                    <tr><td><label for="iWeightVeryLight"><?= $this->getHtml('VeryLight'); ?></label>
-                                    <tr><td>
-                                        <select form="fLocalization" id="iWeightVeryLight" name="settings_weight_vl">
-                                            <?php foreach ($weights as $code => $weight) : ?>
-                                            <option value="<?= $this->printHtml($weight); ?>"<?= $this->printHtml($weight === $l11n->getWeight()['very_light'] ? ' selected' : ''); ?>><?= $this->printHtml($weight); ?>
-                                            <?php endforeach; ?>
-                                        </select>
-                                    <tr><td><label for="iWeightLight"><?= $this->getHtml('Light'); ?></label>
-                                    <tr><td>
-                                        <select form="fLocalization" id="iWeightLight" name="settings_weight_l">
-                                            <?php foreach ($weights as $code => $weight) : ?>
-                                            <option value="<?= $this->printHtml($weight); ?>"<?= $this->printHtml($weight === $l11n->getWeight()['light'] ? ' selected' : ''); ?>><?= $this->printHtml($weight); ?>
-                                            <?php endforeach; ?>
-                                        </select>
-                                    <tr><td><label for="iWeightMedium"><?= $this->getHtml('Medium'); ?></label>
-                                    <tr><td>
-                                        <select form="fLocalization" id="iWeightMedium" name="settings_weight_m">
-                                            <?php foreach ($weights as $code => $weight) : ?>
-                                            <option value="<?= $this->printHtml($weight); ?>"<?= $this->printHtml($weight === $l11n->getWeight()['medium'] ? ' selected' : ''); ?>><?= $this->printHtml($weight); ?>
-                                            <?php endforeach; ?>
-                                        </select>
-                                    <tr><td><label for="iWeightHeavy"><?= $this->getHtml('Heavy'); ?></label>
-                                    <tr><td>
-                                        <select form="fLocalization" id="iWeightHeavy" name="settings_weight_h">
-                                            <?php foreach ($weights as $code => $weight) : ?>
-                                            <option value="<?= $this->printHtml($weight); ?>"<?= $this->printHtml($weight === $l11n->getWeight()['heavy'] ? ' selected' : ''); ?>><?= $this->printHtml($weight); ?>
-                                            <?php endforeach; ?>
-                                        </select>
-                                    <tr><td><label for="iWeightVeryHeavy"><?= $this->getHtml('VeryHeavy'); ?></label>
-                                    <tr><td>
-                                        <select form="fLocalization" id="iWeightVeryHeavy" name="settings_weight_vh">
-                                            <?php foreach ($weights as $code => $weight) : ?>
-                                            <option value="<?= $this->printHtml($weight); ?>"<?= $this->printHtml($weight === $l11n->getWeight()['very_heavy'] ? ' selected' : ''); ?>><?= $this->printHtml($weight); ?>
-                                            <?php endforeach; ?>
-                                        </select>
-                                </table>
-                            </form>
+                            <div class="form-group">
+                                <label for="iWeightVeryLight"><?= $this->getHtml('VeryLight'); ?></label>
+                                <select form="fLocalization" id="iWeightVeryLight" name="settings_weight_vl">
+                                    <?php foreach ($weights as $code => $weight) : ?>
+                                    <option value="<?= $this->printHtml($weight); ?>"<?= $this->printHtml($weight === $l11n->getWeight()['very_light'] ? ' selected' : ''); ?>><?= $this->printHtml($weight); ?>
+                                    <?php endforeach; ?>
+                                </select>
+                            </div>
+
+                            <div class="form-group">
+                                <label for="iWeightLight"><?= $this->getHtml('Light'); ?></label>
+                                <select form="fLocalization" id="iWeightLight" name="settings_weight_l">
+                                    <?php foreach ($weights as $code => $weight) : ?>
+                                    <option value="<?= $this->printHtml($weight); ?>"<?= $this->printHtml($weight === $l11n->getWeight()['light'] ? ' selected' : ''); ?>><?= $this->printHtml($weight); ?>
+                                    <?php endforeach; ?>
+                                </select>
+                            </div>
+
+                            <div class="form-group">
+                                <label for="iWeightMedium"><?= $this->getHtml('Medium'); ?></label>
+                                <select form="fLocalization" id="iWeightMedium" name="settings_weight_m">
+                                    <?php foreach ($weights as $code => $weight) : ?>
+                                    <option value="<?= $this->printHtml($weight); ?>"<?= $this->printHtml($weight === $l11n->getWeight()['medium'] ? ' selected' : ''); ?>><?= $this->printHtml($weight); ?>
+                                    <?php endforeach; ?>
+                                </select>
+                            </div>
+
+                            <div class="form-group">
+                                <label for="iWeightHeavy"><?= $this->getHtml('Heavy'); ?></label>
+                                <select form="fLocalization" id="iWeightHeavy" name="settings_weight_h">
+                                    <?php foreach ($weights as $code => $weight) : ?>
+                                    <option value="<?= $this->printHtml($weight); ?>"<?= $this->printHtml($weight === $l11n->getWeight()['heavy'] ? ' selected' : ''); ?>><?= $this->printHtml($weight); ?>
+                                    <?php endforeach; ?>
+                                </select>
+                            </div>
+
+                            <div class="form-group">
+                                <label for="iWeightVeryHeavy"><?= $this->getHtml('VeryHeavy'); ?></label>
+                                <select form="fLocalization" id="iWeightVeryHeavy" name="settings_weight_vh">
+                                    <?php foreach ($weights as $code => $weight) : ?>
+                                    <option value="<?= $this->printHtml($weight); ?>"<?= $this->printHtml($weight === $l11n->getWeight()['very_heavy'] ? ' selected' : ''); ?>><?= $this->printHtml($weight); ?>
+                                    <?php endforeach; ?>
+                                </select>
+                            </div>
                         </div>
                     </div>
                 </div>
@@ -322,53 +384,59 @@ $l11n = $this->getData('defaultlocalization') ?? new NullLocalization();
                     <div class="portlet">
                         <div class="portlet-head"><?= $this->getHtml('Speed'); ?></div>
                         <div class="portlet-body">
-                            <form>
-                                <table class="layout wf-100">
-                                    <tbody>
-                                    <tr><td><label for="iSpeedVerySlow"><?= $this->getHtml('VerySlow'); ?></label>
-                                    <tr><td>
-                                        <select form="fLocalization" id="iSpeedVerySlow" name="settings_speed_vs">
-                                            <?php foreach ($speeds as $code => $speed) : ?>
-                                            <option value="<?= $this->printHtml($speed); ?>"<?= $this->printHtml($speed === $l11n->getSpeed()['very_slow'] ? ' selected' : ''); ?>><?= $this->printHtml($speed); ?>
-                                            <?php endforeach; ?>
-                                        </select>
-                                    <tr><td><label for="iSpeedSlow"><?= $this->getHtml('Slow'); ?></label>
-                                    <tr><td>
-                                        <select form="fLocalization" id="iSpeedSlow" name="settings_speed_s">
-                                            <?php foreach ($speeds as $code => $speed) : ?>
-                                            <option value="<?= $this->printHtml($speed); ?>"<?= $this->printHtml($speed === $l11n->getSpeed()['slow'] ? ' selected' : ''); ?>><?= $this->printHtml($speed); ?>
-                                            <?php endforeach; ?>
-                                        </select>
-                                    <tr><td><label for="iSpeedMedium"><?= $this->getHtml('Medium'); ?></label>
-                                    <tr><td>
-                                        <select form="fLocalization" id="iSpeedMedium" name="settings_speed_m">
-                                            <?php foreach ($speeds as $code => $speed) : ?>
-                                            <option value="<?= $this->printHtml($speed); ?>"<?= $this->printHtml($speed === $l11n->getSpeed()['medium'] ? ' selected' : ''); ?>><?= $this->printHtml($speed); ?>
-                                            <?php endforeach; ?>
-                                        </select>
-                                    <tr><td><label for="iSpeedFast"><?= $this->getHtml('Fast'); ?></label>
-                                    <tr><td>
-                                        <select form="fLocalization" id="iSpeedFast" name="settings_speed_f">
-                                            <?php foreach ($speeds as $code => $speed) : ?>
-                                            <option value="<?= $this->printHtml($speed); ?>"<?= $this->printHtml($speed === $l11n->getSpeed()['fast'] ? ' selected' : ''); ?>><?= $this->printHtml($speed); ?>
-                                            <?php endforeach; ?>
-                                        </select>
-                                    <tr><td><label for="iSpeedVeryFast"><?= $this->getHtml('VeryFast'); ?></label>
-                                    <tr><td>
-                                        <select form="fLocalization" id="iSpeedVeryFast" name="settings_speed_vf">
-                                            <?php foreach ($speeds as $code => $speed) : ?>
-                                            <option value="<?= $this->printHtml($speed); ?>"<?= $this->printHtml($speed === $l11n->getSpeed()['very_fast'] ? ' selected' : ''); ?>><?= $this->printHtml($speed); ?>
-                                            <?php endforeach; ?>
-                                        </select>
-                                    <tr><td><label for="iSpeedSea"><?= $this->getHtml('Sea'); ?></label>
-                                    <tr><td>
-                                        <select form="fLocalization" id="iSpeedSea" name="settings_speed_sea">
-                                            <?php foreach ($speeds as $code => $speed) : ?>
-                                            <option value="<?= $this->printHtml($speed); ?>"<?= $this->printHtml($speed === $l11n->getSpeed()['sea'] ? ' selected' : ''); ?>><?= $this->printHtml($speed); ?>
-                                            <?php endforeach; ?>
-                                        </select>
-                                </table>
-                            </form>
+                            <div class="form-group">
+                                <label for="iSpeedVerySlow"><?= $this->getHtml('VerySlow'); ?></label>
+                                <select form="fLocalization" id="iSpeedVerySlow" name="settings_speed_vs">
+                                    <?php foreach ($speeds as $code => $speed) : ?>
+                                    <option value="<?= $this->printHtml($speed); ?>"<?= $this->printHtml($speed === $l11n->getSpeed()['very_slow'] ? ' selected' : ''); ?>><?= $this->printHtml($speed); ?>
+                                    <?php endforeach; ?>
+                                </select>
+                            </div>
+
+                            <div class="form-group">
+                                <label for="iSpeedSlow"><?= $this->getHtml('Slow'); ?></label>
+                                <select form="fLocalization" id="iSpeedSlow" name="settings_speed_s">
+                                    <?php foreach ($speeds as $code => $speed) : ?>
+                                    <option value="<?= $this->printHtml($speed); ?>"<?= $this->printHtml($speed === $l11n->getSpeed()['slow'] ? ' selected' : ''); ?>><?= $this->printHtml($speed); ?>
+                                    <?php endforeach; ?>
+                                </select>
+                            </div>
+
+                            <div class="form-group">
+                                <label for="iSpeedMedium"><?= $this->getHtml('Medium'); ?></label>
+                                <select form="fLocalization" id="iSpeedMedium" name="settings_speed_m">
+                                    <?php foreach ($speeds as $code => $speed) : ?>
+                                    <option value="<?= $this->printHtml($speed); ?>"<?= $this->printHtml($speed === $l11n->getSpeed()['medium'] ? ' selected' : ''); ?>><?= $this->printHtml($speed); ?>
+                                    <?php endforeach; ?>
+                                </select>
+                            </div>
+
+                            <div class="form-group">
+                                <label for="iSpeedFast"><?= $this->getHtml('Fast'); ?></label>
+                                <select form="fLocalization" id="iSpeedFast" name="settings_speed_f">
+                                    <?php foreach ($speeds as $code => $speed) : ?>
+                                    <option value="<?= $this->printHtml($speed); ?>"<?= $this->printHtml($speed === $l11n->getSpeed()['fast'] ? ' selected' : ''); ?>><?= $this->printHtml($speed); ?>
+                                    <?php endforeach; ?>
+                                </select>
+                            </div>
+
+                            <div class="form-group">
+                                <label for="iSpeedVeryFast"><?= $this->getHtml('VeryFast'); ?></label>
+                                <select form="fLocalization" id="iSpeedVeryFast" name="settings_speed_vf">
+                                    <?php foreach ($speeds as $code => $speed) : ?>
+                                    <option value="<?= $this->printHtml($speed); ?>"<?= $this->printHtml($speed === $l11n->getSpeed()['very_fast'] ? ' selected' : ''); ?>><?= $this->printHtml($speed); ?>
+                                    <?php endforeach; ?>
+                                </select>
+                            </div>
+
+                            <div class="form-group">
+                                <label for="iSpeedSea"><?= $this->getHtml('Sea'); ?></label>
+                                <select form="fLocalization" id="iSpeedSea" name="settings_speed_sea">
+                                    <?php foreach ($speeds as $code => $speed) : ?>
+                                    <option value="<?= $this->printHtml($speed); ?>"<?= $this->printHtml($speed === $l11n->getSpeed()['sea'] ? ' selected' : ''); ?>><?= $this->printHtml($speed); ?>
+                                    <?php endforeach; ?>
+                                </select>
+                            </div>
                         </div>
                     </div>
                 </div>
@@ -377,53 +445,59 @@ $l11n = $this->getData('defaultlocalization') ?? new NullLocalization();
                     <div class="portlet">
                         <div class="portlet-head"><?= $this->getHtml('Length'); ?></div>
                         <div class="portlet-body">
-                            <form>
-                                <table class="layout wf-100">
-                                    <tbody>
-                                    <tr><td><label for="iLengthVeryShort"><?= $this->getHtml('VeryShort'); ?></label>
-                                    <tr><td>
-                                        <select form="fLocalization" id="iLengthVeryShort" name="settings_length_vs">
-                                            <?php foreach ($lengths as $code => $length) : ?>
-                                            <option value="<?= $this->printHtml($length); ?>"<?= $this->printHtml($length === $l11n->getLength()['very_short'] ? ' selected' : ''); ?>><?= $this->printHtml($length); ?>
-                                            <?php endforeach; ?>
-                                        </select>
-                                    <tr><td><label for="iLengthShort"><?= $this->getHtml('Short'); ?></label>
-                                    <tr><td>
-                                        <select form="fLocalization" id="iLengthShort" name="settings_length_s">
-                                            <?php foreach ($lengths as $code => $length) : ?>
-                                            <option value="<?= $this->printHtml($length); ?>"<?= $this->printHtml($length === $l11n->getLength()['short'] ? ' selected' : ''); ?>><?= $this->printHtml($length); ?>
-                                            <?php endforeach; ?>
-                                        </select>
-                                    <tr><td><label for="iLengthMedium"><?= $this->getHtml('Medium'); ?></label>
-                                    <tr><td>
-                                        <select form="fLocalization" id="iLengthMedium" name="settings_length_m">
-                                            <?php foreach ($lengths as $code => $length) : ?>
-                                            <option value="<?= $this->printHtml($length); ?>"<?= $this->printHtml($length === $l11n->getLength()['medium'] ? ' selected' : ''); ?>><?= $this->printHtml($length); ?>
-                                            <?php endforeach; ?>
-                                        </select>
-                                    <tr><td><label for="iLengthLong"><?= $this->getHtml('Long'); ?></label>
-                                    <tr><td>
-                                        <select form="fLocalization" id="iLengthLong" name="settings_length_l">
-                                            <?php foreach ($lengths as $code => $length) : ?>
-                                            <option value="<?= $this->printHtml($length); ?>"<?= $this->printHtml($length === $l11n->getLength()['long'] ? ' selected' : ''); ?>><?= $this->printHtml($length); ?>
-                                            <?php endforeach; ?>
-                                        </select>
-                                    <tr><td><label for="iLengthVeryLong"><?= $this->getHtml('VeryLong'); ?></label>
-                                    <tr><td>
-                                        <select form="fLocalization" id="iLengthVeryLong" name="settings_length_vl">
-                                            <?php foreach ($lengths as $code => $length) : ?>
-                                            <option value="<?= $this->printHtml($length); ?>"<?= $this->printHtml($length === $l11n->getLength()['very_long'] ? ' selected' : ''); ?>><?= $this->printHtml($length); ?>
-                                            <?php endforeach; ?>
-                                        </select>
-                                    <tr><td><label for="iLengthSea"><?= $this->getHtml('Sea'); ?></label>
-                                    <tr><td>
-                                        <select form="fLocalization" id="iLengthSea" name="settings_length_sea">
-                                            <?php foreach ($lengths as $code => $length) : ?>
-                                            <option value="<?= $this->printHtml($length); ?>"<?= $this->printHtml($length === $l11n->getLength()['sea'] ? ' selected' : ''); ?>><?= $this->printHtml($length); ?>
-                                            <?php endforeach; ?>
-                                        </select>
-                                </table>
-                            </form>
+                            <div class="form-group">
+                                <label for="iLengthVeryShort"><?= $this->getHtml('VeryShort'); ?></label>
+                                <select form="fLocalization" id="iLengthVeryShort" name="settings_length_vs">
+                                    <?php foreach ($lengths as $code => $length) : ?>
+                                    <option value="<?= $this->printHtml($length); ?>"<?= $this->printHtml($length === $l11n->getLength()['very_short'] ? ' selected' : ''); ?>><?= $this->printHtml($length); ?>
+                                    <?php endforeach; ?>
+                                </select>
+                            </div>
+
+                            <div class="form-group">
+                                <label for="iLengthShort"><?= $this->getHtml('Short'); ?></label>
+                                <select form="fLocalization" id="iLengthShort" name="settings_length_s">
+                                    <?php foreach ($lengths as $code => $length) : ?>
+                                    <option value="<?= $this->printHtml($length); ?>"<?= $this->printHtml($length === $l11n->getLength()['short'] ? ' selected' : ''); ?>><?= $this->printHtml($length); ?>
+                                    <?php endforeach; ?>
+                                </select>
+                            </div>
+
+                            <div class="form-group">
+                                <label for="iLengthMedium"><?= $this->getHtml('Medium'); ?></label>
+                                <select form="fLocalization" id="iLengthMedium" name="settings_length_m">
+                                    <?php foreach ($lengths as $code => $length) : ?>
+                                    <option value="<?= $this->printHtml($length); ?>"<?= $this->printHtml($length === $l11n->getLength()['medium'] ? ' selected' : ''); ?>><?= $this->printHtml($length); ?>
+                                    <?php endforeach; ?>
+                                </select>
+                            </div>
+
+                            <div class="form-group">
+                                <label for="iLengthLong"><?= $this->getHtml('Long'); ?></label>
+                                <select form="fLocalization" id="iLengthLong" name="settings_length_l">
+                                    <?php foreach ($lengths as $code => $length) : ?>
+                                    <option value="<?= $this->printHtml($length); ?>"<?= $this->printHtml($length === $l11n->getLength()['long'] ? ' selected' : ''); ?>><?= $this->printHtml($length); ?>
+                                    <?php endforeach; ?>
+                                </select>
+                            </div>
+
+                            <div class="form-group">
+                                <label for="iLengthVeryLong"><?= $this->getHtml('VeryLong'); ?></label>
+                                <select form="fLocalization" id="iLengthVeryLong" name="settings_length_vl">
+                                    <?php foreach ($lengths as $code => $length) : ?>
+                                    <option value="<?= $this->printHtml($length); ?>"<?= $this->printHtml($length === $l11n->getLength()['very_long'] ? ' selected' : ''); ?>><?= $this->printHtml($length); ?>
+                                    <?php endforeach; ?>
+                                </select>
+                            </div>
+
+                            <div class="form-group">
+                                <label for="iLengthSea"><?= $this->getHtml('Sea'); ?></label>
+                                <select form="fLocalization" id="iLengthSea" name="settings_length_sea">
+                                    <?php foreach ($lengths as $code => $length) : ?>
+                                    <option value="<?= $this->printHtml($length); ?>"<?= $this->printHtml($length === $l11n->getLength()['sea'] ? ' selected' : ''); ?>><?= $this->printHtml($length); ?>
+                                    <?php endforeach; ?>
+                                </select>
+                            </div>
                         </div>
                     </div>
                 </div>
@@ -432,46 +506,50 @@ $l11n = $this->getData('defaultlocalization') ?? new NullLocalization();
                     <div class="portlet">
                         <div class="portlet-head"><?= $this->getHtml('Area'); ?></div>
                         <div class="portlet-body">
-                            <form>
-                                <table class="layout wf-100">
-                                    <tbody>
-                                    <tr><td><label for="iAreaVerySmall"><?= $this->getHtml('VerySmall'); ?></label>
-                                    <tr><td>
-                                        <select form="fLocalization" id="iAreaVerySmall" name="settings_area_vs">
-                                            <?php foreach ($areas as $code => $area) : ?>
-                                            <option value="<?= $this->printHtml($area); ?>"<?= $this->printHtml($area === $l11n->getArea()['very_small'] ? ' selected' : ''); ?>><?= $this->printHtml($area); ?>
-                                            <?php endforeach; ?>
-                                        </select>
-                                    <tr><td><label for="iAreaSmall"><?= $this->getHtml('Small'); ?></label>
-                                    <tr><td>
-                                        <select form="fLocalization" id="iAreaSmall" name="settings_area_s">
-                                            <?php foreach ($areas as $code => $area) : ?>
-                                            <option value="<?= $this->printHtml($area); ?>"<?= $this->printHtml($area === $l11n->getArea()['small'] ? ' selected' : ''); ?>><?= $this->printHtml($area); ?>
-                                            <?php endforeach; ?>
-                                        </select>
-                                    <tr><td><label for="iAreaMedium"><?= $this->getHtml('Medium'); ?></label>
-                                    <tr><td>
-                                        <select form="fLocalization" id="iAreaMedium" name="settings_area_m">
-                                            <?php foreach ($areas as $code => $area) : ?>
-                                            <option value="<?= $this->printHtml($area); ?>"<?= $this->printHtml($area === $l11n->getArea()['medium'] ? ' selected' : ''); ?>><?= $this->printHtml($area); ?>
-                                            <?php endforeach; ?>
-                                        </select>
-                                    <tr><td><label for="iAreaLarge"><?= $this->getHtml('Large'); ?></label>
-                                    <tr><td>
-                                        <select form="fLocalization" id="iAreaLarge" name="settings_area_l">
-                                            <?php foreach ($areas as $code => $area) : ?>
-                                            <option value="<?= $this->printHtml($area); ?>"<?= $this->printHtml($area === $l11n->getArea()['large'] ? ' selected' : ''); ?>><?= $this->printHtml($area); ?>
-                                            <?php endforeach; ?>
-                                        </select>
-                                    <tr><td><label for="iAreaVeryLarge"><?= $this->getHtml('VeryLarge'); ?></label>
-                                    <tr><td>
-                                        <select form="fLocalization" id="iAreaVeryLarge" name="settings_area_vl">
-                                            <?php foreach ($areas as $code => $area) : ?>
-                                            <option value="<?= $this->printHtml($area); ?>"<?= $this->printHtml($area === $l11n->getArea()['very_large'] ? ' selected' : ''); ?>><?= $this->printHtml($area); ?>
-                                            <?php endforeach; ?>
-                                        </select>
-                                </table>
-                            </form>
+                            <div class="form-group">
+                                <label for="iAreaVerySmall"><?= $this->getHtml('VerySmall'); ?></label>
+                                <select form="fLocalization" id="iAreaVerySmall" name="settings_area_vs">
+                                    <?php foreach ($areas as $code => $area) : ?>
+                                    <option value="<?= $this->printHtml($area); ?>"<?= $this->printHtml($area === $l11n->getArea()['very_small'] ? ' selected' : ''); ?>><?= $this->printHtml($area); ?>
+                                    <?php endforeach; ?>
+                                </select>
+                            </div>
+
+                            <div class="form-group">
+                                <label for="iAreaSmall"><?= $this->getHtml('Small'); ?></label>
+                                <select form="fLocalization" id="iAreaSmall" name="settings_area_s">
+                                    <?php foreach ($areas as $code => $area) : ?>
+                                    <option value="<?= $this->printHtml($area); ?>"<?= $this->printHtml($area === $l11n->getArea()['small'] ? ' selected' : ''); ?>><?= $this->printHtml($area); ?>
+                                    <?php endforeach; ?>
+                                </select>
+                            </div>
+
+                            <div class="form-group">
+                                <label for="iAreaMedium"><?= $this->getHtml('Medium'); ?></label>
+                                <select form="fLocalization" id="iAreaMedium" name="settings_area_m">
+                                    <?php foreach ($areas as $code => $area) : ?>
+                                    <option value="<?= $this->printHtml($area); ?>"<?= $this->printHtml($area === $l11n->getArea()['medium'] ? ' selected' : ''); ?>><?= $this->printHtml($area); ?>
+                                    <?php endforeach; ?>
+                                </select>
+                            </div>
+
+                            <div class="form-group">
+                                <label for="iAreaLarge"><?= $this->getHtml('Large'); ?></label>
+                                <select form="fLocalization" id="iAreaLarge" name="settings_area_l">
+                                    <?php foreach ($areas as $code => $area) : ?>
+                                    <option value="<?= $this->printHtml($area); ?>"<?= $this->printHtml($area === $l11n->getArea()['large'] ? ' selected' : ''); ?>><?= $this->printHtml($area); ?>
+                                    <?php endforeach; ?>
+                                </select>
+                            </div>
+
+                            <div class="form-group">
+                                <label for="iAreaVeryLarge"><?= $this->getHtml('VeryLarge'); ?></label>
+                                <select form="fLocalization" id="iAreaVeryLarge" name="settings_area_vl">
+                                    <?php foreach ($areas as $code => $area) : ?>
+                                    <option value="<?= $this->printHtml($area); ?>"<?= $this->printHtml($area === $l11n->getArea()['very_large'] ? ' selected' : ''); ?>><?= $this->printHtml($area); ?>
+                                    <?php endforeach; ?>
+                                </select>
+                            </div>
                         </div>
                     </div>
                 </div>
@@ -480,73 +558,84 @@ $l11n = $this->getData('defaultlocalization') ?? new NullLocalization();
                     <div class="portlet">
                         <div class="portlet-head"><?= $this->getHtml('Volume'); ?></div>
                         <div class="portlet-body">
-                            <form>
-                                <table class="layout wf-100">
-                                    <tbody>
-                                    <tr><td><label for="iVolumeVerySmall"><?= $this->getHtml('VerySmall'); ?></label>
-                                    <tr><td>
-                                        <select form="fLocalization" id="iVolumeVerySmall" name="settings_volume_vs">
-                                            <?php foreach ($volumes as $code => $volume) : ?>
-                                            <option value="<?= $this->printHtml($volume); ?>"<?= $this->printHtml($volume === $l11n->getVolume()['very_small'] ? ' selected' : ''); ?>><?= $this->printHtml($volume); ?>
-                                            <?php endforeach; ?>
-                                        </select>
-                                    <tr><td><label for="iVolumeSmall"><?= $this->getHtml('Small'); ?></label>
-                                    <tr><td>
-                                        <select form="fLocalization" id="iVolumeSmall" name="settings_volume_s">
-                                            <?php foreach ($volumes as $code => $volume) : ?>
-                                            <option value="<?= $this->printHtml($volume); ?>"<?= $this->printHtml($volume === $l11n->getVolume()['small'] ? ' selected' : ''); ?>><?= $this->printHtml($volume); ?>
-                                            <?php endforeach; ?>
-                                        </select>
-                                    <tr><td><label for="iVolumeMedium"><?= $this->getHtml('Medium'); ?></label>
-                                    <tr><td>
-                                        <select form="fLocalization" id="iVolumeMedium" name="settings_volume_m">
-                                            <?php foreach ($volumes as $code => $volume) : ?>
-                                            <option value="<?= $this->printHtml($volume); ?>"<?= $this->printHtml($volume === $l11n->getVolume()['medium'] ? ' selected' : ''); ?>><?= $this->printHtml($volume); ?>
-                                            <?php endforeach; ?>
-                                        </select>
-                                    <tr><td><label for="iVolumeLarge"><?= $this->getHtml('Large'); ?></label>
-                                    <tr><td>
-                                        <select form="fLocalization" id="iVolumeLarge" name="settings_volume_l">
-                                            <?php foreach ($volumes as $code => $volume) : ?>
-                                            <option value="<?= $this->printHtml($volume); ?>"<?= $this->printHtml($volume === $l11n->getVolume()['large'] ? ' selected' : ''); ?>><?= $this->printHtml($volume); ?>
-                                            <?php endforeach; ?>
-                                        </select>
-                                    <tr><td><label for="iVolumeVeryLarge"><?= $this->getHtml('VeryLarge'); ?></label>
-                                    <tr><td>
-                                        <select form="fLocalization" id="iVolumeVeryLarge" name="settings_volume_vl">
-                                            <?php foreach ($volumes as $code => $volume) : ?>
-                                            <option value="<?= $this->printHtml($volume); ?>"<?= $this->printHtml($volume === $l11n->getVolume()['very_large'] ? ' selected' : ''); ?>><?= $this->printHtml($volume); ?>
-                                            <?php endforeach; ?>
-                                        </select>
-                                    <tr><td><label for="iVolumeTeaspoon"><?= $this->getHtml('Teaspoon'); ?></label>
-                                    <tr><td>
-                                        <select form="fLocalization" id="iVolumeTeaspoon" name="settings_volume_teaspoon">
-                                            <?php foreach ($volumes as $code => $volume) : ?>
-                                            <option value="<?= $this->printHtml($volume); ?>"<?= $this->printHtml($volume === $l11n->getVolume()['teaspoon'] ? ' selected' : ''); ?>><?= $this->printHtml($volume); ?>
-                                            <?php endforeach; ?>
-                                        </select>
-                                    <tr><td><label for="iVolumeTablespoon"><?= $this->getHtml('Tablespoon'); ?></label>
-                                    <tr><td>
-                                        <select form="fLocalization" id="iVolumeTablespoon" name="settings_volume_tablespoon">
-                                            <?php foreach ($volumes as $code => $volume) : ?>
-                                            <option value="<?= $this->printHtml($volume); ?>"<?= $this->printHtml($volume === $l11n->getVolume()['tablespoon'] ? ' selected' : ''); ?>><?= $this->printHtml($volume); ?>
-                                            <?php endforeach; ?>
-                                        </select>
-                                    <tr><td><label for="iVolumeGlass"><?= $this->getHtml('Glass'); ?></label>
-                                    <tr><td>
-                                        <select form="fLocalization" id="iVolumeGlass" name="settings_volume_glass">
-                                            <?php foreach ($volumes as $code => $volume) : ?>
-                                            <option value="<?= $this->printHtml($volume); ?>"<?= $this->printHtml($volume === $l11n->getVolume()['glass'] ? ' selected' : ''); ?>><?= $this->printHtml($volume); ?>
-                                            <?php endforeach; ?>
-                                        </select>
-                                </table>
-                            </form>
+                            <div class="form-group">
+                                <label for="iVolumeVerySmall"><?= $this->getHtml('VerySmall'); ?></label>
+                                <select form="fLocalization" id="iVolumeVerySmall" name="settings_volume_vs">
+                                    <?php foreach ($volumes as $code => $volume) : ?>
+                                    <option value="<?= $this->printHtml($volume); ?>"<?= $this->printHtml($volume === $l11n->getVolume()['very_small'] ? ' selected' : ''); ?>><?= $this->printHtml($volume); ?>
+                                    <?php endforeach; ?>
+                                </select>
+                            </div>
+
+                            <div class="form-group">
+                                <label for="iVolumeSmall"><?= $this->getHtml('Small'); ?></label>
+                                <select form="fLocalization" id="iVolumeSmall" name="settings_volume_s">
+                                    <?php foreach ($volumes as $code => $volume) : ?>
+                                    <option value="<?= $this->printHtml($volume); ?>"<?= $this->printHtml($volume === $l11n->getVolume()['small'] ? ' selected' : ''); ?>><?= $this->printHtml($volume); ?>
+                                    <?php endforeach; ?>
+                                </select>
+                            </div>
+
+                            <div class="form-group">
+                                <label for="iVolumeMedium"><?= $this->getHtml('Medium'); ?></label>
+                                <select form="fLocalization" id="iVolumeMedium" name="settings_volume_m">
+                                    <?php foreach ($volumes as $code => $volume) : ?>
+                                    <option value="<?= $this->printHtml($volume); ?>"<?= $this->printHtml($volume === $l11n->getVolume()['medium'] ? ' selected' : ''); ?>><?= $this->printHtml($volume); ?>
+                                    <?php endforeach; ?>
+                                </select>
+                            </div>
+
+                            <div class="form-group">
+                                <label for="iVolumeLarge"><?= $this->getHtml('Large'); ?></label>
+                                <select form="fLocalization" id="iVolumeLarge" name="settings_volume_l">
+                                    <?php foreach ($volumes as $code => $volume) : ?>
+                                    <option value="<?= $this->printHtml($volume); ?>"<?= $this->printHtml($volume === $l11n->getVolume()['large'] ? ' selected' : ''); ?>><?= $this->printHtml($volume); ?>
+                                    <?php endforeach; ?>
+                                </select>
+                            </div>
+
+                            <div class="form-group">
+                                <label for="iVolumeVeryLarge"><?= $this->getHtml('VeryLarge'); ?></label>
+                                <select form="fLocalization" id="iVolumeVeryLarge" name="settings_volume_vl">
+                                    <?php foreach ($volumes as $code => $volume) : ?>
+                                    <option value="<?= $this->printHtml($volume); ?>"<?= $this->printHtml($volume === $l11n->getVolume()['very_large'] ? ' selected' : ''); ?>><?= $this->printHtml($volume); ?>
+                                    <?php endforeach; ?>
+                                </select>
+                            </div>
+
+                            <div class="form-group">
+                                <label for="iVolumeTeaspoon"><?= $this->getHtml('Teaspoon'); ?></label>
+                                <select form="fLocalization" id="iVolumeTeaspoon" name="settings_volume_teaspoon">
+                                    <?php foreach ($volumes as $code => $volume) : ?>
+                                    <option value="<?= $this->printHtml($volume); ?>"<?= $this->printHtml($volume === $l11n->getVolume()['teaspoon'] ? ' selected' : ''); ?>><?= $this->printHtml($volume); ?>
+                                    <?php endforeach; ?>
+                                </select>
+                            </div>
+
+                            <div class="form-group">
+                                <label for="iVolumeTablespoon"><?= $this->getHtml('Tablespoon'); ?></label>
+                                <select form="fLocalization" id="iVolumeTablespoon" name="settings_volume_tablespoon">
+                                    <?php foreach ($volumes as $code => $volume) : ?>
+                                    <option value="<?= $this->printHtml($volume); ?>"<?= $this->printHtml($volume === $l11n->getVolume()['tablespoon'] ? ' selected' : ''); ?>><?= $this->printHtml($volume); ?>
+                                    <?php endforeach; ?>
+                                </select>
+                            </div>
+
+                            <div class="form-group">
+                                <label for="iVolumeGlass"><?= $this->getHtml('Glass'); ?></label>
+                                <select form="fLocalization" id="iVolumeGlass" name="settings_volume_glass">
+                                    <?php foreach ($volumes as $code => $volume) : ?>
+                                    <option value="<?= $this->printHtml($volume); ?>"<?= $this->printHtml($volume === $l11n->getVolume()['glass'] ? ' selected' : ''); ?>><?= $this->printHtml($volume); ?>
+                                    <?php endforeach; ?>
+                                </select>
+                            </div>
                         </div>
                     </div>
                 </div>
             </div>
         </div>
-        <input type="radio" id="c-tab-3" name="tabular-2"<?= $this->request->uri->fragment === 'c-tab-3' ? ' checked' : ''; ?>>
+        <input type="radio" id="c-tab-3"
+            name="tabular-2"<?= $this->request->uri->fragment === 'c-tab-3' ? ' checked' : ''; ?>>
         <div class="tab">
             <div class="row">
                 <div class="col-xs-12">