WordPress-C
/
WordPress
mirror of https://github.com/WordPress/WordPress.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Update the media upload interfaces to match new admin design: 

* Replace separate progress bar designs on media-new.php and modal media uploader with a single consistent design
* Remove side borders from list of uploads on media-new.php
* Restyle the selected photo border and checkbox on modal media uploader
* Add a Media Uploader section to color schemes with progress bar and selected photo styles

Fixes #26147. Props melchoyce, iammattthomas.


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


git-svn-id: http://core.svn.wordpress.org/trunk@26213 1a063a9b-81f0-0310-95a4-ce76da25c4cd
This commit is contained in:
Matt Thomas 2013-11-22 00:03:10 +00:00
parent aed612cca4
commit a3f4245602
19 changed files with 105 additions and 111 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
wp-admin/css/color-schemes/_admin.scss
View File

@ -364,6 +364,23 @@ ul#adminmenu > li.current > a.current:after {
}
/* Media Uploader */
.media-item .bar,
.media-progress-bar div {
background-color: $highlight-color;
}
.details.attachment {
box-shadow: 0 0 0 1px #fff, 0 0 0 5px $highlight-color;
}
.attachment.details .check {
background-color: $highlight-color;
box-shadow: 0 0 0 1px $highlight-color;
}
/* Responsive Component */
div#moby6-toggle a:before {

11
wp-admin/css/color-schemes/blue/colors.css
View File

@ -240,6 +240,17 @@ ul#adminmenu a.wp-has-current-submenu:after, ul#adminmenu > li.current > a.curre
.wp-pointer.wp-pointer-top .wp-pointer-arrow, .wp-pointer.wp-pointer-undefined .wp-pointer-arrow {
border-bottom-color: #096484; }
/* Media Uploader */
.media-item .bar, .media-progress-bar div {
background-color: #096484; }
.details.attachment {
box-shadow: 0 0 0 1px white, 0 0 0 5px #096484; }
.attachment.details .check {
background-color: #096484;
box-shadow: 0 0 0 1px #096484; }
/* Responsive Component */
div#moby6-toggle a:before {
color: #e5f8ff; }

2
wp-admin/css/color-schemes/blue/colors.min.css vendored
View File

File diff suppressed because one or more lines are too long

11
wp-admin/css/color-schemes/light/colors.css
View File

@ -240,6 +240,17 @@ ul#adminmenu a.wp-has-current-submenu:after, ul#adminmenu > li.current > a.curre
.wp-pointer.wp-pointer-top .wp-pointer-arrow, .wp-pointer.wp-pointer-undefined .wp-pointer-arrow {
border-bottom-color: #04a4cc; }
/* Media Uploader */
.media-item .bar, .media-progress-bar div {
background-color: #04a4cc; }
.details.attachment {
box-shadow: 0 0 0 1px white, 0 0 0 5px #04a4cc; }
.attachment.details .check {
background-color: #04a4cc;
box-shadow: 0 0 0 1px #04a4cc; }
/* Responsive Component */
div#moby6-toggle a:before {
color: #999999; }

2
wp-admin/css/color-schemes/light/colors.min.css vendored
View File

File diff suppressed because one or more lines are too long

11
wp-admin/css/color-schemes/midnight/colors.css
View File

@ -240,6 +240,17 @@ ul#adminmenu a.wp-has-current-submenu:after, ul#adminmenu > li.current > a.curre
.wp-pointer.wp-pointer-top .wp-pointer-arrow, .wp-pointer.wp-pointer-undefined .wp-pointer-arrow {
border-bottom-color: #e14d43; }
/* Media Uploader */
.media-item .bar, .media-progress-bar div {
background-color: #e14d43; }
.details.attachment {
box-shadow: 0 0 0 1px white, 0 0 0 5px #e14d43; }
.attachment.details .check {
background-color: #e14d43;
box-shadow: 0 0 0 1px #e14d43; }
/* Responsive Component */
div#moby6-toggle a:before {
color: #f1f2f3; }

2
wp-admin/css/color-schemes/midnight/colors.min.css vendored
View File

File diff suppressed because one or more lines are too long

8
wp-admin/css/colors-fresh-rtl.css
View File

@ -1913,17 +1913,17 @@ h2.nav-tab-wrapper, h3.nav-tab-wrapper {
}
.details.attachment {
box-shadow: 0 0 0 1px #fff, 0 0 0 5px #2ea2cc;
box-shadow: 0 0 0 1px #fff, 0 0 0 5px #1e8cbe;
}
.attachment .check {
background: #eee;
box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba( 0, 0, 0, 0.4 );
}
.attachment.details .check {
box-shadow: 0 0 0 1px #2ea2cc;
background: #0074a2;
background-image: none;
background-color: #1e8cbe;
box-shadow: 0 0 0 1px #fff, 0 0 0 2px #1e8cbe;
}
/* TinyMCE modal */

2
wp-admin/css/colors-fresh-rtl.min.css vendored
View File

File diff suppressed because one or more lines are too long

8
wp-admin/css/colors-fresh.css
View File

@ -1913,17 +1913,17 @@ h2.nav-tab-wrapper, h3.nav-tab-wrapper {
}
.details.attachment {
box-shadow: 0 0 0 1px #fff, 0 0 0 5px #2ea2cc;
box-shadow: 0 0 0 1px #fff, 0 0 0 5px #1e8cbe;
}
.attachment .check {
background: #eee;
box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba( 0, 0, 0, 0.4 );
}
.attachment.details .check {
box-shadow: 0 0 0 1px #2ea2cc;
background: #0074a2;
background-image: none;
background-color: #1e8cbe;
box-shadow: 0 0 0 1px #fff, 0 0 0 2px #1e8cbe;
}
/* TinyMCE modal */

2
wp-admin/css/colors-fresh.min.css vendored
View File

File diff suppressed because one or more lines are too long

45
wp-admin/css/wp-admin-rtl.css
View File

@ -5529,7 +5529,6 @@ abbr.required {
display: block;
line-height: 36px;
float: left;
margin-left: 15px;
}
.media-item .describe-toggle-off,
@ -5542,11 +5541,10 @@ abbr.required {
}
#media-items .media-item {
border-style: solid;
border-width: 1px;
border-bottom-style: solid;
border-bottom-width: 1px;
min-height: 36px;
position: relative;
margin-top: -1px;
width: 100%;
}
@ -5565,7 +5563,6 @@ abbr.required {
.media-item .filename {
line-height: 36px;
overflow: hidden;
padding: 0 10px;
}
.media-item .error-div {
@ -5574,7 +5571,7 @@ abbr.required {
.media-item .pinkynail {
float: right;
margin: 2px 2px 0;
margin: 2px 0 0 10px;
max-width: 40px;
max-height: 32px;
}
@ -5592,38 +5589,24 @@ abbr.required {
.media-item .progress {
float: left;
height: 22px;
margin: 6px 0 0 10px;
margin: 7px 0 0;
width: 200px;
line-height: 2em;
padding: 0;
overflow: hidden;
margin-bottom: 2px;
border: 1px solid #d1d1d1;
background: #f7f7f7;
background-image: -webkit-gradient(linear, right bottom, right top, from(#fff), to(#f7f7f7));
background-image: -webkit-linear-gradient(bottom, #fff, #f7f7f7);
background-image: -moz-linear-gradient(bottom, #fff, #f7f7f7);
background-image: -o-linear-gradient(bottom, #fff, #f7f7f7);
background-image: linear-gradient(to top, #fff, #f7f7f7);
-webkit-border-radius: 3px;
border-radius: 3px;
-webkit-box-shadow: inset 0 0 3px rgba(0,0,0,0.1);
box-shadow: inset 0 0 3px rgba(0,0,0,0.1);
border-radius: 22px;
background: #ddd;
-webkit-box-shadow: inset 0px 1px 2px rgba(0,0,0,0.1);
box-shadow: inset 0px 1px 2px rgba(0,0,0,0.1);
}
.media-item .bar {
z-index: 9;
width: 0;
height: 100%;
margin-top: -24px;
background-color: #8cc1e9;
background-image: -webkit-gradient(linear, right bottom, right top, from(#72a7cf), to(#8cc1e9));
background-image: -webkit-linear-gradient(bottom, #72a7cf, #8cc1e9);
background-image: -moz-linear-gradient(bottom, #72a7cf, #8cc1e9);
background-image: -o-linear-gradient(bottom, #72a7cf, #8cc1e9);
background-image: linear-gradient(to top, #72a7cf, #8cc1e9);
-webkit-border-radius: 3px;
border-radius: 3px;
margin-top: -22px;
background-color: #1e8cbe;
-webkit-box-shadow: 0 0 3px rgba(0,0,0,0.3);
box-shadow: 0 0 3px rgba(0,0,0,0.3);
}
@ -5632,8 +5615,12 @@ abbr.required {
z-index: 10;
position: relative;
width: 200px;
padding: 0 8px;
color: rgba(0,0,0,0.6);
padding: 0;
color: #fff;
text-align: center;
line-height: 22px;
font-weight: 400;
text-shadow: 0px 1px 2px rgba(0,0,0,0.2);
}
.upload-php .fixed .column-parent {

2
wp-admin/css/wp-admin-rtl.min.css vendored
View File

File diff suppressed because one or more lines are too long

45
wp-admin/css/wp-admin.css
View File

@ -5533,7 +5533,6 @@ abbr.required {
display: block;
line-height: 36px;
float: right;
margin-right: 15px;
}
.media-item .describe-toggle-off,
@ -5546,11 +5545,10 @@ abbr.required {
}
#media-items .media-item {
border-style: solid;
border-width: 1px;
border-bottom-style: solid;
border-bottom-width: 1px;
min-height: 36px;
position: relative;
margin-top: -1px;
width: 100%;
}
@ -5569,7 +5567,6 @@ abbr.required {
.media-item .filename {
line-height: 36px;
overflow: hidden;
padding: 0 10px;
}
.media-item .error-div {
@ -5578,7 +5575,7 @@ abbr.required {
.media-item .pinkynail {
float: left;
margin: 2px 2px 0;
margin: 2px 10px 0 0;
max-width: 40px;
max-height: 32px;
}
@ -5596,38 +5593,24 @@ abbr.required {
.media-item .progress {
float: right;
height: 22px;
margin: 6px 10px 0 0;
margin: 7px 0 0;
width: 200px;
line-height: 2em;
padding: 0;
overflow: hidden;
margin-bottom: 2px;
border: 1px solid #d1d1d1;
background: #f7f7f7;
background-image: -webkit-gradient(linear, left bottom, left top, from(#fff), to(#f7f7f7));
background-image: -webkit-linear-gradient(bottom, #fff, #f7f7f7);
background-image: -moz-linear-gradient(bottom, #fff, #f7f7f7);
background-image: -o-linear-gradient(bottom, #fff, #f7f7f7);
background-image: linear-gradient(to top, #fff, #f7f7f7);
-webkit-border-radius: 3px;
border-radius: 3px;
-webkit-box-shadow: inset 0 0 3px rgba(0,0,0,0.1);
box-shadow: inset 0 0 3px rgba(0,0,0,0.1);
border-radius: 22px;
background: #ddd;
-webkit-box-shadow: inset 0px 1px 2px rgba(0,0,0,0.1);
box-shadow: inset 0px 1px 2px rgba(0,0,0,0.1);
}
.media-item .bar {
z-index: 9;
width: 0;
height: 100%;
margin-top: -24px;
background-color: #8cc1e9;
background-image: -webkit-gradient(linear, left bottom, left top, from(#72a7cf), to(#8cc1e9));
background-image: -webkit-linear-gradient(bottom, #72a7cf, #8cc1e9);
background-image: -moz-linear-gradient(bottom, #72a7cf, #8cc1e9);
background-image: -o-linear-gradient(bottom, #72a7cf, #8cc1e9);
background-image: linear-gradient(to top, #72a7cf, #8cc1e9);
-webkit-border-radius: 3px;
border-radius: 3px;
margin-top: -22px;
background-color: #1e8cbe;
-webkit-box-shadow: 0 0 3px rgba(0,0,0,0.3);
box-shadow: 0 0 3px rgba(0,0,0,0.3);
}
@ -5636,8 +5619,12 @@ abbr.required {
z-index: 10;
position: relative;
width: 200px;
padding: 0 8px;
color: rgba(0,0,0,0.6);
padding: 0;
color: #fff;
text-align: center;
line-height: 22px;
font-weight: 400;
text-shadow: 0px 1px 2px rgba(0,0,0,0.2);
}
.upload-php .fixed .column-parent {

2
wp-admin/css/wp-admin.min.css vendored
View File

File diff suppressed because one or more lines are too long

21
wp-includes/css/media-views-rtl.css
View File

@ -768,12 +768,9 @@
height: 24px;
width: 24px;
position: absolute;
top: -7px;
left: -7px;
top: -6px;
left: -6px;
outline: none;
border: 1px solid #fff;
box-shadow: 0 0 0 1px rgba( 0, 0, 0, 0.4 );
}
.attachment .check div {
@ -791,17 +788,6 @@
display: block;
}
.attachment.details .check {
box-shadow: 0 0 0 1px #1e8cbe;
background: #1e8cbe;
background-image: -webkit-gradient(linear, right top, right bottom, from(#1e8cbe), to(#0074a2));
background-image: -webkit-linear-gradient(top, #1e8cbe, #0074a2);
background-image: -moz-linear-gradient(top, #1e8cbe, #0074a2);
background-image: -o-linear-gradient(top, #1e8cbe, #0074a2);
background-image: linear-gradient(to bottom, #1e8cbe, #0074a2);
}
.attachment.details .check div {
background-position: -21px 0;
}
@ -877,8 +863,7 @@
height: 10px;
min-width: 20px;
width: 0;
background: #aaa;
background: rgba( 0, 0, 0, 0.2 );
background: #1e8cbe;
border-radius: 10px;
-webkit-transition: width 300ms;
-moz-transition: width 300ms;

2
wp-includes/css/media-views-rtl.min.css vendored
View File

File diff suppressed because one or more lines are too long

21
wp-includes/css/media-views.css
View File

@ -768,12 +768,9 @@
height: 24px;
width: 24px;
position: absolute;
top: -7px;
right: -7px;
top: -6px;
right: -6px;
outline: none;
border: 1px solid #fff;
box-shadow: 0 0 0 1px rgba( 0, 0, 0, 0.4 );
}
.attachment .check div {
@ -791,17 +788,6 @@
display: block;
}
.attachment.details .check {
box-shadow: 0 0 0 1px #1e8cbe;
background: #1e8cbe;
background-image: -webkit-gradient(linear, left top, left bottom, from(#1e8cbe), to(#0074a2));
background-image: -webkit-linear-gradient(top, #1e8cbe, #0074a2);
background-image: -moz-linear-gradient(top, #1e8cbe, #0074a2);
background-image: -o-linear-gradient(top, #1e8cbe, #0074a2);
background-image: linear-gradient(to bottom, #1e8cbe, #0074a2);
}
.attachment.details .check div {
background-position: -21px 0;
}
@ -877,8 +863,7 @@
height: 10px;
min-width: 20px;
width: 0;
background: #aaa;
background: rgba( 0, 0, 0, 0.2 );
background: #1e8cbe;
border-radius: 10px;
-webkit-transition: width 300ms;
-moz-transition: width 300ms;

2
wp-includes/css/media-views.min.css vendored
View File

File diff suppressed because one or more lines are too long