* Make attachment focus styles more obvious, particularly for already selected items.
* Fix styling for the selection set attachments.
* Remove some CSS cruft.

fixes #28822.

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


git-svn-id: http://core.svn.wordpress.org/trunk@29381 1a063a9b-81f0-0310-95a4-ce76da25c4cd
This commit is contained in:
Helen Hou-Sandí 2014-08-25 21:26:16 +00:00
parent a2ad27c03e
commit 13a49fc018
8 changed files with 82 additions and 88 deletions

View File

@ -528,13 +528,16 @@ border color while dragging a file over the uploader drop area */
padding-bottom: 80px; /* offset for above so the bottom doesn't get cut off */
}
.media-frame.mode-grid .attachment:focus {
.media-frame.mode-grid .attachment:focus,
.media-frame.mode-grid .selected.attachment:focus,
.media-frame.mode-grid .attachment.details:focus {
-webkit-box-shadow:
inset 0 0 0 5px #f1f1f1,
inset 0 0 1px 7px #5b9dd9;
inset 0 0 2px 3px #f1f1f1,
inset 0 0 0 7px #5b9dd9;
box-shadow:
inset 0 0 0 5px #f1f1f1,
inset 0 0 1px 7px #5b9dd9;
inset 0 0 2px 3px #f1f1f1,
inset 0 0 0 7px #5b9dd9;
outline: none;
}
.media-frame.mode-grid .selected.attachment {
@ -546,7 +549,7 @@ border color while dragging a file over the uploader drop area */
inset 0 0 0 7px #ccc;
}
.media-frame.mode-grid .selected.attachment:focus {
.media-frame.mode-grid .attachment.details {
-webkit-box-shadow:
inset 0 0 0 3px #f1f1f1,
inset 0 0 0 7px #1e8cbe;

View File

@ -528,13 +528,16 @@ border color while dragging a file over the uploader drop area */
padding-bottom: 80px; /* offset for above so the bottom doesn't get cut off */
}
.media-frame.mode-grid .attachment:focus {
.media-frame.mode-grid .attachment:focus,
.media-frame.mode-grid .selected.attachment:focus,
.media-frame.mode-grid .attachment.details:focus {
-webkit-box-shadow:
inset 0 0 0 5px #f1f1f1,
inset 0 0 1px 7px #5b9dd9;
inset 0 0 2px 3px #f1f1f1,
inset 0 0 0 7px #5b9dd9;
box-shadow:
inset 0 0 0 5px #f1f1f1,
inset 0 0 1px 7px #5b9dd9;
inset 0 0 2px 3px #f1f1f1,
inset 0 0 0 7px #5b9dd9;
outline: none;
}
.media-frame.mode-grid .selected.attachment {
@ -546,7 +549,7 @@ border color while dragging a file over the uploader drop area */
inset 0 0 0 7px #ccc;
}
.media-frame.mode-grid .selected.attachment:focus {
.media-frame.mode-grid .attachment.details {
-webkit-box-shadow:
inset 0 0 0 3px #f1f1f1,
inset 0 0 0 7px #1e8cbe;

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -64,6 +64,17 @@
border-color: #dfdfdf;
}
.media-frame input[type="text"]:focus,
.media-frame input[type="password"]:focus,
.media-frame input[type="number"]:focus,
.media-frame input[type="search"]:focus,
.media-frame input[type="email"]:focus,
.media-frame input[type="url"]:focus,
.media-frame textarea:focus,
.media-frame select:focus {
border-color: #5b9dd9;
}
.media-frame select {
height: 24px;
padding: 2px;
@ -763,13 +774,15 @@
box-sizing: border-box;
}
.attachment:focus {
.attachment:focus,
.selected.attachment:focus,
.attachment.details:focus {
-webkit-box-shadow:
inset 0 0 0 5px #fff,
inset 0 0 1px 7px #5b9dd9;
inset 0 0 2px 3px #fff,
inset 0 0 0 7px #5b9dd9;
box-shadow:
inset 0 0 0 5px #fff,
inset 0 0 1px 7px #5b9dd9;
inset 0 0 2px 3px #fff,
inset 0 0 0 7px #5b9dd9;
outline: none;
}
@ -782,6 +795,15 @@
inset 0 0 0 7px #ccc;
}
.attachment.details {
-webkit-box-shadow:
inset 0 0 0 3px #fff,
inset 0 0 0 7px #1e8cbe;
box-shadow:
inset 0 0 0 3px #fff,
inset 0 0 0 7px #1e8cbe;
}
.attachment-preview {
position: relative;
-webkit-box-shadow:
@ -956,16 +978,6 @@
display: block;
}
.selected.attachment:focus,
.attachment.details {
-webkit-box-shadow:
inset 0 0 0 3px #fff,
inset 0 0 0 7px #1e8cbe;
box-shadow:
inset 0 0 0 3px #fff,
inset 0 0 0 7px #1e8cbe;
}
.attachment.details .check,
.attachment.selected .check:focus,
.media-frame.mode-grid .attachment.selected .check {
@ -1423,31 +1435,13 @@
.media-selection .attachment .icon {
width: 50%;
}
/*
.attachment.selection.selected .thumbnail {
.media-selection .attachment-preview {
-webkit-box-shadow: none;
box-shadow: none;
background: none;
}
.attachment.selection.selected:focus {
-webkit-box-shadow:
0 0 0 1px #5b9dd9,
0 0 2px 2px #5b9dd9;
box-shadow:
0 0 0 1px #5b9dd9,
0 0 2px 2px #5b9dd9;
outline: none;
}
.attachment.selection.details {
-webkit-box-shadow:
0 0 0 1px #fff,
0 0 0 4px #1e8cbe;
box-shadow:
0 0 0 1px #fff,
0 0 0 4px #1e8cbe;
}
*/
.media-selection .attachment.selection.details .thumbnail {
-webkit-box-shadow:
0 0 0 1px #fff,

File diff suppressed because one or more lines are too long

View File

@ -64,6 +64,17 @@
border-color: #dfdfdf;
}
.media-frame input[type="text"]:focus,
.media-frame input[type="password"]:focus,
.media-frame input[type="number"]:focus,
.media-frame input[type="search"]:focus,
.media-frame input[type="email"]:focus,
.media-frame input[type="url"]:focus,
.media-frame textarea:focus,
.media-frame select:focus {
border-color: #5b9dd9;
}
.media-frame select {
height: 24px;
padding: 2px;
@ -763,13 +774,15 @@
box-sizing: border-box;
}
.attachment:focus {
.attachment:focus,
.selected.attachment:focus,
.attachment.details:focus {
-webkit-box-shadow:
inset 0 0 0 5px #fff,
inset 0 0 1px 7px #5b9dd9;
inset 0 0 2px 3px #fff,
inset 0 0 0 7px #5b9dd9;
box-shadow:
inset 0 0 0 5px #fff,
inset 0 0 1px 7px #5b9dd9;
inset 0 0 2px 3px #fff,
inset 0 0 0 7px #5b9dd9;
outline: none;
}
@ -782,6 +795,15 @@
inset 0 0 0 7px #ccc;
}
.attachment.details {
-webkit-box-shadow:
inset 0 0 0 3px #fff,
inset 0 0 0 7px #1e8cbe;
box-shadow:
inset 0 0 0 3px #fff,
inset 0 0 0 7px #1e8cbe;
}
.attachment-preview {
position: relative;
-webkit-box-shadow:
@ -956,16 +978,6 @@
display: block;
}
.selected.attachment:focus,
.attachment.details {
-webkit-box-shadow:
inset 0 0 0 3px #fff,
inset 0 0 0 7px #1e8cbe;
box-shadow:
inset 0 0 0 3px #fff,
inset 0 0 0 7px #1e8cbe;
}
.attachment.details .check,
.attachment.selected .check:focus,
.media-frame.mode-grid .attachment.selected .check {
@ -1423,31 +1435,13 @@
.media-selection .attachment .icon {
width: 50%;
}
/*
.attachment.selection.selected .thumbnail {
.media-selection .attachment-preview {
-webkit-box-shadow: none;
box-shadow: none;
background: none;
}
.attachment.selection.selected:focus {
-webkit-box-shadow:
0 0 0 1px #5b9dd9,
0 0 2px 2px #5b9dd9;
box-shadow:
0 0 0 1px #5b9dd9,
0 0 2px 2px #5b9dd9;
outline: none;
}
.attachment.selection.details {
-webkit-box-shadow:
0 0 0 1px #fff,
0 0 0 4px #1e8cbe;
box-shadow:
0 0 0 1px #fff,
0 0 0 4px #1e8cbe;
}
*/
.media-selection .attachment.selection.details .thumbnail {
-webkit-box-shadow:
0 0 0 1px #fff,

File diff suppressed because one or more lines are too long