fbordina / pwm

Automatically exported from code.google.com/p/pwm
0 stars 0 forks source link

layout issue + JSP formatting #407

Closed GoogleCodeExporter closed 9 years ago

GoogleCodeExporter commented 9 years ago
What steps will reproduce the problem?
1. Go to the PWM frontend
2. Resize the browser window so that the footer div meets the centerbody div

What is the expected output? What do you see instead?
I would expect that scroll bars would become visible when the footer div 
reaches the margin of the centerbody div. However, the footer div overlaps the 
centerbody div.

To fix this issue for all browsers, a push div needs to be added to the wrapper 
div with a height that matches the footer div (based on 
http://ryanfait.com/sticky-footer/). Because the wrapper div is defined in each 
JSP, this requires touching all the JSP's, which is not a bad thing: the 
current implementation of the JSP's need some love ;):

- indentation seems to be inconsistent for some pages
- some JSP's are not well formed (dangling div closing tags)

What version of PWM are you using?
latest build

I'm willing to put some time/ effort in this bugfix when this ticket is 
accepted.

Original issue reported on code.google.com by sebastia...@gmail.com on 14 Jun 2013 at 7:20

Attachments:

GoogleCodeExporter commented 9 years ago
I agree the JSP's could use a little bit of love to fix inconsistencies and/or 
missing/extra closing tags, so a patch for that would be welcome.

As for the floating footer, I think this is actually working already in the 
default stylesheet.  It's based on a slightly different design, but note the 
negative margin-top in the #footer, the padding-bottom in #centerbody, and 
others I can't remember.  I haven't noticed any real issues with it, but I'm 
betting in some of the non-standard themes may not work right.  In any case, 
you may be noticing something I'm not.  I'm generally open to any CSS changes 
so long as the footer still "floats" and pages work more or less the way they 
do in the default theme as today.  

Original comment by jrivard on 19 Jun 2013 at 12:21

GoogleCodeExporter commented 9 years ago
Thanks for your feedback!

I noticed that currently the footer is already floating, but the negative 
margin-top combined with the padding-bottom does not seems to work properly. 
With Firefox/ IE I have an overlap between the centerbody div and the footer 
upon resizing the browser window. This is also with the default PWM theme, but 
not directly noticeable, due too the matching background color of the 
centerbody and footer div and the lack of any borders. Attached a screenshot of 
the default theme with an a border on the centerbody div to make the layout 
issue visible.

I'll post a patch soon that won't visibly change the default theme, but just 
fixes the layout issue. I'll combine that with other fixes, like indenting and 
missing/extra closing tags.

Original comment by sebastia...@gmail.com on 19 Jun 2013 at 6:26

Attachments:

GoogleCodeExporter commented 9 years ago
Hereby a patch which does not break the current themes of PWM, but fixes a 
couple of issues:

- the sticky footer CSS has been updated to not overlap the centerbody by using 
a different cross-browser compatible technique
- all JSP's have an added push div to support the sticky footer
- all JSP's are fixed for dangling openning/ closing tags
- all JSP's are fixed for a correct indenting
- added footer to some JSP's that didn't have one (i.e. REST and license pages)
- reworked the footer JSP by adding an extra wrapper div and removing the "old 
school" <br/>'s to do the positioning
- fixed some frontend JSP's that had a textarea with an absolute width(replaced 
by a relative width for mobile compatibility)
- fixed some layout issues in the mobile CSS

I'v tested these patches with Firefox, Chrome, IE8, IE9 and Android Stock 
Browser.

Original comment by sebastia...@gmail.com on 26 Jun 2013 at 11:41

Attachments:

GoogleCodeExporter commented 9 years ago
Updated patch file (removed my PwmConfiguration.xml ;)

Original comment by sebastia...@gmail.com on 26 Jun 2013 at 12:18

Attachments:

GoogleCodeExporter commented 9 years ago
Patched into revision 577.  Excellent patch, thank you!

Original comment by jrivard on 30 Jun 2013 at 8:53

GoogleCodeExporter commented 9 years ago
You're welcome. I had a lot of further enhancements/ ideas as well, but those 
where too intrusive in the current UI design.

Maybe we can share some thoughts on this once 1.70 is out.

One thing I noticed, is that we have a small layout issue inside the Config 
Manager pages. Because the footer is now outside the centerbody div, it is 
badly readable, because of the black background.

Original comment by sebastia...@gmail.com on 2 Jul 2013 at 6:57