Enhance the booking info field display.

This commit is contained in:
Alex Tselegidis 2023-05-04 11:52:25 +02:00
parent fbd3273864
commit d3c96efac5
2 changed files with 23 additions and 2 deletions

View file

@ -27,7 +27,7 @@
<h2 class="frame-title"><?= lang('customer_information') ?></h2>
<div class="row frame-content">
<div class="col-12 col-md-6 field-col">
<div class="col-12 col-md-6 field-col mx-auto">
<?php if ($display_first_name): ?>
<div class="mb-3">
<label for="first-name" class="form-label">
@ -81,7 +81,7 @@
<?php endif ?>
</div>
<div class="col-12 col-md-6 field-col">
<div class="col-12 col-md-6 field-col mx-auto">
<?php if ($display_address) : ?>
<div class="mb-3">
<label for="address" class="form-label">

View file

@ -213,6 +213,27 @@ App.Pages.Booking = (function () {
* Remove empty columns and center elements if needed.
*/
function optimizeContactInfoDisplay() {
// If a column has only one control shown then move the control to the other column.
const $firstCol = $('#wizard-frame-3 .field-col:first');
const $firstColControls = $firstCol.find('.form-control');
const $secondCol = $('#wizard-frame-3 .field-col:last');
const $secondColControls = $secondCol.find('.form-control');
if ($firstColControls.length === 1 && $secondColControls.length > 1) {
$firstColControls.each((index, controlEl) => {
$(controlEl).parent().insertBefore($secondColControls.first().parent());
});
}
if ($secondColControls.length === 1 && $firstColControls.length > 1) {
$secondColControls.each((index, controlEl) => {
$(controlEl).parent().insertAfter($firstColControls.last().parent());
});
}
// Hide columns that do not have any controls displayed.
const $fieldCols = $(document).find('#wizard-frame-3 .field-col');
$fieldCols.each((index, fieldColEl) => {