Customize: Fix a visual glitch on the widget control animation introduced in [40480].

Also, restores the original design intent that was meant to "compact widget-tops
on smaller laptops, but not tablets".

See #27112.
Fixes #31476.


git-svn-id: https://develop.svn.wordpress.org/trunk@40569 602fd350-edb4-49c9-b593-d223f7449a82
This commit is contained in:
Andrea Fercia 2017-05-03 22:38:26 +00:00
parent 2dec345a1b
commit 859c3551ac

View File

@ -18,6 +18,7 @@
overflow: visible;
}
/* Note: widget-tops are more compact when (max-height: 700px) and (min-width: 981px). */
.customize-control-widget_form .widget-top {
background: #fff;
-webkit-transition: opacity 0.5s;
@ -423,37 +424,47 @@ body.adding-widget #customize-preview {
#available-widgets [class*="twitter"] .widget-title:before { content: "\f301"; }
@media screen and (max-height: 700px) and (min-width: 981px) {
.customize-control-widget {
/* Compact widget-tops on smaller laptops, but not tablets. See ticket #27112#comment:4 */
.customize-control-widget_form {
margin-bottom: 0;
}
.widget-top {
-webkit-box-shadow: none;
box-shadow: none;
margin-top: -1px;
}
.widget-top:hover {
position: relative;
z-index: 1;
}
.last-widget {
margin-bottom: 15px;
}
/* This rule reduces the widgets titles height. */
.widget-title h3 {
padding: 13px 15px;
}
.widget-top .widget-action {
padding-bottom: 8px;
padding: 8px 10px;
}
.widget-reorder-nav span {
height: 39px;
}
.widget-reorder-nav span:before {
line-height: 39px;
}
/* Compact the move widget areas. */
#customize-theme-controls .widget-area-select li {
padding: 9px 15px 11px 42px;
}
#customize-theme-controls .widget-area-select li:before {
top: 8px;
}