Add sidebar toggle button to breadcrumb with open/close functionality

Move sidebar toggle from sidebar panel to breadcrumb navigation, positioned
left of the HOME icon. Uses distinct icons for open (sidebar-inset) and
closed (sidebar) states. Sidebar state persists via sessionStorage. Remove
old non-functional toggle buttons from layout and HTMLBlock plugin.
This commit is contained in:
2026-02-16 14:39:30 +01:00
parent b52d3a11be
commit e3a3cc5b6d
4 changed files with 89 additions and 37 deletions

View File

@@ -1167,8 +1167,11 @@ private function getGuidePage() {
* @return string Breadcrumb HTML
*/
public function generateBreadcrumb() {
// Sidebar toggle button (shown before home icon in breadcrumb)
$sidebarToggle = '<li class="breadcrumb-item sidebar-toggle-item"><button type="button" class="sidebar-toggle-btn" onclick="toggleSidebar()" title="Toggle Sidebar"><i class="bi bi-layout-sidebar-inset"></i></button></li>';
if (isset($_GET['search'])) {
return '<nav aria-label="breadcrumb"><ol class="breadcrumb"><li class="breadcrumb-item"><a href="?page=' . $this->config['default_page'] . '&lang=' . $this->currentLanguage . '"></a></li><li class="breadcrumb-item"> > </li><li class="breadcrumb-item active">' . $this->t('search') . '</li></ol></nav>';
return '<nav aria-label="breadcrumb"><ol class="breadcrumb">' . $sidebarToggle . '<li class="breadcrumb-item"><a href="?page=' . $this->config['default_page'] . '&lang=' . $this->currentLanguage . '"><i class="bi bi-house"></i></a></li><li class="breadcrumb-item"> > </li><li class="breadcrumb-item active">' . $this->t('search') . '</li></ol></nav>';
}
$page = $_GET['page'] ?? $this->config['default_page'];
@@ -1176,12 +1179,13 @@ private function getGuidePage() {
$page = preg_replace('/\.[^.]+$/', '', $page);
if ($page === $this->config['default_page']) {
return '<nav aria-label="breadcrumb"><ol class="breadcrumb"><li class="breadcrumb-item active"><i class="bi bi-house"></i></li></ol></nav>';
return '<nav aria-label="breadcrumb"><ol class="breadcrumb">' . $sidebarToggle . '<li class="breadcrumb-item active"><i class="bi bi-house"></i></li></ol></nav>';
}
$breadcrumb = '<nav aria-label="breadcrumb"><ol class="breadcrumb">';
// Start with home icon linking to default page (root)
// Start with sidebar toggle, then home icon linking to default page (root)
$breadcrumb .= $sidebarToggle;
$breadcrumb .= '<li class="breadcrumb-item"><a href="?page=' . $this->config['default_page'] . '&lang=' . $this->currentLanguage . '"><i class="bi bi-house"></i></a></li>';
// Split page path and build breadcrumb items

View File

@@ -127,6 +127,37 @@
text-decoration: underline;
}
/* Sidebar toggle button in breadcrumb */
.sidebar-toggle-item {
display: flex;
align-items: center;
margin-right: 0.5rem;
}
.sidebar-toggle-btn {
padding: 0;
line-height: 1;
font-size: 1.1rem;
color: var(--header-bg) !important;
border: none !important;
background: transparent !important;
box-shadow: none !important;
cursor: pointer;
}
.sidebar-toggle-btn:hover {
opacity: 0.7;
}
/* Sidebar hide/show transition */
.sidebar-column {
transition: all 0.3s ease;
}
.sidebar-hidden {
display: none !important;
}
/* Navigation section background */
.navigation-section {
background-color: var(--nav-bg) !important;