Hide "more" button label on small screens (template dialog)
Closed, ResolvedPublic3 Estimated Story Points
Actions

Assigned To

Authored By

	ECohen_WMDE
	May 10 2022, 8:48 AM

Description

Remove button label on small screens for the more button (turn into an icon-only quiet mobile OOUI button)
Masking gradient behind the button should shrink to match the smaller button size
Ensure that ARIA label remains
Align right edge of button when focused with the right edge of the text field
Mobile/small screens only: make entire description included in the button's clickable area (both for expanding and collapsing)

[Update 24.5.2022] fix issue described in T307986#7951989

Screen Shot 2022-05-10 at 10.44.20.png (234×780 px, 22 KB)

Screen Shot 2022-05-10 at 10.44.54.png (448×1 px, 48 KB)

Details

Project	Branch	Lines +/-	Subject
mediawiki/extensions/VisualEditor	master	+67 -25	Make collapsible descriptions more responsive
mediawiki/extensions/VisualEditor	master	+29 -11	Improve collapsible descriptions for smaller screens
mediawiki/extensions/VisualEditor	master	+22 -23	Extract MWExpandableContentElement.onButtonClick method

Customize query in gerrit

Related Objects

Mentioned In: T309221: Collapse warnings and notices in VE template dialog

Event Timeline

ECohen_WMDE created this task.May 10 2022, 8:48 AM

Restricted Application added a subscriber: Aklapper. · View Herald TranscriptMay 10 2022, 8:48 AM

ECohen_WMDE moved this task from Backlog to Ready for story time on the WMDE-Templates-FocusArea board.May 10 2022, 8:48 AM

ECohen_WMDE updated the task description. (Show Details)

Maintenance_bot added a project: VisualEditor.May 10 2022, 9:30 AM

thiemowmde added a project: WMDE-TechWish-Sprint-2022-05-11.May 11 2022, 12:22 PM

Lena_WMDE moved this task from Ready for story time to In sprint on the WMDE-Templates-FocusArea board.May 11 2022, 12:22 PM

Andrew-WMDE claimed this task.May 12 2022, 4:50 AM

Andrew-WMDE moved this task from Sprint Backlog to Doing on the WMDE-TechWish-Sprint-2022-05-11 board.

ECohen_WMDE updated the task description. (Show Details)May 12 2022, 8:50 AM

Change 791352 had a related patch set uploaded (by Andrew-WMDE; author: Andrew-WMDE):

[mediawiki/extensions/VisualEditor@master] Improve collapsible descriptions for smaller screens

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

gerritbot added a project: Patch-For-Review.May 12 2022, 12:00 PM

awight renamed this task from Make more button icon only for small screens (template dialog) to Hide "more" button label on small screens (template dialog).May 12 2022, 12:25 PM

WMDE-Fisch set the point value for this task to 3.May 12 2022, 12:27 PM

Test wiki created on Patch demo by Andrew Kostka (WMDE) using patch(es) linked to this task:
https://patchdemo.wmflabs.org/wikis/2e6cef484f/w/

Andrew-WMDE moved this task from Doing to Tech Review on the WMDE-TechWish-Sprint-2022-05-11 board.May 13 2022, 4:07 PM

Change 791617 had a related patch set uploaded (by Thiemo Kreuz (WMDE); author: Andrew-WMDE):

[mediawiki/extensions/VisualEditor@master] Fix non-collapsible parameter descriptions on smaller screens

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

Change 792146 had a related patch set uploaded (by Thiemo Kreuz (WMDE); author: Thiemo Kreuz (WMDE)):

[mediawiki/extensions/VisualEditor@master] Extract MWExpandableContentElement.onButtonClick method

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

Change 792146 merged by jenkins-bot:

[mediawiki/extensions/VisualEditor@master] Extract MWExpandableContentElement.onButtonClick method

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

ReleaseTaggerBot added a project: MW-1.39-notes (1.39.0-wmf.13; 2022-05-23).May 17 2022, 7:00 AM

ppelberg moved this task from To Triage to Triaged on the VisualEditor board.May 19 2022, 3:57 PM

Change 791352 merged by jenkins-bot:

[mediawiki/extensions/VisualEditor@master] Improve collapsible descriptions for smaller screens

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

WMDE-Fisch moved this task from Tech Review to Demo on the WMDE-TechWish-Sprint-2022-05-11 board.May 23 2022, 10:33 AM

I was testing this out on beta (looking amazing!!) and I think I found a bug introduced by this change (it's only happening if I'm editing on both mobile and on beta). The expand/collapse button is showing on descriptions that are too short and when clicked there is nothing to expand. See examples below (both "Notable works" and "Signature")

Screen Shot 2022-05-24 at 09.13.12.png (792×1 px, 150 KB)

Screen Shot 2022-05-24 at 09.13.18.png (866×1 px, 146 KB)

lilients_WMDE moved this task from Demo to Sprint Backlog on the WMDE-TechWish-Sprint-2022-05-11 board.May 24 2022, 1:04 PM

lilients_WMDE updated the task description. (Show Details)

thiemowmde added a project: WMDE-TechWish-Sprint-2022-05-25.May 25 2022, 8:09 AM

Andrew-WMDE moved this task from Sprint Backlog to Doing on the WMDE-TechWish-Sprint-2022-05-25 board.May 25 2022, 8:47 AM

ECohen_WMDE mentioned this in T309221: Collapse warnings and notices in VE template dialog.May 25 2022, 3:41 PM

Change 800722 had a related patch set uploaded (by Andrew-WMDE; author: Andrew-WMDE):

[mediawiki/extensions/VisualEditor@master] Make collapsible descriptions more responsive

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

Test wiki on Patch demo by Andrew Kostka (WMDE) using patch(es) linked to this task was deleted:

~~https://patchdemo.wmflabs.org/wikis/2e6cef484f/w/~~

Andrew-WMDE moved this task from Doing to Tech Review on the WMDE-TechWish-Sprint-2022-05-25 board.May 27 2022, 2:44 PM

awight moved this task from Tech Review to Demo on the WMDE-TechWish-Sprint-2022-05-25 board.May 30 2022, 10:13 AM

Change 800722 merged by jenkins-bot:

[mediawiki/extensions/VisualEditor@master] Make collapsible descriptions more responsive

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

ReleaseTaggerBot edited projects, added MW-1.39-notes (1.39.0-wmf.14; 2022-05-30); removed MW-1.39-notes (1.39.0-wmf.13; 2022-05-23).May 30 2022, 11:00 AM

awight moved this task from Demo to Done on the WMDE-TechWish-Sprint-2022-05-25 board.Jun 7 2022, 8:33 AM

WMDE-Fisch closed this task as Resolved.Jun 7 2022, 12:32 PM

	F35171889: Screen Shot 2022-05-24 at 09.13.18.png
	May 24 2022, 7:16 AM

	F35171890: Screen Shot 2022-05-24 at 09.13.12.png
	May 24 2022, 7:16 AM

	F35124782: Screen Shot 2022-05-10 at 10.44.54.png
	May 10 2022, 8:48 AM

	F35124781: Screen Shot 2022-05-10 at 10.44.20.png
	May 10 2022, 8:48 AM

Hide "more" button label on small screens (template dialog)Closed, ResolvedPublic3 Estimated Story PointsActions

Description

Details

Related Objects

Event Timeline

Hide "more" button label on small screens (template dialog)
Closed, ResolvedPublic3 Estimated Story Points
Actions