[wp-meta] [Making WordPress.org] #6305: Inaccessible icons on HelpHub (and Support Forums)

[Making WordPress.org]

#6305: Inaccessible icons on HelpHub (and Support Forums)
--------------------------+---------------------
 Reporter:  sabernhardt   |       Owner:  (none)
     Type:  defect (bug)  |      Status:  new
 Priority:  normal        |   Milestone:
Component:  HelpHub       |  Resolution:
 Keywords:                |
--------------------------+---------------------

Comment (by sabernhardt):

 The
 [https://github.com/WordPress/wordpress.org/blob/trunk/wordpress.org/public_html
 /wp-content/themes/pub/wporg-support/sass/site/_bbpress.scss#L882-L887
 styles] should have a text color without the reduced opacity. `#8d969f`
 has a 3:1 contrast ratio against white, and a darker option would be fine.

 {{{
                 .dashicons {
                         font-size: ms(16);
                         color: #8d969f;
                         width: auto;
                         height: auto;
                 }
 }}}

 If grouping the icon and heading within the link, the `.icon-wrapper`
 element can be a `div` or a `span`:

 {{{
 <div class="info-box">
         <a href="https://wordpress.org/support/category/getting-started/">
                 <span class="icon-wrapper">
                         <span class="dashicons dashicons-wordpress" aria-
 hidden="true"></span>
                 </span>
                 <h3>Getting Started</h3>
         </a>
 }}}

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