From 64370e11c56fb983c2434cefad89c18c7bf5f909 Mon Sep 17 00:00:00 2001 From: Abhishek Kumar Date: Thu, 28 Sep 2023 15:19:00 +0530 Subject: [PATCH 1/3] Add language dropdown on maintenance page --- classes/controller/FrontController.php | 3 + js/maintenance.js | 13 ++ .../css/maintenance.css | 151 ++++++++++++++++++ .../hotel-reservation-theme/maintenance.tpl | 28 +++- 4 files changed, 192 insertions(+), 3 deletions(-) diff --git a/classes/controller/FrontController.php b/classes/controller/FrontController.php index 2f19b9f61..dfbc17b52 100644 --- a/classes/controller/FrontController.php +++ b/classes/controller/FrontController.php @@ -795,6 +795,9 @@ class FrontControllerCore extends Controller 'HOOK_MAINTENANCE' => Hook::exec('displayMaintenance', array()), 'allowEmployee' => Configuration::get('PS_ALLOW_EMP'), 'maintenance' => $this->context->link->getAdminLink('AdminMaintenance', false), + 'languages' => Language::getLanguages(true, $this->context->shop->id), + 'lang_iso' => $this->context->language->iso_code, + 'link' => $this->context->link, )); // If the controller is a module, then getTemplatePath will try to find the template in the modules, so we need to instanciate a real frontcontroller $front_controller = preg_match('/ModuleFrontController$/', get_class($this)) ? new FrontController() : $this; diff --git a/js/maintenance.js b/js/maintenance.js index 26015d1a9..f8257fd01 100644 --- a/js/maintenance.js +++ b/js/maintenance.js @@ -18,4 +18,17 @@ $(document).ready(function(){ $("input[type='radio'][name='PS_SHOP_ENABLE']").change(function() { $("#conf_id_PS_ALLOW_EMP").toggle('slow'); }); + + // manage dropdown + $(document).on('click', 'button.dropdown-toggle', function () { + $(this).closest('.dropdown').toggleClass('open'); + }); + + $(document).on('click', function (e) { + if ($('.language-selector-wrap .dropdown').hasClass('open') + && !$(e.target).closest('.dropdown-toggle').length + ) { + $('.language-selector-wrap .dropdown').removeClass('open'); + } + }); }); \ No newline at end of file diff --git a/themes/hotel-reservation-theme/css/maintenance.css b/themes/hotel-reservation-theme/css/maintenance.css index 9ff35daca..27008c79b 100644 --- a/themes/hotel-reservation-theme/css/maintenance.css +++ b/themes/hotel-reservation-theme/css/maintenance.css @@ -129,6 +129,157 @@ button[type='button'].cancel-login { color: #FFF; } +.header-container { + display: flex; + justify-content: space-between; + align-items: center; + margin-right: auto; + margin-left: auto; +} + +.header-container > div:nth-child(1), +.header-container > div:nth-child(3) { + flex-basis: 25%; +} + +.header-container > div:nth-child(2) { + flex-basis: 50%; +} + +@media (min-width: 768px) { + .header-container { + width: 750px; + } +} +@media (min-width: 992px) { + .header-container { + width: 970px; + } +} +@media (min-width: 1200px) { + .header-container { + width: 1170px; + } +} + +.header-container img { + display: block; + max-height: 60px; + max-width: 100%; + margin: 0 auto; +} + +.header-container .language-selector-wrap { + display: flex; + justify-content: end; +} + +/* language-selector - start */ +.dropdown { + position: relative; +} +.dropdown-toggle { + display: inline-block; + background-color: transparent; + padding: 0; + margin-bottom: 0; + font-size: 14px; + font-weight: bold; + color: #333; + line-height: 1.42857; + text-align: center; + vertical-align: middle; + cursor: pointer; + border: 1px solid transparent; + border-radius: 0px; + white-space: nowrap; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + -o-user-select: none; + user-select: none; +} +.dropdown-toggle:focus { + outline: 0; +} +.dropdown-toggle .caret { + display: inline-block; + width: 0; + height: 0; + margin-left: 0; + vertical-align: middle; + border-top-color: white; + border-top: 4px solid #000; + border-right: 4px solid transparent; + border-left: 4px solid transparent; + border-bottom: 0 dotted; + content: ""; +} +.dropdown-menu { + position: absolute; + top: 100%; + right: 0; + z-index: 1000; + display: none; + float: left; + min-width: 160px; + padding: 5px 0; + margin: 2px 0 0; + font-size: 14px; + text-align: left; + list-style: none; + background-color: #fff; + background-clip: padding-box; + border: 1px solid #ccc; + border: 1px solid rgba(0, 0, 0, 0.15); + border-radius: 0; + -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175); + box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175); +} +.dropdown-menu > li > a { + display: block; + padding: 3px 20px; + clear: both; + font-weight: 400; + line-height: 1.42857143; + color: #333333; + text-decoration: none; + white-space: nowrap; +} +.dropdown-menu > li > a:hover, +.dropdown-menu > li > a:focus { + color: #262626; + background-color: #f5f5f5; +} +.dropdown-menu > .active > a, +.dropdown-menu > .active > a:hover, +.dropdown-menu > .active > a:focus { + color: #fff; + background-color: #337ab7; + outline: 0; +} +.dropdown-menu > .disabled > a, +.dropdown-menu > .disabled > a:hover, +.dropdown-menu > .disabled > a:focus { + color: #777777; + pointer-events: none; +} +.dropdown-menu > .disabled > a:hover, +.dropdown-menu > .disabled > a:focus { + text-decoration: none; + cursor: not-allowed; + background-color: transparent; + background-image: none; + filter: progid:DXImageTransform.Microsoft.gradient(enabled = false); +} +.open > .dropdown-menu { + display: block; +} +.open > a { + outline: 0; +} +/* language-selector - end */ + #maintenance .logo { padding: 12px; text-align: center; } diff --git a/themes/hotel-reservation-theme/maintenance.tpl b/themes/hotel-reservation-theme/maintenance.tpl index d07051087..c6b026174 100644 --- a/themes/hotel-reservation-theme/maintenance.tpl +++ b/themes/hotel-reservation-theme/maintenance.tpl @@ -45,9 +45,31 @@
-