Updating example template

[aldimar-junior]

If there's more than one example appends a <h3> tag with the number of the example, i.e:

"Example Nº 1"

Related to/Fixes api.jquery.com issue #1157

[mgol]

Thanks for the PR. This is what it looks like at the beginning of the examples section:

and between examples:

A few remarks:

1. The "Nº" part is a bit much to my eye, I'd leave it at Example 1.
2. There's no margin above the header; this is a result of base.css styles. I think this was done as usually the header follows a paragraph which has a bottom margin but in this case we have a code block at the end of the previous example so it seems a bit cramped (see the screenshot above). I'd add a style to base.css in jquery-wp-content for .entry-example h3, setting margin-top to 1em. I propose setting it on the h3, not on the entry itself so that it's not set if we only have 1 example and the header is skipped.

See the screenshots below for what it'd look like.

The beginning of the examples section:

and between examples:

@timmywil @Krinkle what do you think? This will affect all content sites with examples.

[mgol]

See my suggestions, but I'd also like to see what others think.

[aldimar-junior]

@mgol should I go ahead and make the suggested changes or wait for further review?

[mgol]

@aldimar-junior as you prefer

[aldimar-junior]

@mgol I made a new PR to jquery-wp-content adding only the style for .entry-example h3 and made a new commit here removing the "Nº" from the example header

[mgol]

LGTM, but I'll wait for another review before merging. Thanks!

[mgol]

Timmy approved during the jQuery Core team meeting so I've merged this. Thanks!