WordPress.org

Make WordPress Core

Changeset 30740


Ignore:
Timestamp:
12/04/2014 10:22:26 PM (6 years ago)
Author:
helen
Message:

Filter bar: Better field display on smaller screens.

props TacoVerdo, jesin.
fixes #29556 and #29495.

Location:
trunk/src
Files:
5 edited

Legend:

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

    r30707 r30740  
    989989
    990990.wp-filter .search-form {
    991     float: right;
    992     margin-top: 9px;
     991    margin: 10px;
     992    position: absolute;
     993    right: 0;
     994    top: 0;
    993995}
    994996
     
    996998    margin: 0;
    997999    padding: 3px 5px;
    998     width: 280px;
     1000    max-width: 280px;
     1001    width: 100%;
    9991002    font-size: 16px;
    10001003    font-weight: 300;
     
    10551058    display: block;
    10561059    overflow: hidden;
     1060    width: 100%;
    10571061}
    10581062
     
    10851089    margin: 0 1% 0 0;
    10861090    padding: 10px;
    1087     width: 19%;
     1091    width: 24%;
    10881092    background: #fff;
    10891093    border: 1px solid #e5e5e5;
    10901094    -webkit-box-shadow: 0 1px 1px rgba(0,0,0,0.04);
    10911095    box-shadow: 0 1px 1px rgba(0,0,0,0.04);
    1092 }
    1093 
    1094 .filter-group.wide {
    1095     width: 38%;
    10961096}
    10971097
     
    11911191
    11921192@media only screen and (max-width: 1120px) {
    1193     .wp-filter .search-form {
    1194         float: none;
    1195         margin: 20px 0;
    1196     }
    1197 
    11981193    .filter-drawer {
    11991194        border-bottom: 1px solid #eee;
     
    12111206}
    12121207
     1208@media only screen and (max-width: 910px) {
     1209    .wp-filter .search-form {
     1210        float: none; /* Remove float from media-views.css */
     1211        position: relative;
     1212        margin: 20px 0;
     1213    }
     1214}
     1215
    12131216@media only screen and (max-width: 782px) {
    1214     .filter-group,
    12151217    .filter-group li {
     1218        padding: 0;
     1219        width: 50%;
     1220    }
     1221}
     1222
     1223@media only screen and (max-width: 320px) {
     1224    .filter-count {
     1225        display: none;
     1226    }
     1227
     1228    .wp-filter .drawer-toggle {
     1229        margin: 10px 0;
     1230    }
     1231
     1232    .filter-group li,
     1233    .wp-filter .search-form input[type="search"] {
    12161234        width: 100%;
    12171235    }
    1218 
    12191236}
    12201237
  • trunk/src/wp-admin/css/media.css

    r29811 r30740  
    11301130        float: none;
    11311131    }
     1132
     1133    /* override for media-views.css */
     1134    #wp-media-grid .wp-filter .attachment-filters {
     1135        max-width: 100%;
     1136    }
    11321137}
    11331138
  • trunk/src/wp-admin/css/themes.css

    r30101 r30740  
    3232    left: 20px;
    3333    margin: 0;
    34     width: 280px;
     34    max-width: 280px;
     35    width: 100%;
    3536    font-size: 16px;
    3637    font-weight: 300;
     
    17211722        background-image: url(../images/spinner-2x.gif);
    17221723    }
     1724
     1725    .theme-install-overlay .wp-full-overlay-header .theme-install {
     1726        margin-top: 2px;
     1727    }
    17231728}
    17241729
  • trunk/src/wp-admin/theme-install.php

    r30649 r30740  
    146146        $feature_list = get_theme_feature_list();
    147147        foreach ( $feature_list as $feature_name => $features ) {
    148             if ( $feature_name === 'Features' || $feature_name === __( 'Features' ) ) { // hack hack hack
    149                 echo '<div class="filter-group wide">';
    150             } else {
    151                 echo '<div class="filter-group">';
    152             }
     148            echo '<div class="filter-group">';
    153149            $feature_name = esc_html( $feature_name );
    154150            echo '<h4>' . $feature_name . '</h4>';
  • trunk/src/wp-includes/css/media-views.css

    r30460 r30740  
    21492149
    21502150@media only screen and (max-width: 940px) {
    2151     .media-frame-content .media-toolbar-primary .search,
    21522151    .media-frame-content .media-toolbar-secondary .attachment-filters {
    21532152        max-width: 134px;
     
    24682467
    24692468@media only screen and (max-width: 480px) {
    2470     .media-frame-content .media-toolbar .search,
    24712469    .media-frame-content .media-toolbar .attachment-filters {
    24722470        max-width: 90px;
Note: See TracChangeset for help on using the changeset viewer.