Project

General

Profile

Actions

Defect #30467

closed

Footer is not placed at the bottom on pages with little content

Added by Anonymous over 5 years ago. Updated over 4 years ago.

Status:
Closed
Priority:
Normal
Assignee:
Category:
UI
Target version:
Start date:
Due date:
% Done:

0%

Estimated time:
Resolution:
Fixed
Affected version:

Description

I'm opening this as a placeholder for now to upload the patch later.
If the decision to remove wrappers will be accepted in #30448, then there will need to be changes to the #main, else if all the wrappers will stay, then there will need to be the changes to the #wrapper.

#footer is however going to receive same rules for both approaches. :)


Files

full_height_layout.diff (2.02 KB) full_height_layout.diff Bernhard Rohloff, 2019-08-27 13:06
patched_login_screen.png (22.6 KB) patched_login_screen.png Bernhard Rohloff, 2019-08-27 13:15
original_login_screen.png (22.6 KB) original_login_screen.png Bernhard Rohloff, 2019-08-27 13:15
Actions #1

Updated by Jean-Philippe Lang over 5 years ago

What is the purpose of making the footer sticky? I don't see anything in the footer that needs to be always visible.

Actions #2

Updated by Anonymous over 5 years ago

Jean-Philippe, apologies for vague description, what I mean by setting footer sticky, is for it to stick to the bottom of the page, while always expanding the #main block (or a wrapper) in 100% of available vertical height, unless the page's content needs more space.
I think it would be better than having footer ending up in the middle of the screen on pages where there is little or no content.
For reference please see the concept-gridbox-version.html file in the #30451#note-6 and click "Insert Lorem ipsum" button multiple times while observing the footer to see what I propose :)

Actions #3

Updated by Marius BĂLTEANU over 5 years ago

  • Subject changed from Set footer sticky to Have footer stick to the bottom on pages with little content
Actions #4

Updated by Bernhard Rohloff over 4 years ago

Here is a patch for the base layout to fill the visible space entirely. The footer always sticks to the bottom until the page is bigger than the visible height. It's quite pleasing for my eyes. The footer doesn't jump anymore when changing views.

Original login view

With the patch applied

Actions #5

Updated by Marius BĂLTEANU over 4 years ago

  • Target version set to Candidate for next major release

Bernhard, I've tested your patch in several browsers (including IE 11 and Edge) and it works very well, nice job.

I would love to see this fixed in 4.1.0 along with #30435. It's very annoying to see the footer and the sidebar ended at 600px when there is not too much content in the page.

Actions #6

Updated by Bernhard Rohloff over 4 years ago

  • Target version changed from Candidate for next major release to 4.1.0

I had a chat with Go and it's OK for him, so LGTM! :-)

Actions #7

Updated by Go MAEDA over 4 years ago

  • Tracker changed from Patch to Defect
  • Subject changed from Have footer stick to the bottom on pages with little content to Footer is not placed at the bottom on pages with little content
  • Status changed from New to Closed
  • Assignee set to Go MAEDA
  • Resolution set to Fixed

Committed the patch. Thank you for your contribution.

Actions #8

Updated by Marius BĂLTEANU over 4 years ago

  • Status changed from Closed to Reopened

I think it's safer to target the wrapper elements by their id instead of using "starting with":

Mariuss-MacBook-Pro:redmine mariusbalteanu$ git diff
diff --git a/public/stylesheets/application.css b/public/stylesheets/application.css
index d5f1762e3..00ca660f0 100644
--- a/public/stylesheets/application.css
+++ b/public/stylesheets/application.css
@@ -11,7 +11,7 @@ h4 {border-bottom: 1px solid #ccc; font-weight:normal;}
 pre, code {font-family: Consolas, Menlo, "Liberation Mono", Courier, monospace;}

 /***** Layout *****/
-div[id^="wrapper"] { min-height: inherit; }
+div#wrapper, div#wrapper2, div#wrapper3 { min-height: inherit; }
 #wrapper {background: white;overflow: hidden;}
 #wrapper3 { display: flex; flex-direction: column; }

Bernhard Ganslmeier, do you see any problem with this change?

Actions #9

Updated by Bernhard Rohloff over 4 years ago

Marius BALTEANU wrote:

I think it's safer to target the wrapper elements by their id instead of using "starting with":

[...]

Bernhard Ganslmeier, do you see any problem with this change?

No, you're right. wrapper is quite generic and could be used in more places.
I think it should be changed this way.

Actions #10

Updated by Go MAEDA over 4 years ago

  • Status changed from Reopened to Closed

Marius BALTEANU wrote:

I think it's safer to target the wrapper elements by their id instead of using "starting with":

[...]

Bernhard Ganslmeier, do you see any problem with this change?

Committed the fix in r18446. Thanks.

Actions

Also available in: Atom PDF