Page MenuHomePhabricator

Implement site chrome, navigation elements, and footer for WikiHighlights and Long-form articles microsites.
Closed, ResolvedPublic

Assigned To
Authored By
eamedina
Aug 25 2023, 7:38 PM
Referenced Files
F38189992: Frame 115.png
Oct 10 2023, 3:00 PM
F38189968: Frame 116.png
Oct 10 2023, 3:00 PM
F38101461: Frame 116.png
Oct 9 2023, 10:21 AM
F37926353: back-arrow-white.svg
Oct 3 2023, 2:20 PM
F37926351: back-arrow-black.svg
Oct 3 2023, 2:20 PM
F37926028: Long_Article_Individual.png
Oct 3 2023, 8:27 AM
F37926029: Log_article_home.png
Oct 3 2023, 8:27 AM
F37926032: Footer.png
Oct 3 2023, 8:27 AM
Subscribers

Description

Description

This task aims to implement key navigational and informational elements, including site chrome, navigation icons, and footers, across both the WikiHighlights and long-text microsites.

Design

1. WikiHighlights microsite

Wikihighlights_arrow.png (780×360 px, 253 KB)
Frame 116.png (780×360 px, 283 KB)
  • A fixed 'back' icon will allow users to navigate back to the category page. Back icon position is always fixed.
  • Footer: Place a fixed footer only on Wikihighlights category page containing the following fine-print:

"The text has been generated by an LLM, adapted from Wikipedia, and is based on CC-BY-SA 4.0 licensed material."

2. Long-form articles microsite

Frame 115.png (780×360 px, 117 KB)
  • Site chrome on individual article pages: Use the title of the current article being read.The site title remains centered. A back arrow appears on the left, allowing navigation back to the category page.
  • For article title, use default font size should be set to accommodate most titles without truncation.
  • If the title is too long and exceeds the available horizontal space, allow the text to wrap to the next line.
  • Both the back arrow and the header stay at the top of the screen all the time.

3. Common Interactions:

  • Tap on the back arrow: Takes the user to the category page.
  • Tap on the device soft back key: Triggers a browser's default dialog prompt when the user is at the point where the next press of the back button would exit the microsite. The prompt will ask the user to confirm their intention to leave. Upon confirmation, the user is taken back to where they were before entering the site.

4.Files
Design file

Acceptance Criteria
  • Back icon is present on all highlight pages and functions as expected.
  • Back icon is present on individual article pages and functions as expected.
  • Footer is present on category pages and contains a fine-print section.

Event Timeline

eamedina renamed this task from Highlights view to [DEV] Highlights view.Aug 25 2023, 7:40 PM
eamedina triaged this task as High priority.
eamedina renamed this task from [DEV] Highlights view to Highlights view.Sep 5 2023, 2:57 PM
PWaigi-WMF renamed this task from Highlights view to Highlights Micro-site.Sep 6 2023, 11:46 AM
PWaigi-WMF updated the task description. (Show Details)
SGautam_WMF renamed this task from Highlights Micro-site to Implement site chrome, navigation elements, and footer for WikiHighlights and Long-form articles microsites. .Oct 3 2023, 7:42 AM