Octoprint: [Request] please add a 16:9 screen layout - best auto-switched.

[dothebart]

Most computer displays nowadays are 16:9 - 4:3 s vanished. Octoprints UI however mostly shows 4:3 layout. The most anoying result of that is that the file upload button and the file selector dialog is out of reach when using the rest of the UI.
Please use the full available screen realestate for octoprint.

[tedder]

@dothebart how are your css/responsive skills?

[dothebart]

Well, if they'd be anywhere near mentionable I'd have sent a pr ;) I'm a C/C++ Backend guy.

[LMS0815]

Might be possible to add something to: Themeify plugin

[jneilliii]

Details on the community forum.
https://community.octoprint.org/t/pimp-my-web-interface/3349

Also, the widescreen plugin allows you to move some things around.

[dothebart]

Ah, thanks for the sugestions, I was searching the plugins, but didn't find these.
Can any of these be made the sane default in future?

[tsmes]

It seems like the UI depends on Bootstrap v2.3.1 released in 2012. I could take a crack at updating the UI to a newer layout but before taking on a task like that it would be nice to know what the target browser support is.

[fieldOfView]

@tsmes: Not an answer to your question, but nevertheless a discussion with some possible directions here:
https://github.com/foosel/OctoPrint/issues/2420

[LMS0815]

Themeify plugin / Try this to dynamically use the full screen width:

calc(95% - 340px)

[stantond]

A slight tangent... maybe this raises the need for a tech debt issue to update to the latest version of Bootstrap (currently v4.4.1 at https://getbootstrap.com/).

@foosel maybe some of the 1.4.x iterations could be updating other components and dependencies before adding features, given it's the Python 3 release? Or maybe it's best to leave 1.4 to stabilise after release, and think of other dependency updates from 1.5? (P.s. let me know if you could use a hand building a roadmap, can't contribute production quality code but can certainly help with product management).

EDIT: Here it is, #2420. Sounds like there are a few people keen to work on this, but they could use some steer and organisation.

[johankvint]

@tsmes I would be happy to help.
Updating to bootstrap 4 should not be "that" hard.
Question is what to do with plugins but maybe we can wrap them somehow and still have the old bootstrap side by side for a while

Main reason I started looking in here was to see if there where any plans for better file management, but this could be a fun project too :)