Page MenuHomePhabricator

Polish Wikistories prototype
Closed, ResolvedPublic

Assigned To
Authored By
SGautam_WMF
Oct 5 2021, 4:44 PM
Referenced Files
F34676297: Screenshot_20211006-221448_Brave.jpg
Oct 6 2021, 4:52 PM
F34676298: Screenshot_20211006-221540_Brave.jpg
Oct 6 2021, 4:52 PM
F34673273: Browser default.webm
Oct 5 2021, 6:10 PM
F34673269: Image selector.webm
Oct 5 2021, 6:10 PM
F34673245: Toolbar.webm
Oct 5 2021, 6:03 PM
F34673232: Screenshot_20211005-224953_Chrome.jpg
Oct 5 2021, 5:28 PM

Description

Proposed style changes
  • In Home.vue file
    • Change .create-story background color from Blue to #3366cc.
    • Add border-radius to 2px.
  • In CurrentFrame.vue file
    • Add background: linear-gradient(338.27deg, #0BD564 -70.53%, #3366CC 71.84%);
  • For class img.selected add a border-radius : 2px; and color: #3366cc.
  • Bold the text string "Select an image" for article-images-header class.
  • Shall we use heading and paragraph text styling to match to Wikipedia article? Currently we are using Avenir font, for headings we can use Serif and for paragraph sans-serif.
  • Currently we are showing 3 tiger images by default instead we can start with a blank page.
Screenshot_20211005-224953_Chrome.jpg (2×1 px, 135 KB)
  • Allow to discard the image selection by tapping outside the bottom sheet.

Event Timeline

I've started making some of the changes requested here. I would recommend moving the following parts to individual tasks:

  • article text selection
  • making the toolbar stick to the bottom

What exactly do you mean by

Shall we use heading and paragraph text styling to match to Wikipedia article? Currently we are using Avenir font, for headings we can use Serif and for paragraph sans-serif.

Thanks @SBisson, I have updated the ticket to remove the text selection and sticky toolbar.

Shall we use heading and paragraph text styling to match to Wikipedia article? Currently we are using Avenir font, for headings we can use Serif and for paragraph sans-serif.

Here I am proposing to make font changes so an article looks similar to when you view it on mobile web. It looks like in prototype version, the heading appears in different font.

On prototype siteOn mobile web
Screenshot_20211006-221540_Brave.jpg (2×1 px, 246 KB)
Screenshot_20211006-221448_Brave.jpg (2×1 px, 231 KB)

We can now move it to ready for dev. I will suggest other changes in separate tickets.

SBisson moved this task from Backlog to Dev on the Inuka-Team (Kanban) board.