1140552 - Add a UI feature to style good/bad-example

Status: RESOLVED WONTFIX

(developer.mozilla.org Graveyard :: Editing, defect)

Description

[Julien G]

What problems would this solve?
===============================
Currently, to use the "skin" for a good (resp. bad) example, one has to edit the source to edit the class of the pre tag. One cannot add this directly via the UI of the editor

Who would use this?
===================
Everyone who want to use the UX for good/bad example in the articles.

What would users see?
=====================
Editors would see a new button/option/element in a list in the UI.
Final users (readers) would not see any difference.

What would users do? What would happen as a result?
===================================================
Editors will use the UI to add good/bad "style" in an example. They would not have to use the source editing.

Is there anything else we should know?
======================================

Comment 1

[Eric Shepherd [:sheppy]]

This could be done by simply using a different brush for the entire sample code <pre> block, right? Like <pre class=brush: js; bad-sample"> or something? That would just change the color scheme to use some shades of red or whatever.

Comment 2

[Stephanie Hobson [:shobson]]

I like the idea of re-using an existing UI element instead of adding new ones. 

Incidentally, using the brush on a pre with an example class on it seems to remove that class right now.

Comment 3

[Jean-Yves Perrier [:teoli]]

I think we already have it; Stephanie did a couple of week ago. Sphinx is asking to add it to CKEditor UI so that we don't need to go to HTML mode to add it.

Comment 4

[BMO Automation]

MDN Web Docs' bug reporting has now moved to GitHub. From now on, please file content bugs at https://github.com/mdn/sprints/issues/ and platform bugs at https://github.com/mdn/kuma/issues/.