Page MenuHomePhabricator

Insert a horizontal divider between statements on UW
Closed, ResolvedPublic


User story

As a Commons uploader, I want to be able to understand where one Statement begins and one ends, so that I can ensure I'm adding the right metadata in the right place.

We have this

Currently there is little visual differentiation between each statement, and the "Add statement" button is too close to the CC0 license message.

We want this

There needs to be a 1px horizontal divider (C8CCD1) between each statement on UW to differentiate one statement from the next, and there needs to be more spacing in between the "Add statement" button and the CC0 message. Follow how statements & the "Add statement" button are already laid out on the File Page for guidance:

  • 16 px between statements
  • 80 px between the "Add statement" button and the category bar


  • A horizontal line dividing Depicts and the "Add statement" button:

  • Horizontal line between Depicts and the flow for adding a new statement:

  • Horizontal lines dividing statements, as well as the "Add statement" button:

Acceptance Criteria:

  • A 1 px horizontal line (C8CCD1) dividing statements, including between statements and the "Add statement" button
  • Spacing between statements themselves as well as between the "Add statement" button and the CC0 messaging, should be the same (or similar) as the spacing on FP

Event Timeline

Restricted Application added a project: Multimedia. · View Herald TranscriptJul 18 2019, 9:06 PM
Restricted Application added a subscriber: Aklapper. · View Herald Transcript
PDrouin-WMF renamed this task from [stub] Insert a horizontal divider between statements on UW to Insert a horizontal divider between statements on UW.Jul 22 2019, 3:56 PM
PDrouin-WMF updated the task description. (Show Details)
PDrouin-WMF removed PDrouin-WMF as the assignee of this task.Jul 24 2019, 4:04 PM

Change 525561 had a related patch set uploaded (by Cparle; owner: Cparle):
[mediawiki/extensions/UploadWizard@master] Adjust margin/border in metadata step

Cparle added a subscriber: Cparle.Jul 25 2019, 3:06 PM

@PDrouin-WMF the big gap between the 'add statement' button and the category bar on the File page is due to the 'structured data' tab having a min-height. It goes away if you have lots of statements

I put a patch in for this, looks like. Let me know what you think

Cparle claimed this task.Jul 25 2019, 3:06 PM

Oh btw this ticket is locked so I can't move it out of the 'to do' column. Same with T228473

PDrouin-WMF added a comment.EditedJul 25 2019, 3:17 PM

@Cparle -- Screenshot looks good -- I'm thinking we're going to need typographic adjustments in the statements refresh designs. It looks weird to have the learn more link the same size/weight as the property label. Taking note!

Not sure what to do about tickets being locked though :/

Ramsey-WMF triaged this task as Medium priority.Jul 29 2019, 4:50 PM
Ramsey-WMF moved this task from To Do to Doing on the Structured-Data-Team-Current-Work board.
Ramsey-WMF changed the subtype of this task from "Design" to "Task".
Ramsey-WMF moved this task from Untriaged to Next up on the Multimedia board.

Let me know if this is good to go, design-wise, and I will review & approve so we can merge.

It's good to go for me, @egardner!

Change 525561 merged by jenkins-bot:
[mediawiki/extensions/UploadWizard@master] Adjust margin/border in metadata step

I took a look at this and it works fine for me.

Moving to "verify on production", this is all live and working properly on Beta.

Ramsey-WMF closed this task as Resolved.Sep 9 2019, 4:28 PM