feat(dashboard): improve mobile inventory UX and fix desktop viewport overflow
Mobile Inventory Improvements: - Add icon-based sub-tabs (user/box/building) with responsive labels - Desktop shows icon + label, mobile shows icon-only for compact layout - Add proper scroll containers for inventory content with flex layout - Increase touch drag delay from 150ms to 500ms to prevent accidental widget moves during scrolling Widget Content Fixes: - Add max-height constraint to .rpg-widget to prevent grid cell overflow - Add flex properties (flex: 1, min-height: 0, overflow: auto) to all widget content - Ensures content scrolls internally instead of expanding widget bounds - Fix .rpg-inventory-widget to use flex properties instead of height: 100% Layout Fixes: - Change characters widget default size from 2x3 to 2x2 for better viewport fit - Remove excess spacing from dashboard container (gap: 0.75rem) - Remove vertical padding from dashboard header - Eliminates desktop scrollbar caused by cumulative spacing All widgets now fit properly within viewport on both desktop and mobile.
This commit is contained in:
@@ -237,7 +237,7 @@ export function registerPresentCharactersWidget(registry, dependencies) {
|
||||
description: 'Character cards with avatars, traits, and relationships',
|
||||
category: 'scene',
|
||||
minSize: { w: 2, h: 2 },
|
||||
defaultSize: { w: 2, h: 3 },
|
||||
defaultSize: { w: 2, h: 2 }, // Compact size fits both mobile and desktop viewports
|
||||
maxAutoSize: { w: 4, h: 5 }, // Max size for auto-arrange expansion (supports up to 4-col on large displays)
|
||||
requiresSchema: false,
|
||||
|
||||
|
||||
Reference in New Issue
Block a user