[wp-meta] [Making WordPress.org] #630: Improve the design of the callout boxes (shortcodes)

[Making WordPress.org]

#630: Improve the design of the callout boxes (shortcodes)
-------------------------+-------------------------------------------------
  Reporter:              |      Owner:  coffee2code
  samuelsidler           |     Status:  accepted
      Type:  task        |  Component:  Handbooks
  Priority:  lowest      |   Keywords:  ui-feedback has-patch needs-testing
Resolution:              |  needs-ui
-------------------------+-------------------------------------------------
Changes (by coffee2code):

 * owner:   => coffee2code
 * status:  new => accepted


Comment:

 I've attached [attachment:meta-630.comparison.png] which compares the
 current appearance versus the changes implemented as part of selectively
 applying parts of [attachment:630.diff].

 The changes to the existing implementation are:

 * Remove of the prefix denoting the type of callout box being shown.
 * Use of dashicons fully through CSS rather than via HTML placeholder.
 * Some padding tweaks.
 * Since @samuelsidler requested a change of the icon for the alert box. I
 took the liberty of previewing use of the flag dashicon
 (https://developer.wordpress.org/resource/dashicons/#flag). We could also
 consider the sticky dashicon
 (https://developer.wordpress.org/resource/dashicons/#sticky) as well.
 Either is better than the current post icon. I think the former is the
 best given our options.

 My tweaks from 630.diff:

 * Explicit top position for call-out.
 * Restore removal of margin-bottom for p tags in a callout box, and add
 margin-top for subsequent paragraphs.
 * Did not enact any color changes (@samuelsidler has indicted the existing
 colors have since been changed as desired).

--
Ticket URL: <https://meta.trac.wordpress.org/ticket/630#comment:6>
Making WordPress.org <https://meta.trac.wordpress.org/>
Making WordPress.org