| Urbanecm | |
| Oct 30 2019, 2:37 PM |
| F31007347: Screen Shot 2019-11-04 at 6.38.51 PM.png | |
| Nov 5 2019, 2:48 AM |
| F31007366: Screen Shot 2019-11-04 at 6.46.13 PM.png | |
| Nov 5 2019, 2:48 AM |
| F30940823: Screenshot from 2019-10-31 15-01-48.png | |
| Oct 31 2019, 10:09 PM |
| F30940852: Screenshot from 2019-10-31 15-03-32.png | |
| Oct 31 2019, 10:09 PM |
From ambassadors' chat (written by @Urbanecm):
@RHo Czech texts are (again 🙂) too long. I've already chosen shorter synonym for "Jednoduché" ("Snadné"), which does fit (at least when changing through browser developer console), but it's going to be harder for "Středně obtížné".
Would it be possible to indent the second line a little bit, so it looks better for Czech users?
Change 547669 had a related patch set uploaded (by Catrope; owner: Catrope):
[mediawiki/extensions/GrowthExperiments@master] StartEditingDialog: Prevent difficulty labels from wrapping
| Before | After | |
 |  | |
@RHo I had to change your CSS a little bit. Because of the weird way that widths of table columns are negotiated, the width: max-content trick you found doesn't work well. It worked in your codepen, but once I changed the text in the right-hand column to the Czech text (and applied the 700px width constraint and 14px font size used in the dialog), the extra width of that text caused the right column to grow and the left column to shrink, so the "Středně obtížné" text still wraps. The solution I found was to keep width: 20% (which functions more like a min-width, and min-width itself doesn't work), then preventing wrapping using white-space: nowrap
Change 547669 merged by jenkins-bot:
[mediawiki/extensions/GrowthExperiments@master] StartEditingDialog: Prevent difficulty labels from wrapping
For Design review
Desktop
Mobile (checked on a real device and in a browser emulator):
The mobile version of this overlay is a different, more mobile-friendly single column layout:
https://wikimedia.invisionapp.com/share/2TU9L4HJAKW#/387501623_NH-Mobile_-_Add_SE_Overlay_-_Task_Difficulty
Note the image is also different (it is Difficulty-landscape-rtl.svg found in T235444) to accommodate the mobile format.
Because everything on here is resolved except for the single-column layout and image issues, I am resolving this task in favor of T236854: [mobile] Newcomer tasks - UI issues with Suggested edits module and Difficulty overlay, which covers both those issues.