OpenWF/SpaceNinjaServer
12
6
Fork 14
Code Issues 47 Pull Requests 1 Actions Packages Projects Releases Activity

fix(webui): sidebar toggler not showing up on small screens (#2053)
Some checks failed
Build / build (push) Has been cancelled
Details
Build Docker image / docker (push) Has been cancelled
Details

Browse Source 
Closes #2049

Reviewed-on: #2053
Co-authored-by: Sainan <63328889+Sainan@users.noreply.github.com>
Co-committed-by: Sainan <63328889+Sainan@users.noreply.github.com>
This commit is contained in:
Sainan 2025-05-10 19:12:25 -07:00 committed by Sainan
parent 5bc39aac8a
commit d5297d3547
2 changed files with 13 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
static/webui/index.html
View File

@ -7,9 +7,9 @@
<link rel="stylesheet" href="/webui/style.css" />
</head>
<body>
<nav class="navbar navbar-expand sticky-top bg-body-tertiary">
<nav class="navbar navbar-expand-lg sticky-top bg-body-tertiary">
<div class="container">
<button class="navbar-toggler d-lg-none" type="button" data-bs-toggle="offcanvas" data-bs-target="#sidebar" aria-controls="sidebar" aria-label="Toggle sidebar">
<button class="navbar-toggler d-lg-none me-3" type="button" data-bs-toggle="offcanvas" data-bs-target="#sidebar" aria-controls="sidebar" aria-label="Toggle sidebar">
<span class="navbar-toggler-icon"></span>
</button>
<a class="navbar-brand">OpenWF WebUI</a>
@ -49,7 +49,7 @@
<div class="container pt-3 pb-3" id="main-view">
<div class="offcanvas-lg offcanvas-start" tabindex="-1" id="sidebar" aria-labelledby="sidebarLabel">
<div class="offcanvas-header">
<h5 class="offcanvas-title" id="sidebarLabel">Sidebar</h5>
<h5 class="offcanvas-title" id="sidebarLabel">OpenWF WebUI</h5>
<button type="button" class="btn-close" data-bs-dismiss="offcanvas" data-bs-target="#sidebar" aria-label="Close"></button>
</div>
<div class="offcanvas-body">

10
static/webui/style.css
View File

@ -29,3 +29,13 @@ td.text-end > a > svg {
.card-body {
overflow: auto;
}
/* fixes for navbar on small resolutions due to not being navbar-expand */
.navbar.sticky-top .navbar-nav {
flex-direction: row;
}
.dropdown-toggle {
padding-right: var(--bs-navbar-nav-link-padding-x);
padding-left: var(--bs-navbar-nav-link-padding-x);
}