Improved the footer display for mobile and desktop viewports

This commit is contained in:
Alex Tselegidis 2021-12-18 19:32:26 +01:00
parent 8ea5b1c4eb
commit 84df2423c2
2 changed files with 22 additions and 45 deletions

View File

@ -3,49 +3,47 @@
* @var string $user_display_name * @var string $user_display_name
*/ */
?> ?>
<div id="footer" class="d-md-flex justify-content-md-between"> <div id="footer" class="d-lg-flex justify-content-lg-start align-items-lg-center p-2 text-center text-lg-left">
<div id="footer-content"> <div class="mb-3 me-lg-5 mb-lg-0">
<img class="me-1" src="<?= base_url('assets/img/logo-16x16.png') ?>" alt="Easy!Appointments Logo"> <img class="me-1" src="<?= base_url('assets/img/logo-16x16.png') ?>" alt="Easy!Appointments Logo">
<a href="https://easyappointments.org">
Easy!Appointments <a href="https://easyappointments.org">Easy!Appointments</a>
</a>
v<?= config('version') ?> <span>v<?= config('version') ?></span>
<?php if (config('release_label')): ?> </div>
- <?= config('release_label') ?>
<?php endif ?> <div class="mb-3 me-lg-5 mb-lg-0">
<img class="me-1" src="<?= base_url('assets/img/alextselegidis-logo-16x16.png') ?>" alt="Alex Tselegidis Logo">
|
<a href="https://alextselegidis.com">Alex Tselegidis</a>
<img class="mx-1" src="<?= base_url('assets/img/alextselegidis-logo-16x16.png') ?>" alt="Alex Tselegidis Logo">
<a href="https://alextselegidis.com">
Alex Tselegidis
</a>
&copy; <?= date('Y') ?> - Software Development &copy; <?= date('Y') ?> - Software Development
</div>
| <div class="mb-3 me-lg-5 mb-lg-0">
<?= lang('licensed_under') ?> <?= lang('licensed_under') ?>
<a href="https://www.gnu.org/licenses/gpl-3.0.en.html"> <a href="https://www.gnu.org/licenses/gpl-3.0.en.html">
GPL-3.0 GPL-3.0
</a> </a>
</div>
| <div class="mb-3 me-lg-5 mb-lg-0">
<span id="select-language" class="badge bg-secondary"> <span id="select-language" class="badge bg-secondary">
<i class="fas fa-language me-2"></i> <i class="fas fa-language me-2"></i>
<?= ucfirst(config('language')) ?> <?= ucfirst(config('language')) ?>
</span> </span>
</div>
| <div class="mb-3 me-lg-5 mb-lg-0">
<a href="<?= site_url('appointments') ?>"> <a href="<?= site_url('appointments') ?>">
<?= lang('go_to_booking_page') ?> <?= lang('go_to_booking_page') ?>
</a> </a>
</div> </div>
<div id="footer-user-display-name"> <div class="ms-lg-auto">
<?= lang('hello') . ', ' . $user_display_name ?>! <strong id="footer-user-display-name">
<?= lang('hello') . ', ' . $user_display_name ?>!
</strong>
</div> </div>
</div> </div>

View File

@ -77,20 +77,6 @@ root {
background-color: #f7f7f7; background-color: #f7f7f7;
border-top: 1px solid #ddd; border-top: 1px solid #ddd;
font-size: 11px; font-size: 11px;
overflow: auto;
}
#footer #footer-content {
padding: 10px 15px;
display: inline-block;
float: left;
line-height: 2;
}
#footer #footer-user-display-name {
display: inline-block;
padding: 10px 15px;
font-weight: bold;
} }
#notification strong { #notification strong {
@ -207,13 +193,6 @@ body legend {
color: #666; color: #666;
} }
@media (min-width: 768px) {
#footer #footer-user-display-name {
float: right;
text-align: right;
}
}
/* BACKEND COMPONENTS /* BACKEND COMPONENTS
-------------------------------------------------------------------- */ -------------------------------------------------------------------- */