@AMuigai @SGautam_WMF is this something you want in the prototype?

Yes please.

@SGautam_WMF is this the correct design to look at for this ticket?

https://www.figma.com/file/pj2ASYTU23ieu3hFvclMer/Wikistories?node-id=524%3A5880

https://github.com/wikimedia/wikistories-prototype/pull/24

@SGautam_WMF is there a preference on whether we should show "Author unknown" or omit the author line altogether when there's no author specified from the api on an image?

@eamedina could you please share an example of this?

Yes of course, realizing now my question was a bit vague without an example. Question is whether we include "Author unknown" or not when there's no author specified from api, as below. Currently we do show it as this is consistent with other galleries, but the question had come up during code review so just wanted to touch base with you

Thanks for sharing an example. Let me get back to you on this.

@eamedina - it seems that svg files (I tested on https://wikimedia.github.io/wikistories-prototype/T292474-img-attributions/#/story) do not display the attribution information. The file pages have the attribution info.

The svg files are present in the search results, e.g. https://commons.wikimedia.org/wiki/File:Te-TableImage.svg (another example is https://commons.wikimedia.org/wiki/File:LaTeX-BibTeX_workflow.svg)

Otherwise, the attribution looks according to the figma specs:

Note: I'll do more testing with different file types.

Hey @Etonkovidova, thanks for flagging this. What's happening in the gif example is a "white on white" issue: the attribution is there but the white letters get blended in with the white background for images that happen to be white there, which as you pointed out, SVGs specially fit this bill.

@SGautam_WMF turning to design for guidance, any suggestions?

The "white on white" issue (or no/low contrast) is a general problem we'll face everywhere we don't want a solid background behind text. There are several ways to address that, here's some ideas: https://css-tricks.com/methods-contrasting-text-backgrounds/

In T292474#7517267, @eamedina wrote:

Hey @Etonkovidova, thanks for flagging this. What's happening in the gif example is a "white on white" issue: the attribution is there but the white letters get blended in with the white background for images that happen to be white there, which as you pointed out, SVGs specially fit this bill.

@SGautam_WMF turning to design for guidance, any suggestions?

Thanks! Should the ticket be moved back to Design/Dev work? There are plenty of such files (with the white background).

Note: GrowthExperiments "Add image" would display a darkened space at the bottom of an image.

Both the suggestions from Stephane and Elena could work, I think we can move this to design and @SGautam_WMF you can give us the final call?

Moved it to Design doing to add more details credit line.

@eamedina could you please create a branch and add below mentioned gradient inside .image-attribution, I'd like to test it with different images.

background: linear-gradient(180deg, rgba(0, 0, 0, 0.7) 0%, rgba(0, 0, 0, 0) 100%);

Sure thing, I've created branch T292474-img-attributions-follow-up and the demo link is: https://wikimedia.github.io/wikistories-prototype/T292474-img-attributions-follow-up/#/

In T292474#7609721, @eamedina wrote:

Sure thing, I've created branch T292474-img-attributions-follow-up and the demo link is: https://wikimedia.github.io/wikistories-prototype/T292474-img-attributions-follow-up/#/

Thanks Eduardo, I checked it and I would propose following changes to the code.

background: linear-gradient(180deg, rgba(0, 0, 0, 0) -108.75%, rgba(0, 0, 0, 0.6) 100%);

Change 772490 had a related patch set uploaded (by Eamedina; author: Eamedina):

[mediawiki/extensions/Wikistories@master] Update image attribution background.

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

Change 772490 merged by jenkins-bot:

[mediawiki/extensions/Wikistories@master] Update image attribution background.

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

We'll have to show the attribution in the viewer too in a different task. We can maybe reuse the same component.

@SBisson shall I create the task for sharing attribution in the viewer or do we already have one for it?

In T292474#7866960, @SGautam_WMF wrote:

@SBisson shall I create the task for sharing attribution in the viewer or do we already have one for it?

Please create a new task for it

Created a new task for it. T306504

Testing:

I noticed the attribution section does not show up for some images in Story Builder, but shows for others. For the screenshots below, I am using the Coconut page and selecting the first image and then the last:

Moving this back to Dev for some tweaking.

@eamedina @SBisson , can you please have a look?

Change 788393 had a related patch set uploaded (by Eamedina; author: Eamedina):

[mediawiki/extensions/Wikistories@master] Add attribution data to images from article

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

Change 788393 merged by jenkins-bot:

[mediawiki/extensions/Wikistories@master] Add attribution data to article images

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

Testing:
The attribution is showing up for the earlier tested image now, and a couple of others.