Refactor the translation view column layout to match new design
Closed, ResolvedPublic
Actions

Assigned To

Authored By

	santhosh
	Feb 15 2018, 11:27 AM

Description

In old design, we had 3 column concept - 3 equal columns for source, translation and tools. But in new design @Pginer-WMF proposed connecting the the publishing, saving controls close to the source, translation columns. That means, in new design, we have 2 columns. The first column has 2 column wide header, then source and translation columns. The second column is tools column.

This is the new design

CX-translation-view.png (720×1 px, 301 KB)

This is illustrated below:

So, in CX2, we should re-arrange the DOM to match the new design instead of relying on CSS styling to achieve new design. I propose to leave CX1 as it is now.

Details

Related Changes in Gerrit:

	Subject	Repo	Branch	Lines +/-
	Refactor the translation view column layout to match new design	mediawiki/extensions/ContentTranslation	master	+285 -202

Customize query in gerrit

Related Objects
Search...

Status	Assigned	Task
Resolved	Pginer-WMF	T157457 Align Content Translation with the design style guide
Resolved	Pginer-WMF	T186873 Adjust the layout of the translation editor to emphasise the main content
Resolved	santhosh	T187433 Refactor the translation view column layout to match new design

Event Timeline

santhosh created this task.Feb 15 2018, 11:27 AM

Restricted Application added a subscriber: Aklapper. · View Herald TranscriptFeb 15 2018, 11:27 AM

santhosh moved this task from Needs Triage to CX2 on the ContentTranslation board.Feb 15 2018, 11:34 AM

Pginer-WMF triaged this task as High priority.Feb 15 2018, 11:46 AM

Pginer-WMF added a parent task: T186873: Adjust the layout of the translation editor to emphasise the main content.

Pginer-WMF mentioned this in T186873: Adjust the layout of the translation editor to emphasise the main content.

Pginer-WMF added a project: Language-2018-Jan-Mar.

From the diagram, it may be ambiguous what is refered as "Header". The "Header" represented here is the element with the "All translations" and publish buttons. Note that on top of it there is another element that still goes across the whole screen with the page title, notifications and the user menu (which is restyled in T186874).

• Petar.petkovic mentioned this in T185277: [wmf.17-regression] A notice on the Special:ContentTranslation overlaps personal header controls .Feb 15 2018, 2:53 PM

Pginer-WMF moved this task from Backlog to Priority backlog on the Language-2018-Jan-Mar board.Feb 16 2018, 7:44 AM

Pginer-WMF lowered the priority of this task from High to Medium.Feb 16 2018, 9:40 AM

santhosh claimed this task.Feb 19 2018, 5:21 AM

santhosh moved this task from Priority backlog to In Progress on the Language-2018-Jan-Mar board.

Change 412651 had a related patch set uploaded (by Santhosh; owner: Santhosh):
[mediawiki/extensions/ContentTranslation@master] Refactor the translation view column layout to match new design

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

gerritbot added a project: Patch-For-Review.Feb 19 2018, 8:49 AM

• Petar.petkovic moved this task from In Progress to In Review on the Language-2018-Jan-Mar board.Feb 19 2018, 8:49 AM

• Petar.petkovic removed a project: Patch-For-Review.Feb 23 2018, 9:01 AM

• Petar.petkovic moved this task from In Review to QA on the Language-2018-Jan-Mar board.

Change 412651 merged by jenkins-bot:
[mediawiki/extensions/ContentTranslation@master] Refactor the translation view column layout to match new design

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

ReleaseTaggerBot added a project: MW-1.31-release-notes (WMF-deploy-2018-02-27 (1.31.0-wmf.23)).Feb 23 2018, 10:00 AM

Due to error POST http://cxserver2.wmflabs.org/v2/translate/en/es/Apertium 500 (Internal Server Error), the tools columns does not get displayed. But the overall implementation looks according to the mockup.

There are minor discrepancies in cx2-testing comparing to cx-testing - they are not related to the scope of this ticket. So, @Petar.petkovic and @Pginer-WMF please review them and disregard them or let me know if some separate ticket(s) should be filed.

cx2- testing discrepancies	cx-testing

In T187433#4007953, @Etonkovidova wrote:

There are minor discrepancies in cx2-testing comparing to cx-testing - they are not related to the scope of this ticket. So, @Petar.petkovic and @Pginer-WMF please review them and disregard them or let me know if some separate ticket(s) should be filed.

We've clearly missed a step in communicating with you how we're gonna proceed with the changes in the near future. We'll move fast and break things.

In doing so, there are currently some pieces of work that aren't documented and need follow up patches to re-implement some lost features (like gear icon). I have warned a team this could happen and will raise the concern again.

Try to stick to ticket specifics. Smaller polishing will be done later. I expect @Pginer-WMF to revisit UI elements such as that translation header you reported issues for, and that will be all polished. CX2 is not yet usable and fixing that is high priority.

Some more explanations about our team's work going forward at T186876#4008711.

Thanks! As long as the issues are known, it's ok for me too. The specs are implemented - the design of two column is in place and no regressions in the layout or functionality.

• Petar.petkovic moved this task from QA to Done on the Language-2018-Jan-Mar board.Mar 2 2018, 12:39 AM

	F14065617: Screen Shot 2018-02-27 at 1.02.15 PM.png
	Feb 27 2018, 9:21 PM

	F14065634: Screen Shot 2018-02-27 at 1.01.54 PM.png
	Feb 27 2018, 9:21 PM

Refactor the translation view column layout to match new designClosed, ResolvedPublicActions

Description

Details

Related ObjectsSearch...

Event Timeline

Refactor the translation view column layout to match new design
Closed, ResolvedPublic
Actions

Related Objects
Search...