Media:
* 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:
parent
a2ad27c03e
commit
13a49fc018
|
@ -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 */
|
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:
|
-webkit-box-shadow:
|
||||||
inset 0 0 0 5px #f1f1f1,
|
inset 0 0 2px 3px #f1f1f1,
|
||||||
inset 0 0 1px 7px #5b9dd9;
|
inset 0 0 0 7px #5b9dd9;
|
||||||
box-shadow:
|
box-shadow:
|
||||||
inset 0 0 0 5px #f1f1f1,
|
inset 0 0 2px 3px #f1f1f1,
|
||||||
inset 0 0 1px 7px #5b9dd9;
|
inset 0 0 0 7px #5b9dd9;
|
||||||
|
outline: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
.media-frame.mode-grid .selected.attachment {
|
.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;
|
inset 0 0 0 7px #ccc;
|
||||||
}
|
}
|
||||||
|
|
||||||
.media-frame.mode-grid .selected.attachment:focus {
|
.media-frame.mode-grid .attachment.details {
|
||||||
-webkit-box-shadow:
|
-webkit-box-shadow:
|
||||||
inset 0 0 0 3px #f1f1f1,
|
inset 0 0 0 3px #f1f1f1,
|
||||||
inset 0 0 0 7px #1e8cbe;
|
inset 0 0 0 7px #1e8cbe;
|
||||||
|
|
|
@ -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 */
|
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:
|
-webkit-box-shadow:
|
||||||
inset 0 0 0 5px #f1f1f1,
|
inset 0 0 2px 3px #f1f1f1,
|
||||||
inset 0 0 1px 7px #5b9dd9;
|
inset 0 0 0 7px #5b9dd9;
|
||||||
box-shadow:
|
box-shadow:
|
||||||
inset 0 0 0 5px #f1f1f1,
|
inset 0 0 2px 3px #f1f1f1,
|
||||||
inset 0 0 1px 7px #5b9dd9;
|
inset 0 0 0 7px #5b9dd9;
|
||||||
|
outline: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
.media-frame.mode-grid .selected.attachment {
|
.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;
|
inset 0 0 0 7px #ccc;
|
||||||
}
|
}
|
||||||
|
|
||||||
.media-frame.mode-grid .selected.attachment:focus {
|
.media-frame.mode-grid .attachment.details {
|
||||||
-webkit-box-shadow:
|
-webkit-box-shadow:
|
||||||
inset 0 0 0 3px #f1f1f1,
|
inset 0 0 0 3px #f1f1f1,
|
||||||
inset 0 0 0 7px #1e8cbe;
|
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
|
@ -64,6 +64,17 @@
|
||||||
border-color: #dfdfdf;
|
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 {
|
.media-frame select {
|
||||||
height: 24px;
|
height: 24px;
|
||||||
padding: 2px;
|
padding: 2px;
|
||||||
|
@ -763,13 +774,15 @@
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
}
|
}
|
||||||
|
|
||||||
.attachment:focus {
|
.attachment:focus,
|
||||||
|
.selected.attachment:focus,
|
||||||
|
.attachment.details:focus {
|
||||||
-webkit-box-shadow:
|
-webkit-box-shadow:
|
||||||
inset 0 0 0 5px #fff,
|
inset 0 0 2px 3px #fff,
|
||||||
inset 0 0 1px 7px #5b9dd9;
|
inset 0 0 0 7px #5b9dd9;
|
||||||
box-shadow:
|
box-shadow:
|
||||||
inset 0 0 0 5px #fff,
|
inset 0 0 2px 3px #fff,
|
||||||
inset 0 0 1px 7px #5b9dd9;
|
inset 0 0 0 7px #5b9dd9;
|
||||||
outline: none;
|
outline: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -782,6 +795,15 @@
|
||||||
inset 0 0 0 7px #ccc;
|
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 {
|
.attachment-preview {
|
||||||
position: relative;
|
position: relative;
|
||||||
-webkit-box-shadow:
|
-webkit-box-shadow:
|
||||||
|
@ -956,16 +978,6 @@
|
||||||
display: block;
|
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.details .check,
|
||||||
.attachment.selected .check:focus,
|
.attachment.selected .check:focus,
|
||||||
.media-frame.mode-grid .attachment.selected .check {
|
.media-frame.mode-grid .attachment.selected .check {
|
||||||
|
@ -1423,31 +1435,13 @@
|
||||||
.media-selection .attachment .icon {
|
.media-selection .attachment .icon {
|
||||||
width: 50%;
|
width: 50%;
|
||||||
}
|
}
|
||||||
/*
|
|
||||||
.attachment.selection.selected .thumbnail {
|
.media-selection .attachment-preview {
|
||||||
-webkit-box-shadow: none;
|
-webkit-box-shadow: none;
|
||||||
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 {
|
.media-selection .attachment.selection.details .thumbnail {
|
||||||
-webkit-box-shadow:
|
-webkit-box-shadow:
|
||||||
0 0 0 1px #fff,
|
0 0 0 1px #fff,
|
||||||
|
|
File diff suppressed because one or more lines are too long
|
@ -64,6 +64,17 @@
|
||||||
border-color: #dfdfdf;
|
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 {
|
.media-frame select {
|
||||||
height: 24px;
|
height: 24px;
|
||||||
padding: 2px;
|
padding: 2px;
|
||||||
|
@ -763,13 +774,15 @@
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
}
|
}
|
||||||
|
|
||||||
.attachment:focus {
|
.attachment:focus,
|
||||||
|
.selected.attachment:focus,
|
||||||
|
.attachment.details:focus {
|
||||||
-webkit-box-shadow:
|
-webkit-box-shadow:
|
||||||
inset 0 0 0 5px #fff,
|
inset 0 0 2px 3px #fff,
|
||||||
inset 0 0 1px 7px #5b9dd9;
|
inset 0 0 0 7px #5b9dd9;
|
||||||
box-shadow:
|
box-shadow:
|
||||||
inset 0 0 0 5px #fff,
|
inset 0 0 2px 3px #fff,
|
||||||
inset 0 0 1px 7px #5b9dd9;
|
inset 0 0 0 7px #5b9dd9;
|
||||||
outline: none;
|
outline: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -782,6 +795,15 @@
|
||||||
inset 0 0 0 7px #ccc;
|
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 {
|
.attachment-preview {
|
||||||
position: relative;
|
position: relative;
|
||||||
-webkit-box-shadow:
|
-webkit-box-shadow:
|
||||||
|
@ -956,16 +978,6 @@
|
||||||
display: block;
|
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.details .check,
|
||||||
.attachment.selected .check:focus,
|
.attachment.selected .check:focus,
|
||||||
.media-frame.mode-grid .attachment.selected .check {
|
.media-frame.mode-grid .attachment.selected .check {
|
||||||
|
@ -1423,31 +1435,13 @@
|
||||||
.media-selection .attachment .icon {
|
.media-selection .attachment .icon {
|
||||||
width: 50%;
|
width: 50%;
|
||||||
}
|
}
|
||||||
/*
|
|
||||||
.attachment.selection.selected .thumbnail {
|
.media-selection .attachment-preview {
|
||||||
-webkit-box-shadow: none;
|
-webkit-box-shadow: none;
|
||||||
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 {
|
.media-selection .attachment.selection.details .thumbnail {
|
||||||
-webkit-box-shadow:
|
-webkit-box-shadow:
|
||||||
0 0 0 1px #fff,
|
0 0 0 1px #fff,
|
||||||
|
|
File diff suppressed because one or more lines are too long
Loading…
Reference in New Issue