WordPress.org

Make WordPress Core

Changeset 33268


Ignore:
Timestamp:
07/14/2015 05:23:42 PM (5 years ago)
Author:
obenland
Message:

Media: Reduce link noise between icons and titles in list view.

Props afercia.
Fixes #32254.

Location:
trunk/src/wp-admin
Files:
3 edited

Legend:

Unmodified
Added
Removed
  • trunk/src/wp-admin/css/common.css

    r33186 r33268  
    265265}
    266266
    267 a:focus {
     267a:focus,
     268a:focus .media-icon img {
    268269    color: #124964;
    269270    -webkit-box-shadow:
     
    529530.widefat tbody th.check-column {
    530531    padding: 9px 0 22px;
    531 }
    532 
    533 .widefat.media .check-column {
    534     padding-top: 8px;
    535532}
    536533
     
    20302027/* - Only used once or twice in all of WP - deprecate for global style
    20312028------------------------------------------------------------------------------*/
    2032 td.media-icon {
     2029.media-icon {
     2030    width: 62px; /* icon + border */
    20332031    text-align: center;
    2034     width: 80px;
    2035     padding-top: 8px;
    2036     padding-bottom: 8px;
    2037 }
    2038 
    2039 td.media-icon a {
    2040     display: inline-block;
    2041 }
    2042 
    2043 td.media-icon img {
    2044     display: block;
    2045     max-width: 80px;
    2046     max-height: 60px;
    2047     width: auto;
    2048     height: auto;
     2032}
     2033
     2034.media-icon img {
    20492035    border: 1px solid #e7e7e7;
    20502036    border: 1px solid rgba(0, 0, 0, 0.07);
  • trunk/src/wp-admin/css/list-tables.css

    r33155 r33268  
    340340}
    341341
    342 
    343342td.column-title strong,
    344343td.plugin-title strong {
     
    354353
    355354/* Media file column */
    356 table.media .column-title {
    357     position: relative;
    358 }
    359 
    360355table.media .column-title .media-icon {
    361     position: absolute;
    362     top: 8px; /* match cell padding */
    363     left: 10px; /* match cell padding */
     356    float: left;
     357    min-height: 60px;
     358    margin: 0 9px 0 0;
    364359}
    365360
     
    367362    max-width: 60px;
    368363    height: auto;
    369 }
    370 
    371 table.media .column-title .media-info,
     364    vertical-align: top; /* Remove descender white-space. */
     365}
     366
    372367table.media .column-title .row-actions {
    373368    margin-left: 70px; /* 60px image + margin */
    374369}
    375370
    376 table.media .column-title .media-info p {
     371table.media .column-title .filename {
    377372    margin-bottom: 0.2em;
    378373}
  • trunk/src/wp-admin/includes/class-wp-media-list-table.php

    r33179 r33268  
    339339        list( $mime ) = explode( '/', $post->post_mime_type );
    340340
    341         $user_can_edit = current_user_can( 'edit_post', $post->ID );
    342         $att_title = _draft_or_post_title();
     341        $title = _draft_or_post_title();
     342        $thumb = wp_get_attachment_image( $post->ID, array( 60, 60 ), true, array( 'alt' => '' ) );
     343        $link_start = $link_end = '';
     344
     345        if ( current_user_can( 'edit_post', $post->ID ) && ! $this->is_trash ) {
     346            $link_start = '<a href="' . get_edit_post_link( $post->ID ) . '">';
     347            $link_end = '</a>';
     348        }
     349
    343350        ?>
    344         <div class="media-icon <?php echo $mime ?>-icon">
    345         <?php
    346 
    347         $thumb = wp_get_attachment_image( $post->ID, array( 60, 60 ), true );
    348         if ( $thumb ) {
    349             if ( $this->is_trash || ! $user_can_edit ) {
    350                 echo $thumb;
    351             } else { ?>
    352             <a href="<?php echo get_edit_post_link( $post->ID ); ?>" title="<?php
    353                 echo esc_attr( sprintf( __( 'Edit &#8220;%s&#8221;' ), $att_title ) );
    354             ?>"><?php echo $thumb; ?></a><?php
    355             }
    356         }
    357 
    358         ?>
    359         </div>
    360         <div class="media-info">
    361             <strong>
    362             <?php
    363                 if ( $this->is_trash || ! $user_can_edit ) {
    364                     echo $att_title;
    365                 } else { ?>
    366                     <a href="<?php echo get_edit_post_link( $post->ID ); ?>" title="<?php
    367                         echo esc_attr( sprintf( __( 'Edit &#8220;%s&#8221;' ), $att_title ) );
    368                     ?>"><?php echo $att_title; ?></a><?php
    369                 }
    370                 _media_states( $post );
    371             ?>
    372             </strong>
    373             <p class="filename"><?php echo wp_basename( $post->guid ); ?></p>
    374         </div>
     351        <strong>
     352            <?php echo $link_start; ?>
     353                <?php if ( $thumb ) : ?>
     354                <span class="media-icon <?php echo sanitize_html_class( $mime . '-icon' ); ?>"><?php echo $thumb; ?></span>
     355                <?php endif; ?>
     356
     357                <span aria-hidden="true"><?php echo $title; ?></span>
     358                <span class="screen-reader-text"><?php printf( __( 'Edit &#8220;%s&#8221;' ), $title ); ?></span>
     359            <?php echo $link_end; ?>
     360            <?php _media_states( $post ); ?>
     361        </strong>
     362        <p class="filename"><span class="screen-reader-text"><?php _e( 'File name:' ); ?> </span><?php echo wp_basename( $post->guid ); ?></p>
    375363        <?php
    376364    }
Note: See TracChangeset for help on using the changeset viewer.