790789 - Editor window too narrow

Status: RESOLVED FIXED

(support.mozilla.org :: Knowledge Base Software, task, P2)

Comment 1

[Kadir Topal [:atopal]]

As I localizer I would like to have a better editing experience with a wider editor.

    https://sumo.etherpad.mozilla.org/110

Comment 2

[Bram Pitoyo [:bram]]

The new editor will occupy the whole column, with the “For Contributors” sidebar moved up top above the editor. This is similar to how the current top page operate: no sidebar, with the sidebar located on top.

Comment 3

[Ricky Rosario [:rrosario, :r1cky]]

(In reply to Bram Pitoyo [:bram] from comment #2)
> The new editor will occupy the whole column, with the “For Contributors”
> sidebar moved up top above the editor. This is similar to how the current
> top page operate: no sidebar, with the sidebar located on top.

Not for translating? Or what are you referring to? Maybe I haven't seen the mockups.

Comment 4

[Bram Pitoyo [:bram]]

Attachment: One column editor / translator interface

(In reply to Ricky Rosario [:rrosario, :r1cky] from comment #3)
> Not for translating? Or what are you referring to? Maybe I haven't seen the
> mockups.

For both editing and translating. I don’t know if the en-US editing interface will benefit from a wider interface like this, but if it does, then we should change it so that every editing interface is one-column.

Attached is a mockup from the pt-BR translation interface.

What I did was change the #localize-document article id to be inside a .grid_12 div. Then I put the two sidebars up top, inside a .feature-box div.

I also resized the column width to 49% so they fill half the page, and textarea width to 100%, so they fill the whole half of the column.

Lastly, I set the width for the textareas inside the .approved and .localized div classes to 95%, rather than 100%. This prevents collision.

Comment 5

[Ricky Rosario [:rrosario, :r1cky]]

Adding to next sprint. This needs some exploration, => 2pt

Comment 6

[Ricky Rosario [:rrosario, :r1cky]]

I didn't get to this in 2012.20, the diff took way longer than expected. Pushing to 2012.21.

Comment 7

[Ricky Rosario [:rrosario, :r1cky]]

Landed and deployed:

https://github.com/mozilla/kitsune/commit/d0d6c7dd8446c0142ba3484592bef086ac6202ee

Comment 8

[Kadir Topal [:atopal]]

I like the way you implemented this. The only issue I can see is that the preview is now shown in the wide screen format too, and that might cause issues where things look okay in the wide screen format, but not with the narrower view of the normal article view. I'm not going to file a new bug for that though. Waiting on localizer feedback instead.

Comment 9

[Ricky Rosario [:rrosario, :r1cky]]

(In reply to Kadir Topal [:atopal] from comment #8)
> I like the way you implemented this. The only issue I can see is that the
> preview is now shown in the wide screen format too, and that might cause
> issues where things look okay in the wide screen format, but not with the
> narrower view of the normal article view. I'm not going to file a new bug
> for that though. Waiting on localizer feedback instead.

Good point, we should limit the width of the preview to the actual width in the article page.

Comment 10

[Bram Pitoyo [:bram]]

I am not sure if, to make it as representative as possible, the text inside the preview box should also be set with the same font size and style as the text on the article page?

Comment 11

[Kadir Topal [:atopal]]

Yeah, ideally the preview looks exactly like the final view.