Repository navigation
[UI] Improve Responsiveness of Extension Popup Across Different Screen Sizes #418
Description
Activity
👋 Hi @maheshbhojane1, thank you for opening this issue! I have automatically assigned this issue to you since you raised it.
Please follow the contribution guidelines and submit a PR. Let us know if you need any assistance! 🚀
Please consider starring the repository ⭐ to show your support!
Hey @shouri123 @maheshbhojane1, I'd love to take this up! I can refactor the fixed-width extension popup layout using modern responsive CSS techniques so it scales perfectly across different browser zoom levels and smaller viewports.
Could you please assign this to me?
Hi @vipu2404-cyber! This issue is already assigned to @maheshbhojane1. Please look for other unassigned issues to work on. 🚀
Please consider starring the repository ⭐ to show your support!
ok
@vipu2404-cyber i have assigned this issue to you as @maheshbhojane1 he was assigned other issues so you can contribute and also dont forget to star the repo
OK I WILL CONTRIBUTE TO THIS
Description
The extension popup currently relies on a fixed width layout, which can cause UI inconsistencies when users have different browser zoom levels, display scaling settings, or smaller viewport dimensions.
A responsive layout would improve usability and ensure all elements remain properly aligned and accessible across various screen sizes.
Current Behavior
Popup uses a fixed width.
Certain elements may appear cramped or misaligned on smaller viewports.
Layout flexibility is limited.
Expected Behavior
Popup should adapt smoothly to different viewport widths.
Content should remain readable and properly aligned.
No horizontal overflow or clipping should occur.
Proposed Solution
Replace fixed sizing with responsive units where appropriate.
Add media queries for smaller viewport widths.
Test popup layout under different browser zoom levels and display resolutions.
Acceptance Criteria
Popup layout remains visually consistent at different zoom levels.
No horizontal scrolling occurs.
All interactive elements remain accessible.
Responsive behavior is tested across common viewport sizes.
Difficulty: Beginner