- Light mode: accent color linked to sidebar (#212121)
- Dark mode: sidebar uses very dark color (#0a0a0a)
- Add CSS override for solid monochrome sidebar background
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Reorder options: responsive first, then top, then bottom
- Change default tabBarPosition from 'top' to 'responsive'
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Clicked tabs now scroll to center of container automatically
- Behavior works on all pages using TabsScroller
- Removed duplicate scroll logic from Features.tsx
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Add user initial button on the right side of mobile header
- Navigate to settings on click
- Style matches desktop sidebar (semi-transparent accent background)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Add --tabs-content-gap variable (24px) for consistent tab bar gaps
- Add --section-gap-lg (32px) and --section-gap-xl (48px) for section spacing
- Update Layout.css to use parametric spacing for all tab positions
- Update ThemeSettings.css to use section gap variables
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Use fixed 24px padding for mobile bottom tab bar instead of complex
variable calculations. This provides consistent spacing that matches
the desktop visual appearance.
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Set --page-padding-y-mobile-bottom-gap to var(--space-3) to match
the top gap, providing consistent spacing around the tab bar on mobile.
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Re-measure tab bar height when tabBarPosition changes from 'top' to
'responsive'. This fixes the issue where bottom padding was incorrect
on first load because the CSS variable was measured before the backend
loaded the responsive position setting.
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Add page-padding-y-mobile gap after title bar offset
- Align mobile padding calculations with desktop behavior
- Update all tab position rules (top, bottom, responsive)
- Add CSS variables for mobile spacing control
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Create MobileTitleBar component with fixed top position
- Split title bar from tabs bar on mobile (title always on top)
- Add data-has-actions attribute for action button detection
- Track --tab-pill-height CSS variable for tab buttons
- Remove extra padding from mobile content padding-top
- Hide tabs container when no tabs or actions present
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Add CSS rules for data-tab-position='top' and 'responsive' (desktop):
- Fixed positioning at top with proper sidebar offset
- Content padding-top to account for bar height
- Mobile breakpoint handling
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Add .admin-tab-swipe to padding-bottom rules for bottom position
- Add mobile-specific padding rules for data-tab-position='bottom'
- Update responsive position rules to include .admin-tab-swipe
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Restore bottom padding for .page-content and .admin-tab-content
across all breakpoints (was accidentally set to 0)
- Change bottom tab bar padding from max() to calc(padding + bar-height)
so content has both regular margin AND space for fixed tab bar
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Remove display: grid and grid-template-rows: 1fr that was
causing content to expand and fill available space.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Remove min-height from main-content
- Remove flex: 1 from page-content and admin-tab-swipe
- Content areas no longer expand to fill viewport height
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Remove padding-bottom from page-content and admin-tab-content
across all responsive breakpoints to eliminate extra scrollable
space at the bottom of pages.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Use 100dvh (dynamic viewport height) instead of 100vh to fix
the extra scrollable space caused by mobile address bar height.
Keeps 100vh as fallback for unsupported browsers.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Add overscroll-behavior: none to html and body elements
to prevent rubber-band scrolling that shows extra space.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Create SwipeableContent component for sidebar swipe on non-tab pages
- Add swipe-to-close sidebar from overlay
- Make swipe work from entire page (ignoring interactive elements)
- Show title and divider on desktop when tab bar is at bottom
- Hide title/divider only on mobile for bottom position
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- SwipeTabs: Delay pointer capture until drag starts for better tap detection
- Features: Only allow drag via handle dots, not entire card
- Features: Smart hasOrderChanges - hide buttons when order returns to initial
- Features: Don't apply dragging style until movement exceeds threshold
- ThemeSettings: Add role="button" for accessibility on all option cards
- Sidebar: Light theme active menu item styling improvements
- Layout: Tab bar translucency and blur effects
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
When swiping right on the first tab, opens the mobile sidebar menu.
Added onSwipePastStart prop to SwipeTabs component.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Remove extra top padding when tab bar is at bottom
- Increase edge swipe threshold from 30px to 50px
- Reduce minimum swipe distance from 50px to 40px
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Add theme_tab_bar_position setting (top/bottom/responsive)
- Tab bar is now fixed at top, stays visible during scroll
- Bottom position uses fixed positioning with safe-area-inset
- Add edge swipe gesture to open sidebar on mobile
- Remove backdrop-filter for better scroll performance
- Simplify TabsScroller by removing inline style manipulation
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Highlight user menu trigger when on pages accessible from dropdown
(admin/*, settings, api-keys)
- Add .active styling for dropdown menu items (current page)
- Use NavLink end prop on /admin to prevent false positive matches
- Support auto accent color overrides for light backgrounds
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Remove the blue/gray selection overlay that appears when tapping
buttons, links, sidebar items and other interactive elements on
mobile devices.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Replace HTML5 Drag and Drop API with pointer/touch event handling
for better mobile support:
- Add pointer event handlers for desktop/stylus drag
- Add global touch event listeners for mobile drag
- Track drag state with refs for consistent behavior
- Calculate drop position based on Y coordinate
- Improve Cancel to restore from initial snapshot
Also improve SwipeTabs to ignore interactive elements (buttons,
links, inputs) during swipe detection, and add touch-action: none
to order cards for proper touch handling.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Tabs now use applied order (moduleOrder) instead of local pending order
- Cards still show local order for drag preview feedback
- Cancel button correctly restores to the applied state from context
- Apply button updates both tabs and sidebar after saving
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Use React.TouchList and React.Touch types instead of native DOM types
to resolve type compatibility issue.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Rewrite SwipeTabs with improved touch handling and animation
- Use translate3d with smoother easing curve (280ms)
- Add coalesced pointer events for high refresh rate displays
- Clean up redundant CSS styles across multiple files
- Add page-max-width dimension variable
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Rewrite SwipeTabs to use CSS scroll-snap for smoother transitions
- Add GPU acceleration hints for fluid animations
- Use native scrolling behavior instead of manual touch handling
- Add swipe-tabs--snap and swipe-tabs--static variants
- Improve height transitions and layout containment
- Update dimension variables for better spacing
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Backend:
- Optimize file listing for non-superusers with dedicated CRUD methods
- Add get_visible_for_user and count_visible_for_user for efficient queries
- Move /allowed-types/ and /max-size/ routes before /{file_id} for proper matching
- Rename notification 'metadata' field to 'extra_data' for clarity
- Fix settings export to use get_value() method
Frontend:
- Update NotificationItem interface to use extra_data field
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Remove indigo tints from default palette light/dark themes.
Use neutral slate-gray colors for backgrounds and text, letting
the accent color provide visual highlights in interactive elements.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Fix mobile Features page to respect lateral borders/padding
- Fix drag state not resetting properly when Apply/Cancel pressed
- Improve mobile UI consistency across all pages
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
- Remove icons from all page title sections in tab bars
- Fix double padding on mobile for Features page
- Fix drag state not resetting when Apply/Cancel pressed
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Fix module ordering with local state tracking for immediate UI updates
- Add tab centering when selected (scroll to center)
- Use finally block in handleApplyOrder to ensure state reset
- Add cancelOrder translation key
- Increase order card min-width for better readability
- Normalize mobile top bar height with min-height constraint
- Add display:flex to mobile title sections for proper layout
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Backend:
- Add 2FA authentication with TOTP support
- Add API keys management system
- Add audit logging for security events
- Add file upload/management system
- Add notifications system with preferences
- Add session management
- Add webhooks integration
- Add analytics endpoints
- Add export functionality
- Add password policy enforcement
- Add new database migrations for core tables
Frontend:
- Add module position system (top/bottom sidebar sections)
- Add search and notifications module configuration tabs
- Add mobile logo replacing hamburger menu
- Center page title absolutely when no tabs present
- Align sidebar footer toggles with navigation items
- Add lighter icon color in dark theme for mobile
- Add API keys management page
- Add notifications page with context
- Add admin analytics and audit logs pages
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Remove unused stat-cards and simplify Dashboard to empty state,
ready for future content.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
In toggle mode, sidebar now collapses automatically when mouse
leaves the sidebar area (after being expanded by click).
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Add modules_order setting in backend settings registry
- Update ModulesContext with moduleOrder state and save functions
- Create configuration tab in Features page with drag-and-drop reordering
- Make feature tabs dynamic based on order (updates in real-time)
- Sort sidebar modules based on saved order
- Add order-cards CSS with vertical layout
- Update API client to support string[] type for modules_order
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
