Styling adjustments to the settings nav component and the settings pages

This commit is contained in:
Alex Tselegidis 2022-09-14 10:14:19 +02:00
parent 1340fa6e9f
commit b6cc72cd06
6 changed files with 62 additions and 55 deletions

View file

@ -1,34 +1,34 @@
<h4 class="mt-4 text-black-50 pb-2 border-bottom mb-2">
<h4 class=" text-black-50 py-3 mb-3 border-bottom fw-light">
<?= lang('settings') ?>
</h4>
<ul id="settings-nav" class="nav flex-column">
<li class="nav-item mb-2">
<a class="nav-link" href="<?= site_url('general_settings') ?>">
<li class="nav-item mb-3">
<a class="nav-link px-0 py-2" href="<?= site_url('general_settings') ?>">
<?= lang('general_settings') ?>
</a>
</li>
<li class="nav-item mb-2">
<a class="nav-link" href="<?= site_url('booking_settings') ?>">
<li class="nav-item mb-3">
<a class="nav-link px-0 py-2" href="<?= site_url('booking_settings') ?>">
<?= lang('booking_settings') ?>
</a>
</li>
<li class="nav-item mb-2">
<a class="nav-link" href="<?= site_url('business_settings') ?>">
<li class="nav-item mb-3">
<a class="nav-link px-0 py-2" href="<?= site_url('business_settings') ?>">
<?= lang('business_logic') ?>
</a>
</li>
<li class="nav-item mb-2">
<a class="nav-link" href="<?= site_url('legal_settings') ?>">
<li class="nav-item mb-3">
<a class="nav-link px-0 py-2" href="<?= site_url('legal_settings') ?>">
<?= lang('legal_contents') ?>
</a>
</li>
<li class="nav-item mb-2">
<a class="nav-link" href="<?= site_url('integrations') ?>">
<li class="nav-item mb-3">
<a class="nav-link px-0 py-2" href="<?= site_url('integrations') ?>">
<?= lang('integrations') ?>
</a>
</li>

View file

@ -11,8 +11,9 @@
<div class="col-sm-6">
<form>
<fieldset>
<legend class="d-flex justify-content-between align-items-center border-bottom mb-4 py-2">
<?= lang('booking_settings') ?>
<div class="d-flex justify-content-between align-items-center border-bottom mb-4 py-2">
<?php if (can('edit', PRIV_SYSTEM_SETTINGS)): ?>
<button type="button" id="save-settings" class="btn btn-primary">
@ -20,9 +21,9 @@
<?= lang('save') ?>
</button>
<?php endif ?>
</legend>
<div class="row mb-3 fields-row">
</div>
<div class="row mb-5 fields-row">
<div class="col-lg-6">
<div class="form-group mb-5">
<label for="first-name" class="form-label">
@ -329,7 +330,7 @@
</div>
<div class="mb-3">
<div>
<div class="form-check form-switch">
<input class="form-check-input" type="checkbox" id="disable-booking"
data-field="disable_booking">

View file

@ -11,8 +11,10 @@
<div class="col-sm-6">
<form>
<fieldset>
<legend class="d-flex justify-content-between align-items-center border-bottom mb-4 py-2">
<?= lang('business_logic') ?>
<div class="d-flex justify-content-between align-items-center border-bottom mb-4 py-2">
<h4 class="text-black-50 mb-0 fw-light">
<?= lang('business_logic') ?>
</h4>
<?php if (can('edit', PRIV_SYSTEM_SETTINGS)): ?>
<button type="button" id="save-settings" class="btn btn-primary">
@ -20,14 +22,14 @@
<?= lang('save') ?>
</button>
<?php endif ?>
</legend>
<h4><?= lang('working_plan') ?></h4>
<div class="form-text text-muted mb-4">
<?= lang('edit_working_plan_hint') ?>
</div>
<h5 class="text-black-50 mb-3 fw-light"><?= lang('working_plan') ?></h5>
<p class="form-text text-muted mb-4">
<?= lang('edit_working_plan_hint') ?>
</p>
<table class="working-plan table table-striped">
<thead>
<tr>
@ -39,18 +41,18 @@
<tbody><!-- Dynamic Content --></tbody>
</table>
<div class="text-end">
<div class="text-end mb-5">
<button class="btn btn-outline-secondary" id="apply-global-working-plan" type="button">
<i class="fas fa-check"></i>
<?= lang('apply_to_all_providers') ?>
</button>
</div>
<h4><?= lang('breaks') ?></h4>
<h5 class="text-black-50 mb-3 fw-light"><?= lang('breaks') ?></h5>
<span class="form-text text-muted">
<p class="form-text text-muted">
<?= lang('edit_breaks_hint') ?>
</span>
</p>
<div class="mt-2">
<button type="button" class="add-break btn btn-primary">
@ -61,7 +63,7 @@
<br>
<table class="breaks table table-striped mb-4">
<table class="breaks table table-striped mb-5">
<thead>
<tr>
<th><?= lang('day') ?></th>
@ -73,9 +75,9 @@
<tbody><!-- Dynamic Content --></tbody>
</table>
<h4><?= lang('allow_rescheduling_cancellation_before') ?></h4>
<h5 class="text-black-50 mb-3 fw-light"><?= lang('allow_rescheduling_cancellation_before') ?></h5>
<div class="mb-3">
<div class="mb-5">
<label for="book-advance-timeout" class="form-label">
<?= lang('timeout_minutes') ?>
</label>
@ -88,9 +90,9 @@
</div>
</div>
<h4><?= lang('future_booking_limit') ?></h4>
<h5 class="text-black-50 mb-3 fw-light"><?= lang('future_booking_limit') ?></h5>
<div class="mb-3">
<div class="mb-5">
<label for="future-booking-limit" class="form-label">
<?= lang('limit_days') ?>
</label>

View file

@ -11,8 +11,10 @@
<div class="col-sm-6">
<form>
<fieldset>
<legend class="d-flex justify-content-between align-items-center border-bottom mb-4 py-2">
<?= lang('general_settings') ?>
<div class="d-flex justify-content-between align-items-center border-bottom mb-4 py-2">
<h4 class="text-black-50 mb-0 fw-light">
<?= lang('general_settings') ?>
</h4>
<?php if (can('edit', PRIV_SYSTEM_SETTINGS)): ?>
<button type="button" id="save-settings" class="btn btn-primary">
@ -20,11 +22,11 @@
<?= lang('save') ?>
</button>
<?php endif ?>
</legend>
</div>
<div class="row mb-5">
<div class="col-12">
<h4><?= lang('company') ?></h4>
<h5 class="text-black-50 mb-3 fw-light"><?= lang('company') ?></h5>
<div class="mb-3">
<label class="form-label" for="company-name">
@ -139,7 +141,7 @@
<div class="row mb-5">
<div class="col-12">
<h4><?= lang('localization') ?></h4>
<h5 class="text-black-50 mb-3 fw-light"><?= lang('localization') ?></h5>
<div class="mb-3">
<label class="form-label" for="date-format">

View file

@ -8,11 +8,11 @@
<?php component('settings_nav') ?>
</div>
<div id="integrations" class="col-sm-6">
<h3 class="text-muted border-bottom py-2">
<h4 class="text-black-50 border-bottom py-3 mb-3 fw-light">
<?= lang('integrations') ?>
</h3>
</h4>
<p class="mb-5">
<p class="form-text text-muted mb-4">
<?= lang('integrations_info') ?>
</p>

View file

@ -11,20 +11,22 @@
<div class="col-sm-6">
<form>
<fieldset>
<legend class="d-flex justify-content-between align-items-center border-bottom mb-4 py-2">
<?= lang('legal_contents') ?>
<div class="d-flex justify-content-between align-items-center border-bottom mb-4 py-2">
<h4 class="text-black-50 mb-0 fw-light">
<?= lang('legal_contents') ?>
</h4>
<?php if (can('edit', PRIV_SYSTEM_SETTINGS)): ?>
<button type="button" id="save-settings" class="btn btn-primary">
<i class="fas fa-check-square me-2"></i>
<?= lang('save') ?>
</button>
<?php endif ?>
</legend>
</div>
<div class="row">
<div class="col-12">
<h4><?= lang('cookie_notice') ?></h4>
<h5 class="text-black-50 mb-3 fw-light"><?= lang('cookie_notice') ?></h5>
<div class="form-check form-switch mb-3">
<input class="form-check-input display-switch" type="checkbox"
@ -38,8 +40,8 @@
<label class="form-label" for="cookie-notice-content"><?= lang('cookie_notice_content') ?></label>
<textarea id="cookie-notice-content" cols="30" rows="10" class="mb-3"></textarea>
</div>
<h4><?= lang('terms_and_conditions') ?></h4>
<h5 class="text-black-50 mb-3 fw-light"><?= lang('terms_and_conditions') ?></h5>
<div class="form-check form-switch mb-3">
<input class="form-check-input display-switch" type="checkbox"
@ -55,8 +57,8 @@
class="mb-3"></textarea>
</div>
<h4><?= lang('privacy_policy') ?></h4>
<h5 class="text-black-50 mb-3 fw-light"><?= lang('privacy_policy') ?></h5>
<div class="form-check form-switch mb-3">
<input class="form-check-input display-switch" type="checkbox"
id="display-privacy-policy">