WordPress.org

Make WordPress Core

Changeset 30813


Ignore:
Timestamp:
12/11/2014 04:11:28 AM (5 years ago)
Author:
azaozz
Message:

Fix the search field width in the media modal, media library grid and on the install new plugins screen. Props helen, fixes #30658.

Location:
trunk/src
Files:
5 edited

Legend:

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

    r30740 r30813  
    955955}
    956956
     957.filter-items {
     958    float: left;
     959}
     960
    957961.filter-links {
    958962    display: inline-block;
     
    989993
    990994.wp-filter .search-form {
    991     margin: 10px;
    992     position: absolute;
    993     right: 0;
    994     top: 0;
     995    float: right;
     996    margin: 10px 0;
    995997}
    996998
     
    9981000    margin: 0;
    9991001    padding: 3px 5px;
    1000     max-width: 280px;
    1001     width: 100%;
     1002    width: 280px;
     1003    max-width: 100%;
    10021004    font-size: 16px;
    10031005    font-weight: 300;
     
    10061008
    10071009.wp-filter .search-form select {
     1010    margin: 0;
    10081011    height: 33px;
    10091012    vertical-align: top;
     
    12061209}
    12071210
    1208 @media only screen and (max-width: 910px) {
     1211@media only screen and (max-width: 1000px) {
     1212    .filter-items {
     1213        float: none;
     1214    }
     1215
     1216    .wp-filter .media-toolbar-primary,
     1217    .wp-filter .media-toolbar-secondary,
    12091218    .wp-filter .search-form {
    12101219        float: none; /* Remove float from media-views.css */
    12111220        position: relative;
    1212         margin: 20px 0;
     1221        max-width: 100%;
    12131222    }
    12141223}
  • trunk/src/wp-admin/css/list-tables.css

    r29775 r30813  
    631631    display: inline-block;
    632632    vertical-align: middle;
    633     padding: 14px 0;
     633    padding: 15px 0;
    634634    margin: 0 20px 0 0;
    635635}
  • trunk/src/wp-admin/css/media.css

    r30740 r30813  
    11271127
    11281128@media only screen and (max-width: 1120px) {
    1129     .media-frame.mode-grid .attachments-browser .media-toolbar-secondary {
    1130         float: none;
    1131     }
    1132 
    11331129    /* override for media-views.css */
    11341130    #wp-media-grid .wp-filter .attachment-filters {
  • trunk/src/wp-admin/includes/class-wp-media-list-table.php

    r30754 r30813  
    166166?>
    167167<div class="wp-filter">
    168     <?php $this->view_switcher( $mode ); ?>
    169 
    170     <select class="attachment-filters" name="attachment-filter">
    171         <?php
     168    <div class="filter-items">
     169        <?php $this->view_switcher( $mode ); ?>
     170
     171        <select class="attachment-filters" name="attachment-filter">
     172            <?php
     173            if ( ! empty( $views ) ) {
     174                foreach ( $views as $class => $view ) {
     175                    echo "\t$view\n";
     176                }
     177            }
     178            ?>
     179        </select>
     180
     181<?php
     182        $this->extra_tablenav( 'bar' );
     183
     184        /** This filter is documented in wp-admin/inclues/class-wp-list-table.php */
     185        $views = apply_filters( "views_{$this->screen->id}", array() );
     186
     187        // Back compat for pre-4.0 view links.
    172188        if ( ! empty( $views ) ) {
     189            echo '<ul class="filter-links">';
    173190            foreach ( $views as $class => $view ) {
    174                 echo "\t$view\n";
    175             }
    176         }
    177         ?>
    178     </select>
    179 
    180 <?php
    181     $this->extra_tablenav( 'bar' );
    182 
    183     /** This filter is documented in wp-admin/inclues/class-wp-list-table.php */
    184     $views = apply_filters( "views_{$this->screen->id}", array() );
    185 
    186     // Back compat for pre-4.0 view links.
    187     if ( ! empty( $views ) ) {
    188         echo '<ul class="filter-links">';
    189         foreach ( $views as $class => $view ) {
    190             echo "<li class='$class'>$view</li>";
    191         }
    192         echo '</ul>';
    193     }
    194 ?>
     191                echo "<li class='$class'>$view</li>";
     192            }
     193            echo '</ul>';
     194        }
     195?>
     196    </div>
    195197
    196198    <div class="search-form">
  • trunk/src/wp-includes/css/media-views.css

    r30740 r30813  
    232232    float: right;
    233233    height: 100%;
     234    max-width: 33%;
    234235}
    235236
     
    237238    float: left;
    238239    height: 100%;
     240    max-width: 66%;
    239241}
    240242
     
    732734.media-frame select.attachment-filters {
    733735    margin-top: 11px;
    734     margin-right: 10px;
     736    margin-right: 2%;
     737    max-width: 47%;
    735738}
    736739
     
    747750}
    748751
    749 .media-toolbar-secondary .search {
    750     margin-right: 16px;
     752.media-toolbar-primary .search {
     753    max-width: 100%;
    751754}
    752755
     
    21462149:lang(he-il) .rtl .media-frame select {
    21472150    font-family: Arial, sans-serif;
    2148 }
    2149 
    2150 @media only screen and (max-width: 940px) {
    2151     .media-frame-content .media-toolbar-secondary .attachment-filters {
    2152         max-width: 134px;
    2153     }
    21542151}
    21552152
     
    23472344    }
    23482345
    2349     .media-modal .attachments-browser .media-toolbar-primary,
    2350     .media-modal .attachments-browser .media-toolbar-secondary {
    2351         width: 50%;
    2352     }
    2353 
    23542346    .media-modal .attachments-browser .media-toolbar .search {
    23552347        max-width: 100%;
     
    23592351
    23602352    .media-modal .attachments-browser .media-toolbar .attachment-filters {
    2361         margin: 11px 0 0;
    23622353        height: auto;
    2363         max-width: 65%;
    2364         max-width: -webkit-calc(100% - 38px);
    2365         max-width: calc(100% - 38px);
    23662354    }
    23672355
     
    24672455
    24682456@media only screen and (max-width: 480px) {
    2469     .media-frame-content .media-toolbar .attachment-filters {
    2470         max-width: 90px;
    2471     }
    2472 
    24732457    .media-modal-close {
    24742458        top: 5px;
Note: See TracChangeset for help on using the changeset viewer.