Filter bar: Better field display on smaller screens.

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

Built from https://develop.svn.wordpress.org/trunk@30740


git-svn-id: http://core.svn.wordpress.org/trunk@30730 1a063a9b-81f0-0310-95a4-ce76da25c4cd
This commit is contained in:
Helen Hou-Sandí 2014-12-04 22:23:25 +00:00
parent 543f408098
commit f5efcf295b
14 changed files with 94 additions and 48 deletions

View File

@ -988,14 +988,17 @@ th.action-links {
}
.wp-filter .search-form {
float: left;
margin-top: 9px;
margin: 10px;
position: absolute;
left: 0;
top: 0;
}
.wp-filter .search-form input[type="search"] {
margin: 0;
padding: 3px 5px;
width: 280px;
max-width: 280px;
width: 100%;
font-size: 16px;
font-weight: 300;
line-height: 1.5;
@ -1054,6 +1057,7 @@ th.action-links {
.show-filters .filter-drawer {
display: block;
overflow: hidden;
width: 100%;
}
.show-filters .wp-filter .drawer-toggle:hover,
@ -1084,17 +1088,13 @@ th.action-links {
float: right;
margin: 0 0 0 1%;
padding: 10px;
width: 19%;
width: 24%;
background: #fff;
border: 1px solid #e5e5e5;
-webkit-box-shadow: 0 1px 1px rgba(0,0,0,0.04);
box-shadow: 0 1px 1px rgba(0,0,0,0.04);
}
.filter-group.wide {
width: 38%;
}
.filter-group h4 {
position: relative;
margin: 0;
@ -1190,11 +1190,6 @@ th.action-links {
}
@media only screen and (max-width: 1120px) {
.wp-filter .search-form {
float: none;
margin: 20px 0;
}
.filter-drawer {
border-bottom: 1px solid #eee;
}
@ -1210,12 +1205,34 @@ th.action-links {
}
}
@media only screen and (max-width: 910px) {
.wp-filter .search-form {
float: none; /* Remove float from media-views.css */
position: relative;
margin: 20px 0;
}
}
@media only screen and (max-width: 782px) {
.filter-group,
.filter-group li {
width: 100%;
padding: 0;
width: 50%;
}
}
@media only screen and (max-width: 320px) {
.filter-count {
display: none;
}
.wp-filter .drawer-toggle {
margin: 10px 0;
}
.filter-group li,
.wp-filter .search-form input[type="search"] {
width: 100%;
}
}
/*------------------------------------------------------------------------------

View File

@ -988,14 +988,17 @@ th.action-links {
}
.wp-filter .search-form {
float: right;
margin-top: 9px;
margin: 10px;
position: absolute;
right: 0;
top: 0;
}
.wp-filter .search-form input[type="search"] {
margin: 0;
padding: 3px 5px;
width: 280px;
max-width: 280px;
width: 100%;
font-size: 16px;
font-weight: 300;
line-height: 1.5;
@ -1054,6 +1057,7 @@ th.action-links {
.show-filters .filter-drawer {
display: block;
overflow: hidden;
width: 100%;
}
.show-filters .wp-filter .drawer-toggle:hover,
@ -1084,17 +1088,13 @@ th.action-links {
float: left;
margin: 0 1% 0 0;
padding: 10px;
width: 19%;
width: 24%;
background: #fff;
border: 1px solid #e5e5e5;
-webkit-box-shadow: 0 1px 1px rgba(0,0,0,0.04);
box-shadow: 0 1px 1px rgba(0,0,0,0.04);
}
.filter-group.wide {
width: 38%;
}
.filter-group h4 {
position: relative;
margin: 0;
@ -1190,11 +1190,6 @@ th.action-links {
}
@media only screen and (max-width: 1120px) {
.wp-filter .search-form {
float: none;
margin: 20px 0;
}
.filter-drawer {
border-bottom: 1px solid #eee;
}
@ -1210,12 +1205,34 @@ th.action-links {
}
}
@media only screen and (max-width: 910px) {
.wp-filter .search-form {
float: none; /* Remove float from media-views.css */
position: relative;
margin: 20px 0;
}
}
@media only screen and (max-width: 782px) {
.filter-group,
.filter-group li {
width: 100%;
padding: 0;
width: 50%;
}
}
@media only screen and (max-width: 320px) {
.filter-count {
display: none;
}
.wp-filter .drawer-toggle {
margin: 10px 0;
}
.filter-group li,
.wp-filter .search-form input[type="search"] {
width: 100%;
}
}
/*------------------------------------------------------------------------------

View File

@ -1129,6 +1129,11 @@ audio, video {
.media-frame.mode-grid .attachments-browser .media-toolbar-secondary {
float: none;
}
/* override for media-views.css */
#wp-media-grid .wp-filter .attachment-filters {
max-width: 100%;
}
}
@media only screen and ( max-width: 782px ) {

View File

@ -1129,6 +1129,11 @@ audio, video {
.media-frame.mode-grid .attachments-browser .media-toolbar-secondary {
float: none;
}
/* override for media-views.css */
#wp-media-grid .wp-filter .attachment-filters {
max-width: 100%;
}
}
@media only screen and ( max-width: 782px ) {

View File

@ -31,7 +31,8 @@
top: -2px;
right: 20px;
margin: 0;
width: 280px;
max-width: 280px;
width: 100%;
font-size: 16px;
font-weight: 300;
line-height: 1.5;
@ -1720,6 +1721,10 @@ body.full-overlay-active {
.theme-install-overlay .wp-full-overlay-main {
background-image: url(../images/spinner-2x.gif);
}
.theme-install-overlay .wp-full-overlay-header .theme-install {
margin-top: 2px;
}
}
@media screen and ( max-width: 782px ) {

View File

@ -31,7 +31,8 @@
top: -2px;
left: 20px;
margin: 0;
width: 280px;
max-width: 280px;
width: 100%;
font-size: 16px;
font-weight: 300;
line-height: 1.5;
@ -1720,6 +1721,10 @@ body.full-overlay-active {
.theme-install-overlay .wp-full-overlay-main {
background-image: url(../images/spinner-2x.gif);
}
.theme-install-overlay .wp-full-overlay-header .theme-install {
margin-top: 2px;
}
}
@media screen and ( max-width: 782px ) {

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -145,11 +145,7 @@ include(ABSPATH . 'wp-admin/admin-header.php');
<?php
$feature_list = get_theme_feature_list();
foreach ( $feature_list as $feature_name => $features ) {
if ( $feature_name === 'Features' || $feature_name === __( 'Features' ) ) { // hack hack hack
echo '<div class="filter-group wide">';
} else {
echo '<div class="filter-group">';
}
echo '<div class="filter-group">';
$feature_name = esc_html( $feature_name );
echo '<h4>' . $feature_name . '</h4>';
echo '<ol class="feature-group">';

View File

@ -2148,7 +2148,6 @@
}
@media only screen and (max-width: 940px) {
.media-frame-content .media-toolbar-primary .search,
.media-frame-content .media-toolbar-secondary .attachment-filters {
max-width: 134px;
}
@ -2467,7 +2466,6 @@
}
@media only screen and (max-width: 480px) {
.media-frame-content .media-toolbar .search,
.media-frame-content .media-toolbar .attachment-filters {
max-width: 90px;
}

File diff suppressed because one or more lines are too long

View File

@ -2148,7 +2148,6 @@
}
@media only screen and (max-width: 940px) {
.media-frame-content .media-toolbar-primary .search,
.media-frame-content .media-toolbar-secondary .attachment-filters {
max-width: 134px;
}
@ -2467,7 +2466,6 @@
}
@media only screen and (max-width: 480px) {
.media-frame-content .media-toolbar .search,
.media-frame-content .media-toolbar .attachment-filters {
max-width: 90px;
}

File diff suppressed because one or more lines are too long

View File

@ -4,7 +4,7 @@
*
* @global string $wp_version
*/
$wp_version = '4.1-beta2-30739';
$wp_version = '4.1-beta2-30740';
/**
* Holds the WordPress DB revision, increments when changes are made to the WordPress DB schema.