Page MenuHomePhabricator

Readers without Javascript see box always in expanded state
Closed, ResolvedPublic

Description

Author: pbirken

Description:
Readers without Jacascript see box always in expanded state which often overlaps some of the content. And well, there seems to be a surprising amount of people who have i) JS turned off and ii) are not willing to turn it on for WP.


Version: unspecified
Severity: normal

Details

Reference
bz14128

Event Timeline

bzimport raised the priority of this task from to Medium.Nov 21 2014, 10:10 PM
bzimport set Reference to bz14128.
bzimport added a subscriber: Unknown Object (MLST).

The default is to show the data then. The reason it overlaps content is due to edits to MediaWiki:monobook.css, which is a local problem. It probably should be tweaked to use JS to set the class, IMO.

Wiki.Melancholie wrote:

See also: Bug 14035

@dewiki:

Maybe use some CSS like:
#mw-revisionratings {visibility:hidden}
#mw-revisionratings:hover {visibility:visible}

Or just hide at all that extended text for those non-JS twerps ;-)

Also try [maybe you need !important]:
#mw-revisiontag {width: ?px}
#mw-revisiontag:hover {width: ??px}

Wiki.Melancholie wrote:

@dewiki:
At least consider display:none for #mw-revisionratings-box, as the information of this box is pretty redundant!
Only for non-JS users, of course...

Wiki.Melancholie wrote:

Non-perfect CSS effects can be reversed by JS, by the way (if necessary).

I disagree with the resolution of this bug. Comment 1 is wrong. Content is overlapped even without local adaptions. The local adaptions in [[de:MediaWiki:Monobook.css]] just try to minimize the amount of overlapped content by moving the whole box upwards. They don't affect other skins at all, Vector now being the default skin.

It would be trivial to achieve the collapse/expand effect without JavaScript. The Vector skin does this for the menu:

div.vectorMenu div.menu {
display: none;
}
div.vectorMenu:hover div.menu {
display: block;
}

If #mw-fr-revisiondetails were in a way related to #mw-fr-revisiontoggle that can be selected with CSS (e.g. descendant or later sibling, but not parent or earlier sibling), we could just do the same, like:

#mw-fr-revisiondetails {
display: none; /* collapsed by default */
}
#mw-fr-revisiontoggle:hover #mw-fr-revisiondetails {
display: block; /* expand if hovered */
}

This is impossible with the current document structure.

Note however that ...

  • ... :hover does not work in IE 6. The JavaScript solution could be kept in place just for that browser;
  • ... [[de:MediaWiki:Common.css]] currently contains some adaptions that affect all skins (z-index: 1 and display: none on #mw-fr-revisiondetails to stack it in the foreground of relatively positioned templates and hide it from non-JavaScript users). They are not the cause of this bug.

It used to push content down when expanded but was recently changed to use a flyout, so *now* it can overlap content.

Will change to display: none

(In reply to comment #7)

Will change to display: none

To be clear, this means disabling the fly-out for non-JS browsing completely.

alexsm333 wrote:

Any progress on this? The issue was raised in my home wiki today.

Meanwhile I'm thinking of adding this to Common.css:
div#mw-fr-revisiondetails {display:none}

Unassigning from Aaron, but this goes into the pool of issues that either Aaron or Priyanka will tackle (whoever has the time first). This bug is duplicated by bug 25389, which I'll be closing and pointing here.

  • Bug 25389 has been marked as a duplicate of this bug. ***