Anon Edit warning screen has UI bugs [design debt]
Closed, ResolvedPublic1 Estimated Story Points
Actions

Assigned To

Authored By

	• Nirzar
	May 6 2017, 12:35 AM

Description

Anonymous editing warning screen has UI bugs

Message is sticking the edges of the screen
buttons sticking together

Proposal
~~- Improve the message to reflect the warning in a better way.~~
~~- use "warning" icon which has better recall~~

Adding correct paddings around message and buttons
Include benefit of logging in or creating account near the call to actions.

Mock
Before

After

Zeplin spec https://zpl.io/Z1eCptk

Details

	Subject	Repo	Branch	Lines +/-
	Show CTA at bottom of anonymous editor warning	mediawiki/extensions/MobileFrontend	master	+12 -2
	Add spacing to anonymous editing message	mediawiki/extensions/MobileFrontend	master	+12 -0

Customize query in gerrit

Related Objects
Search...

Status	Assigned	Task
Resolved	• Spage	T88392 Update UI library documentation
Resolved	Volker_E	T118925 [GOAL] Style Guide - Guide on how/when to use components
Resolved	Volker_E	T151117 Make an official statement on which guide for WikimediaUI is the official one to remove confusion
Resolved	Volker_E	T110727 Consolidate documentation for recommended color palette
Resolved	Volker_E	T111117 [EPIC] Enhance accessibility of OOUI & MediaWiki UI library / LSG / MediaWiki General to screen readers and color-deficient users
Invalid	Volker_E	T98526 Inactive notification badge colors not compliant with WCAG 2.0 accessibility guidelines
Resolved	Volker_E	T109915 Improve color palette to comply with WCAG 2.0 min level AA and color-deficiency-friendly.
Resolved	Volker_E	T123812 Invalid text input `border`/`box-shadow` and dialog error border color should be set to `@destructive`
Resolved	Volker_E	T127405 Review current style and integrate Messages and message boxes (errors, warnings) as WikimediaUI component
Resolved	Jdlrobson	T166915 Create an abstraction for the message box components (warningbox, errorbox etc)
Resolved	• Nirzar	T164628 Anon Edit warning screen has UI bugs [design debt]

Event Timeline

• Nirzar created this task.May 6 2017, 12:35 AM

Restricted Application added a subscriber: Aklapper. · View Herald TranscriptMay 6 2017, 12:35 AM

• Nirzar moved this task from Backlog to UI Standardization on the Design (RW-Design-Debt) board.May 6 2017, 12:35 AM

ovasileva triaged this task as Medium priority.May 8 2017, 9:10 AM

Looks ready to go to me.

Jdlrobson moved this task from Triaged but Future to Upcoming on the Web-Team-Backlog board.May 21 2017, 10:19 AM

How would mocks look on tablet?

On top of Baha's question above, another look shows that the editor is using the warningbox class.
@Volker_E I'd argue we should style all warningboxes consistently across desktop/mobile - can we change these everywhere.
Also why are some warning boxes yellow and others gray?

Blocked on T166915 ?

• Nirzar changed the task status from Stalled to Open.Jun 29 2017, 10:03 PM

• Nirzar updated the task description. (Show Details)

• Nirzar edited projects, added Web-Team-Backlog; removed Web-Team-Backlog (Tracking).

• Nirzar moved this task from Incoming to Triaged but Future on the Web-Team-Backlog board.

ovasileva moved this task from Triaged but Future to Upcoming on the Web-Team-Backlog board.Jul 11 2017, 6:26 PM

ovasileva moved this task from Upcoming to Triaged but Future on the Web-Team-Backlog board.

• Nirzar moved this task from Triaged but Future to Upcoming on the Web-Team-Backlog board.Jul 18 2017, 9:57 PM

Volker_E moved this task from Unsorted to Wikimedia Design Style Guide on the UI-Standardization board.Aug 15 2017, 9:45 PM

Since this is blocked on T166915 (in tracking), do we want to remove it from upcoming?

@Niedzielski yes that makes sense.

Jdlrobson removed a subtask: T166915: Create an abstraction for the message box components (warningbox, errorbox etc).Aug 18 2017, 2:34 PM

Jdlrobson added a parent task: T166915: Create an abstraction for the message box components (warningbox, errorbox etc).

It is not blocked on T166915 as I had de-scoped it for the same reason. this is about the paddings between the message and buttons.

• Niedzielski set the point value for this task to 1.Aug 22 2017, 4:53 PM

ovasileva added a project: Readers-Web-Kanbanana-Board-Old.Aug 23 2017, 10:02 AM

Jdlrobson moved this task from Upcoming to 2017-18 Q1 on the Web-Team-Backlog board.Aug 23 2017, 5:13 PM

Jdlrobson moved this task from To Do to Needs Design Review on the Readers-Web-Kanbanana-Board-Old board.Aug 28 2017, 2:47 PM

Jdlrobson claimed this task.Aug 28 2017, 8:09 PM

Jdlrobson moved this task from Needs Design Review to Doing on the Readers-Web-Kanbanana-Board-Old board.

Change 374408 had a related patch set uploaded (by Jdlrobson; owner: Jdlrobson):
[mediawiki/extensions/MobileFrontend@master] Add spacing to anonymous editing message

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

gerritbot added a project: Patch-For-Review.Aug 28 2017, 8:23 PM

Change 374412 had a related patch set uploaded (by Jdlrobson; owner: Jdlrobson):
[mediawiki/extensions/MobileFrontend@master] Show CTA at bottom of anonymous editor warning

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

Jdlrobson moved this task from Doing to Needs Code Review on the Readers-Web-Kanbanana-Board-Old board.Aug 28 2017, 8:32 PM

Change 374408 merged by jenkins-bot:
[mediawiki/extensions/MobileFrontend@master] Add spacing to anonymous editing message

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

Jdlrobson moved this task from Needs Code Review to Ready for Signoff on the Readers-Web-Kanbanana-Board-Old board.Aug 29 2017, 2:51 PM

Change 374412 merged by jenkins-bot:
[mediawiki/extensions/MobileFrontend@master] Show CTA at bottom of anonymous editor warning

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

ReleaseTaggerBot added a project: MW-1.30-release-notes (WMF-deploy-2017-08-29 (1.30.0-wmf.16)).Aug 29 2017, 3:00 PM

please sign off!

Macro votecat: looks good

	F8574985: anon-edit.png
	Jun 29 2017, 10:03 PM

Anon Edit warning screen has UI bugs [design debt]Closed, ResolvedPublic1 Estimated Story PointsActions

Description

Details

Related ObjectsSearch...

Event Timeline

Anon Edit warning screen has UI bugs [design debt]
Closed, ResolvedPublic1 Estimated Story Points
Actions

Related Objects
Search...