@wordpress/block-editor 7.0.2 → 8.0.1

package/build-style/style-rtl.css

@@ -96,6 +96,10 @@
   margin-left: 8px;
 }
 
+.block-editor-block-alignment-control__menu-group .components-menu-item__info {
+  margin-top: 0;
+}
+
 .block-editor-block-alignment-matrix-control__popover .components-popover__content {
   min-width: 0;
   width: auto;
@@ -392,6 +396,22 @@
   z-index: 21;
 }
 
+.wp-site-blocks > [data-align=left] {
+  float: right;
+  margin-left: 2em;
+}
+
+.wp-site-blocks > [data-align=right] {
+  float: left;
+  margin-right: 2em;
+}
+
+.wp-site-blocks > [data-align=center] {
+  justify-content: center;
+  margin-right: auto;
+  margin-left: auto;
+}
+
 /**
  * In-Canvas Inserter
  */
@@ -475,26 +495,15 @@
 .block-editor-block-list__insertion-point-indicator {
   position: absolute;
   background: var(--wp-admin-theme-color);
-  animation: block-editor-inserter__toggle__fade-in-animation-delayed 0.3s ease;
-  animation-fill-mode: forwards;
-}
-@media (prefers-reduced-motion: reduce) {
-  .block-editor-block-list__insertion-point-indicator {
-    animation-duration: 1ms;
-    animation-delay: 0s;
-  }
 }
 .block-editor-block-list__insertion-point.is-vertical > .block-editor-block-list__insertion-point-indicator {
   top: 50%;
-  left: 0;
-  right: 0;
   height: 1px;
 }
 .block-editor-block-list__insertion-point.is-horizontal > .block-editor-block-list__insertion-point-indicator {
   top: 0;
   left: 0;
   right: 50%;
-  height: 100%;
   width: 1px;
 }
 
@@ -546,30 +555,6 @@
   background: #1e1e1e;
 }
 
-.block-editor-block-list__insertion-point-inserter .block-editor-inserter__toggle.components-button,
-.block-editor-block-list__block-popover-inserter .block-editor-inserter__toggle.components-button {
-  animation: block-editor-inserter__toggle__fade-in-animation-delayed 0.3s ease;
-  animation-fill-mode: forwards;
-}
-@media (prefers-reduced-motion: reduce) {
-  .block-editor-block-list__insertion-point-inserter .block-editor-inserter__toggle.components-button,
-.block-editor-block-list__block-popover-inserter .block-editor-inserter__toggle.components-button {
-    animation-duration: 1ms;
-    animation-delay: 0s;
-  }
-}
-
-@keyframes block-editor-inserter__toggle__fade-in-animation-delayed {
-  0% {
-    opacity: 0;
-  }
-  60% {
-    opacity: 0;
-  }
-  100% {
-    opacity: 1;
-  }
-}
 /**
  * Block Toolbar when contextual.
  */
@@ -1001,8 +986,17 @@
   font-size: 13px;
 }
 
-.is-dragging {
-  display: none !important;
+.block-editor-block-list__layout .is-dragging {
+  background-color: currentColor !important;
+  opacity: 0.05 !important;
+  border-radius: 2px !important;
+  pointer-events: none !important;
+}
+.block-editor-block-list__layout .is-dragging::selection {
+  background: transparent !important;
+}
+.block-editor-block-list__layout .is-dragging::after {
+  content: none !important;
 }
 
 .block-editor-block-mobile-toolbar {
@@ -1163,7 +1157,7 @@
 
 .block-editor-block-patterns-list__list-item {
   cursor: pointer;
-  margin-top: 16px;
+  margin-bottom: 24px;
 }
 .block-editor-block-patterns-list__list-item.is-placeholder {
   min-height: 100px;
@@ -1174,23 +1168,28 @@
 
 .block-editor-block-patterns-list__item {
   height: 100%;
+}
+.block-editor-block-patterns-list__item .block-editor-block-preview__container {
+  display: flex;
+  align-items: center;
+  overflow: hidden;
   border-radius: 2px;
-  transition: all 0.05s ease-in-out;
-  position: relative;
-  border: 1px solid transparent;
+  border: 1px solid #f0f0f0;
 }
-.block-editor-block-patterns-list__item:hover {
+.block-editor-block-patterns-list__item .block-editor-block-patterns-list__item-title {
+  padding-top: 8px;
+  font-size: 12px;
+  text-align: center;
+}
+.block-editor-block-patterns-list__item:hover .block-editor-block-preview__container {
   border: 1px solid var(--wp-admin-theme-color);
 }
-.block-editor-block-patterns-list__item:focus {
+.block-editor-block-patterns-list__item:focus .block-editor-block-preview__container {
   box-shadow: inset 0 0 0 1px #fff, 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
   outline: 2px solid transparent;
 }
-
-.block-editor-block-patterns-list__item-title {
-  padding: 4px;
-  font-size: 12px;
-  text-align: center;
+.block-editor-block-patterns-list__item:hover .block-editor-block-patterns-list__item-title, .block-editor-block-patterns-list__item:focus .block-editor-block-patterns-list__item-title {
+  color: var(--wp-admin-theme-color);
 }
 
 .block-editor-block-preview__container {
@@ -1198,10 +1197,6 @@
   width: 100%;
   overflow: hidden;
 }
-.block-editor-block-preview__container.editor-styles-wrapper {
-  padding: 0;
-  margin: 0;
-}
 .block-editor-block-preview__container .block-editor-block-preview__content {
   top: 0;
   right: 0;
@@ -1217,14 +1212,6 @@
 .block-editor-block-preview__container .block-editor-block-preview__content .block-list-appender {
   display: none;
 }
-.block-editor-block-preview__container .block-editor-block-preview__content .block-editor-block-list__layout.is-root-container {
-  padding-right: 0;
-  padding-left: 0;
-}
-.block-editor-block-preview__container .block-editor-block-preview__content .block-editor-block-list__layout.is-root-container > .wp-block[data-align=full] {
-  margin-right: 0;
-  margin-left: 0;
-}
 
 .block-editor-block-settings-menu__popover .components-dropdown-menu__menu {
   padding: 0;
@@ -1475,9 +1462,6 @@
 }
 
 .block-editor-block-types-list > [role=presentation] {
-  padding: 4px;
-  margin-right: -4px;
-  margin-left: -4px;
   overflow: hidden;
   display: flex;
   flex-wrap: wrap;
@@ -1796,10 +1780,6 @@
 .block-editor-color-gradient-control .block-editor-color-gradient-control__color-indicator {
   margin-bottom: 12px;
 }
-.block-editor-color-gradient-control .block-editor-color-gradient-control__button-tabs {
-  display: block;
-  margin-bottom: 12px;
-}
 
 .block-editor-panel-color-gradient-settings .component-color-indicator {
   vertical-align: text-bottom;
@@ -1812,15 +1792,14 @@
 }
 @media screen and (min-width: 782px) {
   .block-editor-panel-color-gradient-settings .components-circular-option-picker__swatches {
-    margin-left: 0;
-  }
-  .block-editor-panel-color-gradient-settings .components-circular-option-picker__option-wrapper {
-    margin-left: calc((100% - (28px * 6)) / 5);
-  }
-  .block-editor-panel-color-gradient-settings .components-circular-option-picker__option-wrapper:nth-child(6n+6) {
-    margin-left: 0;
+    display: grid;
+    grid-template-columns: repeat(6, 28px);
+    justify-content: space-between;
   }
 }
+.block-editor-block-inspector .block-editor-panel-color-gradient-settings .components-base-control {
+  margin-bottom: inherit;
+}
 
 .block-editor-contrast-checker > .components-notice {
   margin: 0;
@@ -1870,31 +1849,36 @@
   left: 0;
 }
 
-.block-editor-duotone-control__popover .components-popover__content {
-  border: 1px solid #1e1e1e;
-  min-width: 214px;
-}
-.block-editor-duotone-control__popover .components-circular-option-picker {
-  padding: 12px;
+.block-editor-duotone-control__popover > .components-popover__content > div {
+  padding: 16px;
+  width: 280px;
 }
 .block-editor-duotone-control__popover .components-menu-group__label {
-  padding: 12px 12px 0 12px;
-  width: 100%;
-  box-sizing: border-box;
+  padding: 0;
+}
+.block-editor-duotone-control__popover .components-custom-gradient-picker__gradient-bar {
+  margin: 16px 0 12px;
+}
+.block-editor-duotone-control__popover .components-circular-option-picker__swatches {
+  display: grid;
+  grid-template-columns: repeat(6, 28px);
+  gap: 12px;
+  justify-content: space-between;
 }
 
-.block-editor-duotone-control__popover > .components-popover__content {
-  width: 334px;
+.block-editor-duotone-control__description {
+  margin: 16px 0;
+  font-size: 12px;
 }
 
 .block-editor-duotone-control__popover:not([data-y-axis=middle][data-x-axis=right]) > .components-popover__content {
   margin-right: -14px;
 }
 
-.components-font-appearance-control__select {
+.components-font-appearance-control {
   margin-bottom: 24px;
 }
-.components-font-appearance-control__select ul li {
+.components-font-appearance-control ul li {
   color: #1e1e1e;
   text-transform: capitalize;
 }
@@ -1940,7 +1924,27 @@
   position: relative;
 }
 
-.block-editor-link-control .block-editor-link-control__search-input.block-editor-link-control__search-input input[type=text] {
+.block-editor-link-control__search-input-container {
+  position: relative;
+}
+
+.block-editor-link-control__search-input.has-no-label .block-editor-url-input__input {
+  flex: 1;
+}
+
+.block-editor-link-control__field {
+  margin: 16px;
+}
+.block-editor-link-control__field > .components-base-control__field {
+  display: flex;
+  align-items: center;
+  margin: 0;
+}
+.block-editor-link-control__field .components-base-control__label {
+  margin-left: 16px;
+  margin-bottom: 0;
+}
+.block-editor-link-control__field input[type=text], .block-editor-link-control__field.block-editor-url-input input[type=text].block-editor-url-input__input {
   font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
   padding: 6px 8px;
   box-shadow: 0 0 0 transparent;
@@ -1955,42 +1959,39 @@
   display: block;
   padding: 11px 16px;
   padding-left: 36px;
-  margin: 16px;
+  margin: 0;
   position: relative;
   border: 1px solid #ddd;
   border-radius: 2px;
 }
 @media (prefers-reduced-motion: reduce) {
-  .block-editor-link-control .block-editor-link-control__search-input.block-editor-link-control__search-input input[type=text] {
+  .block-editor-link-control__field input[type=text], .block-editor-link-control__field.block-editor-url-input input[type=text].block-editor-url-input__input {
     transition-duration: 0s;
     transition-delay: 0s;
   }
 }
 @media (min-width: 600px) {
-  .block-editor-link-control .block-editor-link-control__search-input.block-editor-link-control__search-input input[type=text] {
+  .block-editor-link-control__field input[type=text], .block-editor-link-control__field.block-editor-url-input input[type=text].block-editor-url-input__input {
     font-size: 13px;
     /* Override core line-height. To be reviewed. */
     line-height: normal;
   }
 }
-.block-editor-link-control .block-editor-link-control__search-input.block-editor-link-control__search-input input[type=text]:focus {
+.block-editor-link-control__field input[type=text]:focus, .block-editor-link-control__field.block-editor-url-input input[type=text].block-editor-url-input__input:focus {
   border-color: var(--wp-admin-theme-color);
   box-shadow: 0 0 0 1px var(--wp-admin-theme-color);
   outline: 2px solid transparent;
 }
-.block-editor-link-control .block-editor-link-control__search-input.block-editor-link-control__search-input input[type=text]::-webkit-input-placeholder {
+.block-editor-link-control__field input[type=text]::-webkit-input-placeholder, .block-editor-link-control__field.block-editor-url-input input[type=text].block-editor-url-input__input::-webkit-input-placeholder {
   color: rgba(30, 30, 30, 0.62);
 }
-.block-editor-link-control .block-editor-link-control__search-input.block-editor-link-control__search-input input[type=text]::-moz-placeholder {
+.block-editor-link-control__field input[type=text]::-moz-placeholder, .block-editor-link-control__field.block-editor-url-input input[type=text].block-editor-url-input__input::-moz-placeholder {
   opacity: 1;
   color: rgba(30, 30, 30, 0.62);
 }
-.block-editor-link-control .block-editor-link-control__search-input.block-editor-link-control__search-input input[type=text]:-ms-input-placeholder {
+.block-editor-link-control__field input[type=text]:-ms-input-placeholder, .block-editor-link-control__field.block-editor-url-input input[type=text].block-editor-url-input__input:-ms-input-placeholder {
   color: rgba(30, 30, 30, 0.62);
 }
-.block-editor-link-control .block-editor-link-control__search-input .components-base-control__field {
-  margin-bottom: 0;
-}
 
 .block-editor-link-control__search-error {
   margin: -8px 16px 16px;
@@ -2003,14 +2004,13 @@
    * when suggestions are rendered.
    *
    * Compensate for:
-   *  - Input margin ($grid-unit-20)
    *  - Border (1px)
    *  - Vertically, for the difference in height between the input (40px) and
    *    the icon buttons.
    *  - Horizontally, pad to the minimum of: default input padding, or the
    *    equivalent of the vertical padding.
    */
-  top: 19px;
+  top: 3px;
   left: 19px;
 }
 
@@ -2069,11 +2069,14 @@
   border: none;
   text-align: right;
   padding: 12px 16px;
-  border-radius: 5px;
+  border-radius: 2px;
   height: auto;
 }
 .block-editor-link-control__search-item:hover, .block-editor-link-control__search-item:focus {
-  background-color: #ddd;
+  background-color: #f0f0f0;
+}
+.block-editor-link-control__search-item:hover .block-editor-link-control__search-item-type, .block-editor-link-control__search-item:focus .block-editor-link-control__search-item-type {
+  background: #fff;
 }
 .block-editor-link-control__search-item:focus:not(:disabled) {
   box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color) inset;
@@ -2097,7 +2100,6 @@
   flex-direction: row;
   align-items: flex-start;
   margin-left: 8px;
-  overflow: hidden;
   white-space: pre-wrap;
   word-wrap: break-word;
 }
@@ -2105,8 +2107,8 @@
   display: flex;
   flex: 1;
 }
-.block-editor-link-control__search-item .block-editor-link-control__search-item-details {
-  overflow: hidden;
+.block-editor-link-control__search-item.is-error .block-editor-link-control__search-item-header {
+  align-items: center;
 }
 .block-editor-link-control__search-item .block-editor-link-control__search-item-icon {
   position: relative;
@@ -2121,6 +2123,11 @@
 .block-editor-link-control__search-item .block-editor-link-control__search-item-icon img {
   width: 16px;
 }
+.block-editor-link-control__search-item.is-error .block-editor-link-control__search-item-icon {
+  top: 0;
+  width: 32px;
+  max-height: 32px;
+}
 .block-editor-link-control__search-item .block-editor-link-control__search-item-info,
 .block-editor-link-control__search-item .block-editor-link-control__search-item-title {
   overflow: hidden;
@@ -2140,7 +2147,7 @@
 }
 .block-editor-link-control__search-item .block-editor-link-control__search-item-title mark {
   font-weight: 700;
-  color: #000;
+  color: inherit;
   background-color: transparent;
 }
 .block-editor-link-control__search-item .block-editor-link-control__search-item-title span {
@@ -2155,9 +2162,13 @@
   font-size: 0.9em;
   line-height: 1.3;
 }
+.block-editor-link-control__search-item .block-editor-link-control__search-item-error-notice {
+  font-style: italic;
+  font-size: 1.1em;
+}
 .block-editor-link-control__search-item .block-editor-link-control__search-item-type {
   display: block;
-  padding: 3px 8px;
+  padding: 3px 6px;
   margin-right: auto;
   font-size: 0.9em;
   background-color: #f0f0f0;
@@ -2267,6 +2278,16 @@
   width: 100%;
 }
 
+.block-editor-link-control__search-create {
+  align-items: center;
+}
+.block-editor-link-control__search-create .block-editor-link-control__search-item-title {
+  margin-bottom: 0;
+}
+.block-editor-link-control__search-create .block-editor-link-control__search-item-icon {
+  top: 0;
+}
+
 .block-editor-link-control__search-results div[role=menu] > .block-editor-link-control__search-item.block-editor-link-control__search-item {
   padding: 10px;
 }
@@ -2395,7 +2416,6 @@
   background: transparent;
   word-break: break-word;
   border-radius: 2px;
-  border: 1px solid transparent;
   transition: all 0.05s ease-in-out;
   position: relative;
   height: auto;
@@ -2411,9 +2431,11 @@
   cursor: default;
 }
 .components-button.block-editor-block-types-list__item:not(:disabled):hover {
-  border-color: var(--wp-admin-theme-color);
   color: var(--wp-admin-theme-color) !important;
 }
+.components-button.block-editor-block-types-list__item:not(:disabled):focus {
+  box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
+}
 .components-button.block-editor-block-types-list__item:not(:disabled).is-active {
   color: #fff;
   background: #1e1e1e;
@@ -2469,19 +2491,24 @@
 .block-editor-list-view-leaf {
   position: relative;
 }
-.block-editor-list-view-leaf.is-selected .block-editor-list-view-block-contents {
+.block-editor-list-view-leaf.is-selected {
   background: var(--wp-admin-theme-color);
+}
+.block-editor-list-view-leaf.is-selected .block-editor-list-view-block-contents, .block-editor-list-view-leaf.is-selected .components-button.has-icon {
   color: #fff;
 }
 .is-dragging-components-draggable .block-editor-list-view-leaf.is-selected .block-editor-list-view-block-contents {
   background: none;
   color: #1e1e1e;
 }
-.block-editor-list-view-leaf.is-selected .block-editor-list-view-block-contents:focus {
+.block-editor-list-view-leaf.is-selected .block-editor-list-view-block-contents:focus::after {
   box-shadow: inset 0 0 0 1px #fff, 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
 }
-.is-dragging-components-draggable .block-editor-list-view-leaf.is-selected .block-editor-list-view-block-contents:focus {
-  box-shadow: none;
+.block-editor-list-view-leaf.is-selected .block-editor-list-view-block__menu:focus {
+  box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) #fff;
+}
+.block-editor-list-view-leaf.is-branch-selected:not(.is-selected) {
+  background: linear-gradient(rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), linear-gradient(var(--wp-admin-theme-color), var(--wp-admin-theme-color));
 }
 .block-editor-list-view-leaf.is-branch-selected.is-selected .block-editor-list-view-block-contents {
   border-radius: 2px 2px 0 0;
@@ -2490,12 +2517,8 @@
   border-radius: 2px;
 }
 .block-editor-list-view-leaf.is-branch-selected:not(.is-selected) .block-editor-list-view-block-contents {
-  background: linear-gradient(rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), linear-gradient(var(--wp-admin-theme-color), var(--wp-admin-theme-color));
   border-radius: 0;
 }
-.block-editor-list-view-leaf.is-branch-selected.is-last-of-selected-branch .block-editor-list-view-block-contents {
-  border-radius: 0 0 2px 2px;
-}
 .block-editor-list-view-leaf.is-dragging {
   display: none;
 }
@@ -2511,15 +2534,6 @@
   position: relative;
   white-space: nowrap;
 }
-.block-editor-list-view-leaf .block-editor-list-view-block-contents:hover, .block-editor-list-view-leaf .block-editor-list-view-block-contents:focus {
-  box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
-}
-.is-dragging-components-draggable .block-editor-list-view-leaf .block-editor-list-view-block-contents:hover, .is-dragging-components-draggable .block-editor-list-view-leaf .block-editor-list-view-block-contents:focus {
-  box-shadow: none;
-}
-.block-editor-list-view-leaf .block-editor-list-view-block-contents:focus {
-  z-index: 1;
-}
 .block-editor-list-view-leaf .block-editor-list-view-block-contents.is-dropping-before::before {
   content: "";
   position: absolute;
@@ -2534,6 +2548,34 @@
   padding-right: 0;
   padding-left: 0;
 }
+.block-editor-list-view-leaf .block-editor-list-view-block-contents:focus {
+  box-shadow: none;
+}
+.block-editor-list-view-leaf .block-editor-list-view-block-contents:focus::after {
+  content: "";
+  position: absolute;
+  top: 0;
+  left: -29px;
+  bottom: 0;
+  right: 0;
+  border-radius: inherit;
+  box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
+  z-index: 1;
+  pointer-events: none;
+}
+.is-dragging-components-draggable .block-editor-list-view-leaf .block-editor-list-view-block-contents:focus::after {
+  box-shadow: none;
+}
+.block-editor-list-view-leaf.has-single-cell .block-editor-list-view-block-contents:focus::after {
+  left: 0;
+}
+.block-editor-list-view-leaf .block-editor-list-view-block__menu:focus {
+  box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
+  z-index: 1;
+}
+.is-dragging-components-draggable .block-editor-list-view-leaf .block-editor-list-view-block__menu:focus {
+  box-shadow: none;
+}
 .block-editor-list-view-leaf.is-visible .block-editor-list-view-block-contents {
   opacity: 1;
   animation: edit-post__fade-in-animation 0.2s ease-out 0s;
@@ -2561,7 +2603,7 @@
   line-height: 0;
   width: 36px;
   opacity: 0;
-  vertical-align: top;
+  vertical-align: middle;
 }
 @media (prefers-reduced-motion: reduce) {
   .block-editor-list-view-leaf .block-editor-list-view-block__menu-cell,
@@ -2596,7 +2638,10 @@
   padding: 0;
 }
 .block-editor-list-view-leaf .block-editor-list-view-block__menu-cell {
-  padding-top: 8px;
+  padding-left: 5px;
+}
+.block-editor-list-view-leaf .block-editor-list-view-block__menu-cell .components-button.has-icon {
+  height: 24px;
 }
 .block-editor-list-view-leaf .block-editor-list-view-block__mover-cell-alignment-wrapper {
   display: flex;
@@ -2681,7 +2726,6 @@
   background: rgba(0, 0, 0, 0.3);
 }
 
-.block-editor-list-view-block-slot__description,
 .block-editor-list-view-block-select-button__description,
 .block-editor-list-view-appender__description {
   display: none;
@@ -2782,6 +2826,12 @@
   box-shadow: none;
 }
 
+.block-editor-list-view-placeholder {
+  padding: 0;
+  margin: 0;
+  height: 36px;
+}
+
 .modal-open .block-editor-media-replace-flow__options {
   display: none;
 }
@@ -3060,10 +3110,6 @@ figcaption.block-editor-rich-text__editable [data-rich-text-placeholder]::before
   z-index: 100000;
 }
 
-.block-editor-text-decoration-and-transform {
-  display: flex;
-}
-
 .block-editor-text-transform-control {
   flex: 0 0 50%;
 }
@@ -3451,6 +3497,15 @@ figcaption.block-editor-rich-text__editable [data-rich-text-placeholder]::before
   font-size: 12px;
 }
 
+.block-editor-hooks__flex-layout-justification-controls,
+.block-editor-hooks__flex-layout-orientation-controls {
+  margin-bottom: 12px;
+}
+.block-editor-hooks__flex-layout-justification-controls legend,
+.block-editor-hooks__flex-layout-orientation-controls legend {
+  margin-bottom: 8px;
+}
+
 .block-editor-hooks__border-controls .block-editor-hooks__border-controls-row {
   display: flex;
   justify-content: space-between;
@@ -3465,6 +3520,19 @@ figcaption.block-editor-rich-text__editable [data-rich-text-placeholder]::before
   margin-bottom: 8px;
 }
 
+.typography-block-support-panel .components-font-appearance-control,
+.typography-block-support-panel .components-font-size-picker__controls,
+.typography-block-support-panel .block-editor-text-decoration-control__buttons,
+.typography-block-support-panel .block-editor-text-transform-control__buttons {
+  margin-bottom: 0;
+}
+.typography-block-support-panel .block-editor-line-height-control input {
+  max-width: 100%;
+}
+.typography-block-support-panel .single-column {
+  grid-column: span 1;
+}
+
 /**
  * Block Toolbar
  */
@@ -3712,7 +3780,7 @@ figcaption.block-editor-rich-text__editable [data-rich-text-placeholder]::before
 
 .block-editor-inserter__search {
   background: #fff;
-  padding: 16px;
+  padding: 16px 16px 0 16px;
   position: sticky;
   top: 0;
   z-index: 1;
@@ -3720,15 +3788,17 @@ figcaption.block-editor-rich-text__editable [data-rich-text-placeholder]::before
 .block-editor-inserter__search .components-search-control__icon {
   left: 20px;
 }
+.block-editor-inserter__search .components-base-control__field {
+  margin-bottom: 0;
+}
 
 .block-editor-inserter__tabs {
   display: flex;
   flex-direction: column;
-  margin-top: -8px;
 }
 .block-editor-inserter__tabs .components-tab-panel__tabs {
   position: sticky;
-  top: 72px;
+  top: 64px;
   background: #fff;
   z-index: 1;
   border-bottom: 1px solid #ddd;
@@ -3769,7 +3839,8 @@ figcaption.block-editor-rich-text__editable [data-rich-text-placeholder]::before
 }
 
 .block-editor-inserter__panel-dropdown select.components-select-control__input.components-select-control__input.components-select-control__input {
-  line-height: 1.2;
+  height: 36px;
+  line-height: 36px;
 }
 
 .block-editor-inserter__panel-dropdown select {
@@ -3781,10 +3852,6 @@ figcaption.block-editor-rich-text__editable [data-rich-text-placeholder]::before
   position: relative;
 }
 
-.block-editor-inserter__popover .block-editor-block-types-list {
-  margin: -8px;
-}
-
 .block-editor-inserter__reusable-blocks-panel {
   position: relative;
   text-align: left;
@@ -3797,7 +3864,6 @@ figcaption.block-editor-rich-text__editable [data-rich-text-placeholder]::before
 
 .block-editor-inserter__no-results {
   padding: 32px;
-  margin-top: 64px;
   text-align: center;
 }
 
@@ -3899,6 +3965,12 @@ figcaption.block-editor-rich-text__editable [data-rich-text-placeholder]::before
   grid-template-columns: 1fr 1fr;
   grid-gap: 8px;
 }
+.block-editor-inserter__quick-inserter-patterns .block-editor-block-patterns-list .block-editor-block-patterns-list__list-item {
+  margin-bottom: 0;
+}
+.block-editor-inserter__quick-inserter-patterns .block-editor-block-patterns-list .block-editor-block-preview__container {
+  min-height: 100px;
+}
 
 .block-editor-inserter__quick-inserter-separator {
   border-top: 1px solid #ddd;
@@ -3922,8 +3994,59 @@ figcaption.block-editor-rich-text__editable [data-rich-text-placeholder]::before
 .block-editor-inserter__quick-inserter-expand.components-button:active {
   color: #ccc;
 }
-.block-editor-inserter__quick-inserter-expand.components-button:focus:not(:disabled) {
-  box-shadow: inset 0 0 0 1.5px var(--wp-admin-theme-color), inset 0 0 0 3px #fff;
+.block-editor-inserter__quick-inserter-expand.components-button.components-button:focus:not(:disabled) {
+  box-shadow: none;
+  background: var(--wp-admin-theme-color);
+  border-color: var(--wp-admin-theme-color);
+}
+
+.block-editor-block-patterns-explorer__sidebar {
+  position: absolute;
+  top: 60px;
+  right: 0;
+  bottom: 0;
+  width: 280px;
+  padding: 24px 32px 32px;
+  overflow-x: visible;
+  overflow-y: scroll;
+}
+.block-editor-block-patterns-explorer__sidebar__categories-list__item {
+  display: block;
+  width: 100%;
+  height: 48px;
+  text-align: right;
+}
+.block-editor-block-patterns-explorer__search {
+  margin-bottom: 32px;
+}
+.block-editor-block-patterns-explorer__search-results-count {
+  padding-bottom: 32px;
+}
+.block-editor-block-patterns-explorer__list {
+  margin-right: 248px;
+}
+.block-editor-block-patterns-explorer .block-editor-block-patterns-list {
+  display: grid;
+  grid-gap: 32px;
+  grid-template-columns: repeat(1, 1fr);
+}
+@media (min-width: 1080px) {
+  .block-editor-block-patterns-explorer .block-editor-block-patterns-list {
+    grid-template-columns: repeat(2, 1fr);
+  }
+}
+@media (min-width: 1440px) {
+  .block-editor-block-patterns-explorer .block-editor-block-patterns-list {
+    grid-template-columns: repeat(3, 1fr);
+  }
+}
+.block-editor-block-patterns-explorer .block-editor-block-patterns-list .block-editor-block-patterns-list__list-item {
+  min-height: 240px;
+}
+.block-editor-block-patterns-explorer .block-editor-block-patterns-list .block-editor-block-preview__container {
+  height: inherit;
+  min-height: 100px;
+  max-height: 800px;
 }
 
 .block-editor-post-preview__dropdown {