Responsive UI Improvement: Activity Overview Configuration Panel Layout on Laptop Resolutions
-
Title
Responsive UI Improvement: Activity Overview Configuration Panel Layout on Laptop Resolutions
Category
UI/UX Enhancement
Environment
QloApps Version: 1.7.0
Browser: (Chrome/Firefox)
OS: Windows 11
Device: Laptop (1366×768)Description
While exploring the Dashboard's Activity Overview widget, I observed a responsive layout inconsistency in the Configuration panel.
The layout renders correctly on larger desktop monitors. However, on laptop-sized viewports with the left navigation menu expanded, the available horizontal space becomes limited, causing field labels to wrap into multiple lines and making the form appear compressed.
When the left navigation menu is collapsed, the same configuration panel displays correctly without label wrapping.
This indicates that the behavior is dependent on the available viewport width rather than the functionality itself.
Steps to Reproduce
Login to the QloApps Admin panel.
Navigate to Dashboard.
Keep the left navigation menu expanded.
Click the Configuration (
️) icon in the Activity Overview widget.
Observe the layout on a laptop resolution.
Collapse the left navigation menu and compare the layout.
Actual Result
Labels wrap into multiple lines.
The configuration form appears compressed.
Overall readability is reduced.
Expected ResultThe configuration panel should maintain a consistent and readable layout across commonly used laptop resolutions, regardless of whether the left navigation menu is expanded or collapsed.
Observation
This does not affect functionality, but improving the responsive layout would provide a more consistent user experience across different screen sizes.