.customize-partial-refreshing {
transition: opacity 0.25s;
/* Override highlight when refreshing */
.customize-partial-refreshing.widget-customizer-highlighted-widget {
/* Make shortcut buttons essentially invisible */
.widget .customize-partial-edit-shortcut,
.customize-partial-edit-shortcut {
width: 1px; /* required to have a size to be focusable in Safari */
* Styles for the actual shortcut
* Note that some properties are overly verbose to prevent theme interference.
.widget .customize-partial-edit-shortcut button,
.customize-partial-edit-shortcut button {
line-height: 1 !important;
background: #3582c4 !important;
box-shadow: 0 2px 1px rgba(60, 67, 74, 0.15);
animation-fill-mode: both;
.wp-custom-header .customize-partial-edit-shortcut button {
.customize-partial-edit-shortcut button svg {
.customize-partial-edit-shortcut button:hover {
background: #4f94d4 !important; /* matches primary buttons */
.customize-partial-edit-shortcut button:focus {
box-shadow: 0 0 0 2px #4f94d4;
body.customize-partial-edit-shortcuts-shown .customize-partial-edit-shortcut button {
animation-name: customize-partial-edit-shortcut-bounce-appear;
body.customize-partial-edit-shortcuts-hidden .customize-partial-edit-shortcut button {
animation-name: customize-partial-edit-shortcut-bounce-disappear;
.page-sidebar-collapsed .customize-partial-edit-shortcut button,
.customize-partial-edit-shortcut-hidden .customize-partial-edit-shortcut button {
@keyframes customize-partial-edit-shortcut-bounce-appear {
from, 20%, 40%, 60%, 80%, to {
animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
transform: scale3d(.3, .3, .3);
transform: scale3d(1.1, 1.1, 1.1);
transform: scale3d(.9, .9, .9);
transform: scale3d(1.03, 1.03, 1.03);
transform: scale3d(.97, .97, .97);
transform: scale3d(1, 1, 1);
@keyframes customize-partial-edit-shortcut-bounce-disappear {
from, 20%, 40%, 60%, 80%, to {
animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
transform: scale3d(1, 1, 1);
transform: scale3d(.97, .97, .97);
transform: scale3d(1.03, 1.03, 1.03);
transform: scale3d(.9, .9, .9);
transform: scale3d(1.1, 1.1, 1.1);
transform: scale3d(.3, .3, .3);
@media screen and (max-width: 800px) {
.widget .customize-partial-edit-shortcut button,
.customize-partial-edit-shortcut button {
@media screen and (max-width: 320px) {
.widget .customize-partial-edit-shortcut button,
.customize-partial-edit-shortcut button {