- Fix inverted chevron logic: show left arrow when panel open, right arrow when closed
- Move FAB button from right to left side of screen (12px from left edge)
- Adjust vertical position down by 30px for better placement
- Update console logging to reflect correct icon states
Add full mouse and touch support for mobile toggle button with drag-to-reposition
functionality and persistent position saving.
Changes:
- Add mobile FAB button with draggable positioning (both mouse and touch)
- Implement time-based drag detection (200ms or 10px threshold)
- Add position persistence in extension settings
- Fix click handler to work on both mobile and desktop viewports
- Add comprehensive diagnostic logging for event debugging
- Update mobile panel to slide from right (matching desktop UX)
- Implement dual-button pattern (FAB + internal collapse toggle)
- Add viewport-constrained dragging with 10px padding
- Prevent click events from firing after drag completion
Mobile UX:
- FAB visible when panel closed, hidden when open
- Internal collapse toggle visible only when panel open
- Touch and mouse drag support with real-time positioning
- Click/tap toggles panel, drag repositions button
- Position saved across sessions
Technical:
- Add mousedown/mousemove/mouseup handlers for desktop drag
- Add touchstart/touchmove/touchend handlers for mobile drag
- Remove broken viewport check that prevented mobile clicks
- Add 'just-dragged' flag to prevent click after drag
- Update .gitignore to exclude CLAUDE.md and .env files
- Reorganized User Stats: moved portrait and inventory side-by-side, removed header
- Fixed Info Box widgets: made them square-shaped with proper scaling at all zoom levels
- Fixed stat bars: added overflow scrolling to prevent overlapping with mood box
- Added responsive compact layout: text moves inside bars at 120%+ zoom
- Improved spacing: bars now fill available space naturally at 100% zoom
- All elements now scale properly from 100% to 150%+ zoom
- Add bottom-sliding drawer system for mobile (≤1000px viewport)
- Implement tabbed navigation with Stats and Info & Characters tabs
- Combine Info Box and Present Characters into single tab with 50/50 split
- Add smooth transitions between desktop and mobile layouts
- Reposition collapse button as close button on mobile
- Implement FAB toggle button for opening mobile drawer
Mobile Stats Tab:
- Use CSS Grid layout for efficient space utilization
- Portrait centered at top, stat bars below
- Inventory and mood on left, attributes list on right
- Convert attributes from 3x2 grid to vertical list
Mobile Info Box:
- Scale dashboard widgets to fill allocated space
- Proportional row heights (60% top row, 40% location)
- Widgets expand to fill available vertical space
Technical improvements:
- Bottom-based drawer positioning instead of transform
- CSS-only transitions, JavaScript only toggles classes
- Instant tab setup on desktop→mobile for smooth transition
- Temporary transition disabling for mobile→desktop snap
- Proper flex hierarchy for space filling
- Add pendingDiceRoll variable to store temporary roll result
- Clicking X or overlay now discards the roll without saving
- Only save to settings when user explicitly clicks 'Save Roll' button
- Prevents unwanted rolls from being saved to the sidebar display
- Convert font-size from px to rem for better accessibility
- Convert padding/margin/gap from px to em for responsive scaling
- Convert width/height/position values to rem
- Convert letter-spacing and transforms to responsive units
- Keep shadows, small borders (1-3px), and media queries as px
- Fix buttons (Manual Update & Settings) to use 100% width and 2.5rem height
- Fix TypeScript error: add missing id property to regexScript object
- Changed property name from quietPrompt to quiet_prompt (underscore notation)
- Removed unnecessary context manipulation code
- Pass prompt via Generate() options with correct property naming
- This fixes custom prompts not appearing in continuation generation
- Remove all margins from both Refresh RPG Info and Settings buttons
- Set exact dimensions: width 353px, height 33px for both buttons
- Remove padding and use box-sizing: border-box for precise sizing
- Both buttons now identical in size
- Add negative top margin to Refresh button to compensate for parent gap
- Match Settings button styling to Refresh button (border, radius, font-size, shadow)
- Dynamically detect extension location using import.meta.url
- Support installation in public/extensions (install for all users)
- Support installation in data/default-user/extensions (install just for me)
- Automatically sets correct extensionFolderPath based on detected location
- 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
- Adds ensureHtmlCleaningRegex() function that automatically imports a regex script
- Regex removes HTML tags from outgoing prompts to prevent formatting issues
- Only imports if not already present (checks existing scripts by name)
- Based on the regex-clean_html_(from_outgoing_prompt).json specification
- Runs on extension initialization
- Non-blocking: won't fail extension load if regex import fails
- 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
- 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
- Changed from $('#sheld').after/before() to $('body').append()
- Panel is now a direct child of body element
- Works better with SillyTavern's main flexbox layout
- CSS handles all positioning (no more DOM position logic)
- 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
- 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
- Changed to 'third-party/rpg-companion-sillytavern'
- User-installed extensions need the third-party prefix
- Template loader looks for scripts/extensions/third-party/[name]
- Changed import paths from ../../ to ../../../
- User-installed extensions are in data/default-user/extensions/
- Paths need one more level up to reach script.js and other core files
- Generate function may not exist in older SillyTavern versions
- Added fallback check for window.Generate before using it
- Should fix '[object Event]' loading error on release branch
Lucas 'Paperboy' Rose-Winters
Spicy_Marinara