diff --git a/README.md b/README.md index ba992e2..913c17e 100644 --- a/README.md +++ b/README.md @@ -98,6 +98,7 @@ And many thanks to the following people for contributing to the project with fee - [Elias Haberl](https://github.com/HuntTheSun) - [Pekka Klarck](https://github.com/pekkaklarck) maintainer of [Robot Framework](https://github.com/robotframework/robotframework) - [Daniel Biehl](https://github.com/d-biehl) maintainer of the [RobotCode Plugin](https://github.com/robotcodedev/robotcode) +- [Christian Zahl](https://github.com/poWer4aiX) ## 📋 License This project is licensed under the MIT License. diff --git a/docs/contributions.md b/docs/contributions.md index 82d8b87..f245179 100644 --- a/docs/contributions.md +++ b/docs/contributions.md @@ -18,3 +18,4 @@ And many thanks to the following people for contributing to the project with fee - [Elias Haberl](https://github.com/HuntTheSun) - [Pekka Klarck](https://github.com/pekkaklarck) maintainer of [Robot Framework](https://github.com/robotframework/robotframework) - [Daniel Biehl](https://github.com/d-biehl) maintainer of the [RobotCode Plugin](https://github.com/robotcodedev/robotcode) +- [Christian Zahl](https://github.com/poWer4aiX) \ No newline at end of file diff --git a/example/robot_dashboard.html b/example/robot_dashboard.html index 3d8eb2e..a586129 100644 --- a/example/robot_dashboard.html +++ b/example/robot_dashboard.html @@ -1,7 +1,7 @@ -Robot Framework Dashboard - 2026-03-10 01:03:15 +Robot Framework Dashboard - 2026-03-30 01:00:53 @@ -206,12 +206,128 @@ } .navbar { margin-bottom: 1rem; +flex-wrap: nowrap !important; +overflow: hidden; +} +#mainNavItems { +white-space: nowrap; +min-width: 0; +flex-shrink: 1; +} +#iconNavItems { +flex-shrink: 0; +flex-wrap: nowrap !important; } #navigation .nav-link svg { width: 24px; height: 24px; display: block; } +/* ── Sidebar (off-canvas menu for overflowed items) ── */ +.sidenav-backdrop { +position: fixed; +top: 0; left: 0; right: 0; bottom: 0; +background: rgba(0, 0, 0, 0.45); +z-index: 1049; +} +.sidenav { +position: fixed; +top: 0; left: 0; bottom: 0; +width: 280px; +max-width: 85vw; +z-index: 1050; +background: var(--color-card); +border-right: 1px solid var(--bs-border-color); +box-shadow: 4px 0 20px rgba(0, 0, 0, 0.25); +display: flex; +flex-direction: column; +transform: translateX(-100%); +transition: transform 0.25s ease; +} +.sidenav.sidenav-open { +transform: translateX(0); +} +.sidenav-header { +display: flex; +align-items: center; +justify-content: space-between; +padding: 12px 16px; +border-bottom: 1px solid var(--bs-border-color); +flex-shrink: 0; +} +.sidenav-title { +font-weight: 600; +font-size: 1rem; +color: var(--color-text); +} +.sidenav-close { +background: none; +border: none; +font-size: 1.4rem; +line-height: 1; +color: var(--color-text); +cursor: pointer; +padding: 0 4px; +} +.sidenav-close:hover { +color: var(--color-highlight); +} +.sidenav-body { +flex: 1; +overflow-y: auto; +padding: 8px 0; +} +.sidenav-section-label { +padding: 10px 16px 4px; +font-size: 0.75rem; +font-weight: 600; +text-transform: uppercase; +color: var(--color-text-muted); +letter-spacing: 0.05em; +} +.sidenav-body .sidenav-nav-item { +display: block; +padding: 6px 16px; +color: var(--color-menu-text); +text-decoration: none; +cursor: pointer; +white-space: nowrap; +overflow: hidden; +text-overflow: ellipsis; +border-left: 3px solid transparent; +} +.sidenav-body .sidenav-nav-item:hover { +background: rgba(255, 255, 255, 0.06); +color: var(--color-highlight); +} +.sidenav-body .sidenav-nav-item.active { +border-left-color: var(--color-highlight); +color: var(--color-highlight); +} +.sidenav-body .sidenav-nav-submenu { +padding-left: 32px; +font-style: italic; +} +.sidenav-icon-row { +display: grid; +grid-template-columns: repeat(3, auto); +gap: 4px; +padding: 6px 16px; +justify-content: start; +} +.sidenav-icon-row .nav-link { +padding: 6px; +} +.sidenav-icon-row .nav-link svg { +width: 22px; +height: 22px; +display: block; +} +#menuCustomTitle { +white-space: nowrap; +overflow: hidden; +text-overflow: ellipsis; +} /* === colors.css === */ :root { --color-bg: #eee; @@ -704,9 +820,19 @@
-