[Summary view] [Print] [Text view]

   1  /**
   2   * Colors
   3   */
   4  /**
   5   * SCSS Variables.
   6   *
   7   * Please use variables from this sheet to ensure consistency across the UI.
   8   * Don't add to this sheet unless you're pretty sure the value will be reused in many places.
   9   * For example, don't add rules to this sheet that affect block visuals. It's purely for UI.
  10   */
  11  /**
  12   * Fonts & basic variables.
  13   */
  14  /**
  15   * Typography
  16   */
  17  /**
  18   * Grid System.
  19   * https://make.wordpress.org/design/2019/10/31/proposal-a-consistent-spacing-system-for-wordpress/
  20   */
  21  /**
  22   * Radius scale.
  23   */
  24  /**
  25   * Elevation scale.
  26   */
  27  /**
  28   * Dimensions.
  29   */
  30  /**
  31   * Mobile specific styles
  32   */
  33  /**
  34   * Editor styles.
  35   */
  36  /**
  37   * Block & Editor UI.
  38   */
  39  /**
  40   * Block paddings.
  41   */
  42  /**
  43   * React Native specific.
  44   * These variables do not appear to be used anywhere else.
  45   */
  46  .wp-block[data-align=center] > .wp-block-site-logo,
  47  .wp-block-site-logo.aligncenter > div {
  48    display: table;
  49    margin-right: auto;
  50    margin-left: auto;
  51  }
  52  
  53  .wp-block-site-logo a {
  54    pointer-events: none;
  55  }
  56  .wp-block-site-logo .custom-logo-link {
  57    cursor: inherit;
  58  }
  59  .wp-block-site-logo .custom-logo-link:focus {
  60    box-shadow: none;
  61  }
  62  .wp-block-site-logo img {
  63    display: block;
  64    height: auto;
  65    max-width: 100%;
  66  }
  67  .wp-block-site-logo.is-transient {
  68    position: relative;
  69  }
  70  .wp-block-site-logo.is-transient img {
  71    opacity: 0.3;
  72  }
  73  .wp-block-site-logo.is-transient .components-spinner {
  74    position: absolute;
  75    top: 50%;
  76    right: 50%;
  77    transform: translate(50%, -50%);
  78    margin: 0;
  79  }
  80  
  81  .wp-block-site-logo.wp-block-site-logo.is-default-size .components-placeholder {
  82    height: 60px;
  83    width: 60px;
  84  }
  85  .wp-block-site-logo.wp-block-site-logo > div,
  86  .wp-block-site-logo.wp-block-site-logo .components-resizable-box__container {
  87    border-radius: inherit;
  88  }
  89  .wp-block-site-logo.wp-block-site-logo .components-placeholder {
  90    display: flex;
  91    justify-content: center;
  92    align-items: center;
  93    padding: 0;
  94    border-radius: inherit;
  95    min-height: 48px;
  96    min-width: 48px;
  97    height: 100%;
  98    width: 100%;
  99  }
 100  .wp-block-site-logo.wp-block-site-logo .components-placeholder .components-form-file-upload {
 101    display: none;
 102  }
 103  .wp-block-site-logo.wp-block-site-logo .components-placeholder .components-drop-zone__content-text {
 104    display: none;
 105  }
 106  .wp-block-site-logo.wp-block-site-logo .components-placeholder .components-button.components-button {
 107    padding: 0;
 108    margin: auto;
 109    display: flex;
 110    justify-content: center;
 111    align-items: center;
 112    width: 48px;
 113    height: 48px;
 114    border-radius: 50%;
 115    position: relative;
 116    background: var(--wp-admin-theme-color);
 117    border-color: var(--wp-admin-theme-color);
 118    border-style: solid;
 119    color: #fff;
 120  }
 121  .wp-block-site-logo.wp-block-site-logo .components-placeholder .components-button.components-button > svg {
 122    color: inherit;
 123  }
 124  
 125  .block-library-site-logo__inspector-media-replace-container {
 126    position: relative;
 127  }
 128  .block-library-site-logo__inspector-media-replace-container .components-drop-zone__content-icon {
 129    display: none;
 130  }
 131  .block-library-site-logo__inspector-media-replace-container button.components-button {
 132    color: #1e1e1e;
 133    box-shadow: inset 0 0 0 1px #ccc;
 134    width: 100%;
 135    display: block;
 136    height: 40px;
 137  }
 138  .block-library-site-logo__inspector-media-replace-container button.components-button:hover {
 139    color: var(--wp-admin-theme-color);
 140  }
 141  .block-library-site-logo__inspector-media-replace-container button.components-button:focus {
 142    box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
 143  }
 144  .block-library-site-logo__inspector-media-replace-container .block-library-site-logo__inspector-media-replace-title {
 145    word-break: break-all;
 146    white-space: normal;
 147    text-align: start;
 148    text-align-last: center;
 149  }
 150  .block-library-site-logo__inspector-media-replace-container .components-dropdown {
 151    display: block;
 152  }
 153  .block-library-site-logo__inspector-media-replace-container img {
 154    width: 20px;
 155    min-width: 20px;
 156    aspect-ratio: 1;
 157    box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.2);
 158    border-radius: 50% !important;
 159  }
 160  .block-library-site-logo__inspector-media-replace-container .block-library-site-logo__inspector-readonly-logo-preview {
 161    padding: 6px 12px;
 162    display: flex;
 163    height: 40px;
 164  }