diff --git a/plugins/themes/default/DefaultThemePlugin.php b/plugins/themes/default/DefaultThemePlugin.php index 8c8a3008e04..44e685569c6 100644 --- a/plugins/themes/default/DefaultThemePlugin.php +++ b/plugins/themes/default/DefaultThemePlugin.php @@ -3,8 +3,8 @@ /** * @file plugins/themes/default/DefaultThemePlugin.php * - * Copyright (c) 2014-2022 Simon Fraser University - * Copyright (c) 2003-2022 John Willinsky + * Copyright (c) 2014-2024 Simon Fraser University + * Copyright (c) 2003-2024 John Willinsky * Distributed under the GNU GPL v3. For full terms see the file docs/COPYING. * * @class DefaultThemePlugin @@ -17,6 +17,8 @@ use APP\core\Application; use APP\file\PublicFileManager; use PKP\config\Config; +use PKP\plugins\Hook; + use PKP\plugins\ThemePlugin; use PKP\session\SessionManager; @@ -211,6 +213,8 @@ public function init() // Add navigation menu areas for this theme $this->addMenuArea(['primary', 'user']); + + Hook::add('TemplateManager::display', [$this, 'checkCurrentPage']); } /** @@ -254,6 +258,52 @@ public function getDescription() { return __('plugins.themes.default.description'); } + + + /** + * @param $hookname string + * @param $args array + */ + public function checkCurrentPage($hookname, $args) + { + $templateMgr = $args[0]; + // TODO check the issue with multiple calls of the hook on settings/website + if (!isset($templateMgr->registered_plugins['function']['default_item_active'])) { + $templateMgr->registerPlugin('function', 'default_item_active', [$this, 'isActiveItem']); + } + } + + /** + * @param $params array + * @param $smarty Smarty_Internal_Template + * + * @return string + */ + public function isActiveItem($params, $smarty) + { + $navigationMenuItem = $params['item']; + $emptyMarker = ''; + $activeMarker = ' active'; + + // Get URL of the current page + $request = $this->getRequest(); + $currentUrl = $request->getCompleteUrl(); + $currentPage = $request->getRequestedPage(); + + // Do not add an active marker if it's a dropdown menu + if ($navigationMenuItem->getIsChildVisible()) { + return $emptyMarker; + } + + // Retrieve URL and its components for a menu item + $itemUrl = $navigationMenuItem->getUrl(); + + if ($currentUrl === $itemUrl) { + return $activeMarker; + } + + return $emptyMarker; + } } if (!PKP_STRICT_MODE) { diff --git a/plugins/themes/default/styles/head.less b/plugins/themes/default/styles/head.less index 2c2540fabef..7c2be737f6a 100644 --- a/plugins/themes/default/styles/head.less +++ b/plugins/themes/default/styles/head.less @@ -97,7 +97,7 @@ position: absolute; width: 100%; top: 100%; - background:@bg-base; + background: @bg-base; left: 0; padding: @base; z-index: 9999; @@ -117,7 +117,7 @@ a { display: inline-block; - padding: 0.125rem 0; + padding: 0.86rem 0; color: @text-bg-base; text-decoration: none; @@ -128,6 +128,20 @@ } } + @media (max-width: @screen-desktop) { + + .active { + background-color: @bg-base-border-color; + + } + + .active a { + font-weight: bold; + + } + } + + #siteNav { position: absolute; top: 0; @@ -358,6 +372,20 @@ } } + // Visualy highlighting the current menu item + > li.active { + > a { + //background: @primary-lift; + border-color: @text-bg-base; + outline: 0; + } + + &:hover { + color: @bg-base; + border-color: red; + } + } + // Reproduce positioning of dropdown menu from Popper.js > li:hover ul { position: absolute; @@ -377,7 +405,8 @@ } .dropdown-menu a:focus, - .dropdown-menu a:hover { + .dropdown-menu a:hover, + .dropdown-menu li.active a { border-color: @primary; } @@ -511,4 +540,4 @@ } } } -} \ No newline at end of file +}