diff --git a/src/systems/dashboard/dashboardManager.js b/src/systems/dashboard/dashboardManager.js index 23bd3fc..2527823 100644 --- a/src/systems/dashboard/dashboardManager.js +++ b/src/systems/dashboard/dashboardManager.js @@ -1221,6 +1221,17 @@ export class DashboardManager { }); } + // Call onResize handlers for all rendered widgets to apply responsive styling + // This ensures compact classes are applied based on widget dimensions + console.log(`[DashboardManager] Calling onResize for ${this.widgets.size} widgets after tab switch`); + this.widgets.forEach(widgetData => { + if (widgetData?.definition?.onResize && widgetData.element) { + const widget = widgetData.widget; + console.log(`[DashboardManager] Calling onResize for ${widget.type} (${widget.w}x${widget.h})`); + widgetData.definition.onResize(widgetData.element, widget.w, widget.h); + } + }); + // Disable content editing once for all widgets if in edit mode // (More efficient than per-widget queries - 2 queries vs 2N queries) if (this.editManager && this.editManager.isEditMode) { diff --git a/src/systems/dashboard/widgets/questsWidget.js b/src/systems/dashboard/widgets/questsWidget.js index 14c61e9..28f7487 100644 --- a/src/systems/dashboard/widgets/questsWidget.js +++ b/src/systems/dashboard/widgets/questsWidget.js @@ -460,9 +460,11 @@ export function registerQuestsWidget(registry, dependencies) { if (newW >= 3) { // Wide layout: constrain title width widget.classList.add('rpg-quests-wide'); + widget.classList.remove('rpg-quests-compact'); } else { - // Narrow layout: allow title to flex + // Narrow layout: compact mode with truncated headers widget.classList.remove('rpg-quests-wide'); + widget.classList.add('rpg-quests-compact'); } } } diff --git a/style.css b/style.css index e06c9c7..27c349f 100644 --- a/style.css +++ b/style.css @@ -7684,6 +7684,36 @@ body:has(.rpg-panel.rpg-position-left) #sheld { margin: 0; } +/* Compact mode: truncate long header titles */ +.rpg-inventory-compact .rpg-inventory-header h4 { + font-size: 0.9rem; + max-width: 140px; /* Constrain to prevent overflow */ + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; +} + +/* Compact mode: reduce header action button sizes */ +.rpg-inventory-compact .rpg-inventory-header-actions { + gap: 0.5rem; /* Reduced from 0.75rem */ +} + +.rpg-inventory-compact .rpg-inventory-add-btn { + font-size: 0; /* Hide text, show icon only */ + padding: 0.4rem; + min-width: 32px; + min-height: 32px; +} + +.rpg-inventory-compact .rpg-inventory-add-btn i { + font-size: 1rem; /* Restore icon size */ +} + +.rpg-inventory-compact .rpg-view-toggle-btn { + padding: 0.4rem; + min-width: 32px; +} + /* ============================================ QUESTS SYSTEM STYLING ============================================ */ @@ -7956,6 +7986,34 @@ body:has(.rpg-panel.rpg-position-left) #sheld { gap: 1rem; } +/* Quest widget compact mode (narrow widths, < 3 grid units) */ +.rpg-quests-compact .rpg-quest-section-title { + font-size: 0.95rem; + max-width: 120px; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; +} + +.rpg-quests-compact .rpg-quest-header { + gap: 0.5rem; /* Reduced from default */ +} + +.rpg-quests-compact .rpg-add-quest-btn { + font-size: 0; /* Hide text, show icon only */ + padding: 0.4rem; + min-width: 32px; + min-height: 32px; +} + +.rpg-quests-compact .rpg-add-quest-btn i { + font-size: 1rem; /* Restore icon size */ +} + +.rpg-quests-compact .rpg-quest-item { + padding: 0.5rem; /* Reduced padding */ +} + /* Mobile Responsive Styles */ @media (max-width: 768px) { .rpg-quests-subtabs {