Skip to content

WebUI: Limit window sizes to viewport size #22919

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 1 commit into from
Jul 6, 2025

Conversation

Piccirello
Copy link
Member

@Piccirello Piccirello commented Jun 25, 2025

This change makes the WebUI easier to use on small screens (e.g. mobile). In cases where the window's default size is larger than the user's screen, the window will be resized appropriate (see example below). Every window has been tested for compatibility. The only windows that don't support this are the multi file rename window and the RSS Downloader window.

Height and width auto resized to fit on screen w/ small margin:
IMG_9562

Closes #19813

@Piccirello Piccirello requested a review from a team June 25, 2025 04:52
@Piccirello Piccirello added the WebUI WebUI-related issues/changes label Jun 25, 2025
Comment on lines -950 to +951
width: loadWindowWidth(id, 800),
height: loadWindowHeight(id, 650),
width: loadWindowWidth(id, 800, false),
height: loadWindowHeight(id, 650, false),
Copy link
Member Author

@Piccirello Piccirello Jun 25, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Viewport size limitations disabled for RSS downloader window. The height probably doesn't need to be limited, since it appears to support scrolling, but I figured this window's sizing can be handled later all at once.

@@ -325,7 +336,7 @@ const initializeWindows = () => {
maximizable: false,
paddingVertical: 0,
paddingHorizontal: 0,
width: 424,
width: limitWidthToViewport(424),
height: 100
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I opted not to add the limiter to the vast majority of window heights since they're already so small.

This change makes the WebUI easier to use on small screens (e.g. mobile). Every window has been tested for compatibility.
@Chocobo1 Chocobo1 merged commit 0e0b1d0 into qbittorrent:master Jul 6, 2025
15 checks passed
@Chocobo1
Copy link
Member

Chocobo1 commented Jul 6, 2025

@Piccirello
Thank you!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
WebUI WebUI-related issues/changes
Projects
None yet
Development

Successfully merging this pull request may close these issues.

WebUI [BUG] - Save button not seen again in 4.6.0 in the Setting in long menus
3 participants