[Summary view] [Print] [Text view]

   1  /*! This file is auto-generated */
   2  .customize-partial-refreshing {
   3      opacity: 0.25;
   4      transition: opacity 0.25s;
   5      cursor: progress;
   6  }
   7  
   8  /* Override highlight when refreshing */
   9  .customize-partial-refreshing.widget-customizer-highlighted-widget {
  10      box-shadow: none;
  11  }
  12  
  13  /* Make shortcut buttons essentially invisible */
  14  .widget .customize-partial-edit-shortcut,
  15  .customize-partial-edit-shortcut {
  16      position: absolute;
  17      float: right;
  18      width: 1px; /* required to have a size to be focusable in Safari */
  19      height: 1px;
  20      padding: 0;
  21      margin: -1px -1px 0 0;
  22      border: 0;
  23      background: transparent;
  24      color: transparent;
  25      box-shadow: none;
  26      outline: none;
  27      z-index: 5;
  28  }
  29  
  30  /**
  31   * Styles for the actual shortcut
  32   *
  33   * Note that some properties are overly verbose to prevent theme interference.
  34   */
  35  .widget .customize-partial-edit-shortcut button,
  36  .customize-partial-edit-shortcut button {
  37      position: absolute;
  38      right: -30px;
  39      top: 2px;
  40      color: #fff;
  41      width: 30px;
  42      height: 30px;
  43      min-width: 30px;
  44      min-height: 30px;
  45      line-height: 1 !important;
  46      font-size: 18px;
  47      z-index: 5;
  48      background: #3582c4 !important;
  49      border-radius: 50%;
  50      border: 2px solid #fff;
  51      box-shadow: 0 2px 1px rgba(60, 67, 74, 0.15);
  52      text-align: center;
  53      cursor: pointer;
  54      box-sizing: border-box;
  55      padding: 3px;
  56      animation-fill-mode: both;
  57      animation-duration: .4s;
  58      opacity: 0;
  59      pointer-events: none;
  60      text-shadow:
  61          0 -1px 1px #135e96,
  62          -1px 0 1px #135e96,
  63          0 1px 1px #135e96,
  64          1px 0 1px #135e96;
  65  }
  66  .wp-custom-header .customize-partial-edit-shortcut button {
  67      right: 2px
  68  }
  69  
  70  .customize-partial-edit-shortcut button svg {
  71      fill: #fff;
  72      min-width: 20px;
  73      min-height: 20px;
  74      width: 20px;
  75      height: 20px;
  76      margin: auto;
  77  }
  78  
  79  .customize-partial-edit-shortcut button:hover {
  80      background: #4f94d4 !important; /* matches primary buttons */
  81  }
  82  
  83  .customize-partial-edit-shortcut button:focus {
  84      box-shadow: 0 0 0 2px #4f94d4;
  85  }
  86  
  87  body.customize-partial-edit-shortcuts-shown .customize-partial-edit-shortcut button {
  88      animation-name: customize-partial-edit-shortcut-bounce-appear;
  89      pointer-events: auto;
  90  }
  91  body.customize-partial-edit-shortcuts-hidden .customize-partial-edit-shortcut button {
  92      animation-name: customize-partial-edit-shortcut-bounce-disappear;
  93      pointer-events: none;
  94  }
  95  
  96  .page-sidebar-collapsed .customize-partial-edit-shortcut button,
  97  .customize-partial-edit-shortcut-hidden .customize-partial-edit-shortcut button {
  98      visibility: hidden;
  99  }
 100  
 101  @keyframes customize-partial-edit-shortcut-bounce-appear {
 102      from, 20%, 40%, 60%, 80%, to {
 103          animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
 104      }
 105      0% {
 106          opacity: 0;
 107          transform: scale3d(.3, .3, .3);
 108      }
 109      20% {
 110          transform: scale3d(1.1, 1.1, 1.1);
 111      }
 112      40% {
 113          transform: scale3d(.9, .9, .9);
 114      }
 115      60% {
 116          opacity: 1;
 117          transform: scale3d(1.03, 1.03, 1.03);
 118      }
 119      80% {
 120          transform: scale3d(.97, .97, .97);
 121      }
 122      to {
 123          opacity: 1;
 124          transform: scale3d(1, 1, 1);
 125      }
 126  }
 127  
 128  @keyframes customize-partial-edit-shortcut-bounce-disappear {
 129      from, 20%, 40%, 60%, 80%, to {
 130          animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
 131      }
 132      0% {
 133          opacity: 1;
 134          transform: scale3d(1, 1, 1);
 135      }
 136      20% {
 137          transform: scale3d(.97, .97, .97);
 138      }
 139      40% {
 140          opacity: 1;
 141          transform: scale3d(1.03, 1.03, 1.03);
 142      }
 143      60% {
 144          transform: scale3d(.9, .9, .9);
 145      }
 146      80% {
 147          transform: scale3d(1.1, 1.1, 1.1);
 148      }
 149      to {
 150          opacity: 0;
 151          transform: scale3d(.3, .3, .3);
 152      }
 153  }
 154  
 155  @media screen and (max-width: 800px) {
 156      .widget .customize-partial-edit-shortcut button,
 157      .customize-partial-edit-shortcut button {
 158          right: -32px;
 159      }
 160  }
 161  
 162  @media screen and (max-width: 320px) {
 163      .widget .customize-partial-edit-shortcut button,
 164      .customize-partial-edit-shortcut button {
 165          right: -30px;
 166      }
 167  }