Desktop layout fixes to be fully fluid with no hardcoded pixel dimensions #115
Conversation
…es to before body close tag.
…ardcoded pixel dimensions are not used in CSS calc(). Nav moved into body to get proper sizing for subsequent elements. Additional Divs added to make resizing work. Controller Messages box has min-height so always visible; otherwise resizes to available space. Fixed JS resizing to shrink when window made smaller.
… 'Controller Messages' heading smaller. Gives 4 more lines for controller message display on 1080P screen.
|
Wow.. this is awesome. It's like you know what you are doing! This has been one (and I have many) of my biggest concerns. Funny you spent a day at it.. I spent weeks upon weeks trying to get it so it at least works and I knew it wasn't how I should have been done. If you can merge in my recent updates (I swear.. I'm stopping), let's do one big merge into an 'experimental' branch with all your changes and set the release to 0.1 or something low and ask people that want to test it to 'downgrade' to that version. I'll clear out all the old releases so it's just the current version and this 'experimental' version. Because the version is lower that the current version, it won't put a badge on the screen for user, but t a user can always 'downgrade' to it. Ultimately it would be nice to add a feature or tag or something that can filter on experimental versions, but that's work that can be done later. |
|
Glad you like it. The visual change is so small that I wondered if it would get accepted. I worked as UI designer for a number of years but now mainly do server side code. Its good that you had so much perseverance getting it working. I was getting frustrated after 6 hours! The controller message box was resizing when new lines were added to it and standard CSS was not restricting it. Finally remembered the absolute position trick which made it work. Merged changes from master into this pull request. The only conflict was version numbers for CSS links in frontpage3d.html. Also updated #112 which merged cleanly. These two pull requests should merge cleanly as they alter different files. Let me know what other things are bugging you (here, or PM in Maslow forum)? |
|
I think if you can make a single fork with everything in it, I can do a few tests and then PR it in (not that I don't trust your work, just feel it's wise to check). I can't think of any ui related issues that still bug me. One day we'll need to look at reworking all the websocket communications into a consistent manner. Right now it's a bit of a hodge-podge. |
|
On Sun, 22 Mar 2020, gb0101010101 wrote:
Let me know what other things are bugging you (here, or PM in Maslow forum)?
go through the github issues, I don't think there are big ones, but some small
things are there (an improved 'reset chains' menu that only has what you really
need there, not other things that will cause grief if you use them, an http
endpoint that would let you use something like curl to send arbitrary g-code
rather than having to navigate a menu first)
minor things that are almost all additions, not changes to the existing UI
David Lang
|
3 participants
Well this turned out to be a lot more work then I expected and took almost a solid day.
I have split it out into many commits to make it easier to see what has changed as there are a few source code formatting commits. The main changes are for desktop layout only, with minor fixes for mobile.
Bootstrap Layout:
<body>and part of the layout so no need for offset padding.calc()from CSS that used fixed pixel sizes that did not work properly.Jijna templates:
</body>which is optimal place for loading.{% Head %}template block in HTML<head>for additional CSS files. Move CSS files that were in{% Header %}to be in{% Head %}.Template HTML:
</div>that was in a number of frontpage* files. Had to format source code and compare to see where the extra tag came from.Testing:
ToDo:
#workareaseems to be reporting a size slightly too bid. I cannot anything in CSS that is causing this. If you have any ideas let me know. This temp fix is causing the white padding at bottom of#workarea.Merge Fix:
Noticed this will not cleanly merge due to changes in past two days to master. Let me know if you want me to merge master in to my fork.
Screenshot After: