482628 - Need the ability to create an Info Box on QMO

Status: NEW

(quality.mozilla.org :: Website, enhancement, P3)

Description

[cmtalbert]

Pick up a technical book.  Flip to any page.  Chances are you'll have an info box on your page.  An info box is an area of the page that usually serves as some kind of example and is set off from the main flow of the page content.  It could be done on the web in a very simple way by adding a border around a div, like so:

<div>
Here I wax eloquent about chocolate chip cookies or whatever it is that I'm talking about, and then it comes time to talk about an example and I want an info box:
<div style="border: solid black 1px">
to make the cookies you:
1. add flour
2. add sugar
3. stir
</div>
And now I can go on talking about how god-awful cookies made with only flour and sugar would taste :-)
</div>

We currently have no way to do even this simple box in QMO.  Ideally, we could create an "info box" object in the WSYWYG editor and it would have a faint yellow background and maybe a different typeface...you get the idea.

1. Create an info box in QMO

= Expected =
You can do this and it looks beautiful

= Actual =
The best you can do is set something off with whitespace
See what I did here: (scroll to bottom): http://quality.mozilla.org/documents-home/keeping-mozilla

Comment 1

[Carsten Book [:Tomcat]]

definitely something that would be very useful to QMO.

Paul: marking as p1 for now, but feel free to mark it as p2 when this need more work!

Comment 2

[Paul Craciunoiu [:paulc]]

Sounds like this is a matter of adding the CSS and then people will just create blocks with a specific <div> class and structure. Is this meant for including in a page document only? Or anywhere on the site (including sidebars)?

Comment 3

[cmtalbert]

I was just thinking that this would only be useful in page content only.  I can't think of any reason you would use something like this in a sidebar.

Comment 4

[Paul Craciunoiu [:paulc]]

It'd be nice to get a mockup of this, including at the very least the styling information... Anyone help with that, or should I do it? I'd like at least someone to have a say since I'm not really a designer (yet...)

Comment 5

[Paul Craciunoiu [:paulc]]

I can't get this done unless I have a mockup at the very least. You are the best to decide what it should look like since you'll be the people using it ;)

Comment 6

[Aakash Desai [:aakashd]]

This should be listed as an enhancement.

Comment 7

[Paul Craciunoiu [:paulc]]

How about using the "need help" icon and some theming from: https://quality.authstage.mozilla.com/gallery ?

Comment 8

[Stephen Donner [:stephend] Not actively reading bugmail]

Mass-removing myself from cc; search for 12b9dfe4-ece3-40dc-8d23-60e179f64ac1 or any reasonable part thereof, to mass-delete these notifications (and sorry!)