Project

General

Profile

Actions

Patch #30231

closed

Operation: "Unwraping The Mine" or conerns about how elements are wrapped

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

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

0%

Estimated time:

Description

Here are some things that look suspicious to me:
1. I think maybe it would be good to kill the two wrappers (wrapper2 and wrapper3), leaving only one top wrapper which would wrap everything except for the footer container, this is to achieve sticky footer design later, or else footer winds up in the middle of my screen when there is little to no content on pages (I have quite a big display). The method I'm suggesting is to stretch the wrapper 100% in height, and then apply margin-top: -25px to both the footer and the wrapper.
2. I think we should move main-menu out of the header container, so that making main-menu sticky would be achievable without using JS.
3. There is a footer container, which has 2 more containers inside named bgl and bgr, considering that footer has nothing in it, but a short line of text, I think they both should be killed and text below to be instead wrapped into a <span> or just an <a>.


Files

wrapper2-wrapper3-removal.patch (1.91 KB) wrapper2-wrapper3-removal.patch Anonymous, 2018-12-18 08:54
main-menu-unwrap.patch (2.51 KB) main-menu-unwrap.patch Anonymous, 2018-12-18 08:54
bgl-bgr-removal.patch (495 Bytes) bgl-bgr-removal.patch Anonymous, 2018-12-18 08:54

Related issues

Related to Redmine - Patch #30451: Move #main-menu outside of the #header to follow directly after the #header insetadNew

Actions
Related to Redmine - Patch #30448: Remove wrapper2 and wrapper3 wrapping containersClosedMarius BĂLTEANU

Actions
Related to Redmine - Patch #30445: Remove unnecessary bgl and bgr wrappers from the footerClosedGo MAEDA

Actions
Actions #1

Updated by Anonymous over 5 years ago

share feedback please, or potentially other bad containers you had spotted, if the interest is good, I'll attach the patch later.

Actions #3

Updated by Go MAEDA over 5 years ago

FYI: .wrapper2, .bgl, and .bgr were added in response to the request #871.

Actions #4

Updated by Anonymous over 5 years ago

Thanks for pointing it out.
I still can't seem to figure out the reason from that request number, as of why exactly was this markup change made in the first place, other than to just match some theme.
According to closer look, CSS of all the 3 themes Redmine is bundled with, never even refers to bgl, bgr, wrapper2 and wrapper3, for the minor exception of one jQuery command, which refers to wrapper2 and can very well be rerouted to the first wrapper instead (by all means correct me, if I'm overlooking something).

This ticket is also 11 years old, and there are numerous things that changed in the web world ever since.
I still think cleaning up unnecessary containers from markup is what will make the page flow easier, which obviously improves the ease of development of different themes, and endorse people to use less of the different really unnecessary element references in CSS stylesheets. This could surely mark the beginning of the general UI improvement in the future as well.

There are also :before and :after pseudos, which can also be used, if adding additional custom containers is really that necessary.

Actions #5

Updated by Bernhard Rohloff over 5 years ago

Max Johansson wrote:

Thanks for pointing it out.
I still can't seem to figure out the reason from that request number, as of why exactly was this markup change made in the first place, other than to just match some theme.

Let me wrap it up for you. ;-)
Eleven years ago Redmine looked nicer on redmine.org than in the trunk. Somebody asked for the CSS styling. There was just a problem. The redmine.org instance was a modified version and the theme didn't fit the trunk. So what's the easiest solution for that. Exactly... xD

As you pointed out the question is what to do with this heritage. I think we should come up with a hole new structure for the base layout to fix the various quirks and enhance the flexibility of Redmine's look and feel.

Actions #6

Updated by Anonymous over 5 years ago

Just like Marius mentioned on Discord, it seems like patching things one by one seems like a more achievable strategy, which I am starting to realize now as well...
Things I brought up in this topic are actually very obvious and related to the outer container design (not the inner one, which would surely require a more precise planing), questioning the purpose of some far outer elements left from this heritage. There is really not much purpose with those containers and unnecessary element wraps as much as I could see.
P.S. Can we add more UI people as watchers here as well please?

Actions #7

Updated by Anonymous over 5 years ago

I separated this into #30451 #30448 #30445, maybe we can add them as related issues to here now, and close this one :)

Actions #8

Updated by Marius BĂLTEANU over 5 years ago

  • Related to Patch #30451: Move #main-menu outside of the #header to follow directly after the #header insetad added
Actions #9

Updated by Marius BĂLTEANU over 5 years ago

  • Related to Patch #30448: Remove wrapper2 and wrapper3 wrapping containers added
Actions #10

Updated by Marius BĂLTEANU over 5 years ago

  • Related to Patch #30445: Remove unnecessary bgl and bgr wrappers from the footer added
Actions #11

Updated by Marius BĂLTEANU over 5 years ago

  • Status changed from New to Closed

Max Johansson wrote:

I separated this into #30451 #30448 #30445, maybe we can add them as related issues to here now, and close this one :)

I'm closing the issue in favour of the related issues.

Actions

Also available in: Atom PDF