Commit Graph

7 Commits

Author SHA1 Message Date
Spicy_Marinara 50b5915400 Remove margins from UI elements and fix collapse button visibility
- Remove margins from rpg-stats-header, rpg-mood, rpg-panel-header, and rpg-manual-update-btn
- Fix collapse/expand button visibility by changing panel overflow to visible
- Increase collapse button z-index to 10001 for better layering
- Adjust collapse button positioning for better visual alignment
2025-10-14 19:39:36 +02:00
Spicy_Marinara ea10d1eaac Add collapsible panel, fix inventory scrolling, adjust toggle margins
- Add collapse/expand toggle button to side panels (left/right positions)
- Button shows on the outside edge of the panel with chevron icon
- Panel collapses to 40px vertical bar, button icon direction updates based on position
- Fix inventory box stretching issue by adding max/min height constraints
- Inventory items now scroll internally with flex layout
- Remove bottom margin from Enable Immersive HTML toggle
- Add top margin to Manual Update button to maintain spacing
2025-10-14 19:18:17 +02:00
Spicy_Marinara c35606bb28 fix(mobile): respect topbar height and enable proper scrolling
- Changed top: auto to top: var(--topBarBlockSize) to prevent panel from covering SillyTavern topbar
- Removed fixed height: 70vh/80vh properties that prevented proper sizing
- Panel height now determined by top/bottom constraints for natural fit
- Changed overflow-y: auto to overflow-y: scroll for reliable scrolling
- Added -webkit-overflow-scrolling: touch for iOS smooth scrolling
- Fixes panel covering entire screen, content squishing, and scroll issues
2025-10-14 14:57:17 +02:00
Spicy_Marinara 7440860402 feat: Add mobile-optimized FAB toggle button for panel
- Added floating action button (FAB) that appears only on mobile (≤768px)
- Panel becomes a bottom sheet modal on mobile instead of fixed sidebar
- Smooth slide-up animation with backdrop overlay
- Panel hidden by default on mobile, opens when FAB clicked
- Touch-friendly button sizes (44px minimum per Apple HIG)
- 70vh height on tablets, 80vh on phones for better usability
- Rounded top corners for modern mobile UI
- Desktop behavior unchanged
2025-10-14 14:39:45 +02:00
Spicy_Marinara 0926390205 fix: Add margin auto to keep chat centered with panel open
- Forces #sheld to use margin: auto when panel is visible
- Prevents chat from being pushed to one side
- Applies to both left and right panel positions
2025-10-14 13:16:06 +02:00
Spicy_Marinara 685c7ae1c2 fix: Make panel responsive and remove forced chat margins
- Removed margin-left/right on #sheld that was pushing chat to center
- Panel now overlays instead of pushing content
- Added responsive breakpoints for different screen sizes
- Width: 380px default, max 30vw, scales down on smaller screens
- Mobile: Full width at bottom on very small screens
- Panel no longer breaks layout on different screen sizes
2025-10-14 13:14:46 +02:00
Spicy_Marinara 518f2763aa Initial commit 2025-10-14 00:01:23 +02:00