Media: Fix CSS layout issues in Replace media dialog.

Make focus outline fully visible at all media query breakpoints, prevent the date filter from becoming hidden, and match the heading styles to other screens.

Props sabernhardt, hareesh-pillai, alvitazwar052.
Fixes #54395.

git-svn-id: https://develop.svn.wordpress.org/trunk@55896 602fd350-edb4-49c9-b593-d223f7449a82
This commit is contained in:
Joe Dolson 2023-06-08 11:14:21 +00:00
parent 7d503a499f
commit 37a2c8d540

View File

@ -371,7 +371,7 @@
}
.media-sidebar h2,
.image-details h2:not(.media-attachments-filter-heading) {
.image-details .media-embed h2 {
position: relative;
font-weight: 600;
text-transform: uppercase;
@ -906,8 +906,6 @@
.media-frame select.attachment-filters:last-of-type {
margin-right: 0;
width: auto;
max-width: 100%;
}
/**
@ -2609,6 +2607,16 @@
right: 262px;
}
.attachments-browser .media-toolbar {
height: 82px;
}
.attachments-browser .attachments,
.attachments-browser .uploader-inline,
.media-frame-content .attachments-browser .attachments-wrapper {
top: 82px;
}
.media-sidebar .setting,
.attachment-details .setting {
margin: 6px 0;
@ -2819,15 +2827,6 @@
}
@media screen and (max-width: 782px) {
.attachments-browser .media-toolbar {
height: 82px;
}
.attachments-browser .attachments,
.attachments-browser .uploader-inline {
top: 82px;
}
.media-frame-toolbar .media-toolbar {
bottom: -54px;
}
@ -2878,10 +2877,6 @@
right: 0;
}
.attachments-browser .attachments-wrapper {
padding-top: 12px;
}
.image-details .media-frame-title {
display: block;
top: 0;