Page MenuHomePhabricator

Highlight for references extends above ref
Closed, ResolvedPublic

Description

Steps to reproduce:

  1. Open any article with a reference.
  2. Click the reference.

Expected:
The reference is highlighted using a light blue background.

Actual:
The background extends above the reference, covering the ::before element.

Related Objects

Event Timeline

Schnark created this task.Nov 28 2017, 11:13 AM
ashley added subscribers: SamanthaNguyen, matmarex, Isarra and 2 others.

This seems to be caused by the :target:before rule in /skins/Timeless/resources/screen-desktop.less; specifically its height and margin properties. Setting height to auto and margin to 0 seems to fix the references list, but I'm not sure what that could be breaking, if anything. Still, we'll probably want a more precise fix and maybe we don't even want to touch the offending CSS rule.

cc'ing @Isarra @matmarex @SamanthaNguyen @TheDJ for additional input.

Change 401188 had a related patch set uploaded (by SamanthaNguyen; owner: SamanthaNguyen):
[mediawiki/skins/Timeless@master] Remove fake element created before links so background aligns correctly

https://gerrit.wikimedia.org/r/401188

BeforeAfter

This was tested on Chrome v63.0.3239.84 (latest stable version), Windows 10 platform.

And one more thing I forgot (sorry): https://www.mediawiki.org/wiki/Social_tools?useskin=timeless#cite_note-7 This was the page I tested on.

Change 401188 merged by jenkins-bot:
[mediawiki/skins/Timeless@master] Remove fake element created before links so background aligns correctly

https://gerrit.wikimedia.org/r/401188

Izno moved this task from Unsorted backlog to Defect backlog on the Cite board.Dec 31 2017, 8:11 PM
SamanthaNguyen closed this task as Resolved.Jan 12 2018, 9:55 PM
SamanthaNguyen claimed this task.
SamanthaNguyen triaged this task as Medium priority.
SamanthaNguyen removed a project: Patch-For-Review.
SamanthaNguyen removed a subscriber: gerritbot.