Refactor filter panels and enhance sidebar functionality

- Updated filter panel toggle icons from chevron-up to chevron-down across multiple pages for consistency.
- Added 'collapsed' class to filter content divs to manage visibility state.
- Enhanced library page button for tidying up media items, replacing the trash icon with a custom SVG broom icon.
- Improved CSS styles for sidebar and page header to ensure visibility and proper layout when the sidebar is collapsed.
- Introduced JavaScript functionality to manage sidebar width and state, including theme toggle for light/dark mode.
- Created a new notification drawer template that adapts based on the compact view state.
This commit is contained in:
Matt Batchelder
2026-02-05 09:04:06 -05:00
parent d8f8c0f916
commit 122d098be4
23 changed files with 2447 additions and 190 deletions

View File

@@ -270,6 +270,26 @@ hr {
padding: 0;
}
/* Dark-mode repair overrides: ensure sidebar doesn't draw a vertical divider */
#sidebar-wrapper,
.ots-sidebar {
border-right: none !important;
box-shadow: none !important;
}
/* Hide pseudo-elements that might draw a divider */
.ots-sidebar::before,
.ots-sidebar::after,
#sidebar-wrapper::before,
#sidebar-wrapper::after,
#page-wrapper::before,
#page-wrapper::after {
content: none !important;
display: none !important;
background: transparent !important;
box-shadow: none !important;
}
/* Sidebar Main Item */
.ots-sidebar li.sidebar-main > a {
display: flex;
@@ -740,7 +760,9 @@ textarea:focus {
.modal-content {
border-radius: var(--ots-radius-lg);
background-color: var(--ots-surface-2) !important;
background-color: var(--color-surface) !important;
color: var(--color-text-primary) !important;
border: 1px solid var(--color-border) !important;
}
.modal,
@@ -748,6 +770,7 @@ textarea:focus {
.modal-body,
.modal-footer {
background-color: transparent !important;
color: var(--color-text-primary) !important;
}
.modal-backdrop,
@@ -759,7 +782,7 @@ textarea:focus {
}
.modal-footer {
border-top: 1px solid var(--ots-border);
border-top: 1px solid var(--color-border) !important;
}
/* =============================================================================