@wordpress/block-library 7.7.0 → 7.10.0

package/build-style/style-rtl.css

@@ -83,9 +83,6 @@
   text-align: center;
 }
 
-.wp-block-audio {
-  margin: 0 0 1em 0;
-}
 .wp-block-audio figcaption {
   margin-top: 0.5em;
   margin-bottom: 1em;
@@ -96,14 +93,9 @@
 }
 
 .wp-block-button__link {
-  color: #fff;
-  background-color: #32373c;
-  border-radius: 9999px;
   box-shadow: none;
   cursor: pointer;
   display: inline-block;
-  font-size: 1.125em;
-  padding: calc(0.667em + 2px) calc(1.333em + 2px);
   text-align: center;
   text-decoration: none;
   word-break: break-word;
@@ -119,6 +111,11 @@
   text-align: right;
 }
 
+:where(.wp-block-button__link) {
+  border-radius: 9999px;
+  padding: calc(0.667em + 2px) calc(1.333em + 2px);
+}
+
 .wp-block-buttons > .wp-block-button.has-custom-width {
   max-width: none;
 }
@@ -389,6 +386,18 @@
   list-style: none;
   padding-right: 2rem;
 }
+.wp-block-comment-template.alignleft {
+  float: right;
+}
+.wp-block-comment-template.aligncenter {
+  margin-right: auto;
+  margin-left: auto;
+  width: -moz-fit-content;
+  width: fit-content;
+}
+.wp-block-comment-template.alignright {
+  float: left;
+}
 
 .wp-block-cover-image,
 .wp-block-cover {
@@ -704,8 +713,7 @@
   height: 100%;
   max-width: none;
   max-height: none;
-  -o-object-fit: cover;
-     object-fit: cover;
+  object-fit: cover;
   outline: none;
   border: none;
   box-shadow: none;
@@ -822,7 +830,6 @@ section.wp-block-cover-image > h2,
 }
 
 .wp-block-embed {
-  margin: 0 0 1em 0;
   overflow-wrap: break-word;
 }
 .wp-block-embed figcaption {
@@ -877,34 +884,33 @@ section.wp-block-cover-image > h2,
 .wp-block-file {
   margin-bottom: 1.5em;
 }
+.wp-block-file:not(.wp-element-button) {
+  font-size: 0.8em;
+}
 .wp-block-file.aligncenter {
   text-align: center;
 }
 .wp-block-file.alignright {
   text-align: right;
 }
-.wp-block-file .wp-block-file__embed {
+.wp-block-file * + .wp-block-file__button {
+  margin-right: 0.75em;
+}
+
+.wp-block-file__embed {
   margin-bottom: 1em;
 }
-.wp-block-file .wp-block-file__button {
-  background: #32373c;
+
+:where(.wp-block-file__button) {
   border-radius: 2em;
-  color: #fff;
-  font-size: 0.8em;
   padding: 0.5em 1em;
 }
-.wp-block-file a.wp-block-file__button {
-  text-decoration: none;
-}
-.wp-block-file a.wp-block-file__button:hover, .wp-block-file a.wp-block-file__button:visited, .wp-block-file a.wp-block-file__button:focus, .wp-block-file a.wp-block-file__button:active {
+:where(.wp-block-file__button):is(a):hover, :where(.wp-block-file__button):is(a):visited, :where(.wp-block-file__button):is(a):focus, :where(.wp-block-file__button):is(a):active {
   box-shadow: none;
   color: #fff;
   opacity: 0.85;
   text-decoration: none;
 }
-.wp-block-file * + .wp-block-file__button {
-  margin-right: 0.75em;
-}
 
 .wp-block-gallery:not(.has-nested-images),
 .blocks-gallery-grid:not(.has-nested-images) {
@@ -989,8 +995,7 @@ section.wp-block-cover-image > h2,
   width: 100%;
   height: 100%;
   flex: 1;
-  -o-object-fit: cover;
-     object-fit: cover;
+  object-fit: cover;
 }
 .wp-block-gallery:not(.has-nested-images).columns-1 .blocks-gallery-image, .wp-block-gallery:not(.has-nested-images).columns-1 .blocks-gallery-item,
 .blocks-gallery-grid:not(.has-nested-images).columns-1 .blocks-gallery-image,
@@ -1179,8 +1184,7 @@ figure.wp-block-gallery.has-nested-images {
   width: 100%;
   flex: 1 0 0%;
   height: 100%;
-  -o-object-fit: cover;
-     object-fit: cover;
+  object-fit: cover;
 }
 .wp-block-gallery.has-nested-images.columns-1 figure.wp-block-image:not(#individual-image) {
   width: 100%;
@@ -1236,9 +1240,6 @@ h6.has-background {
   padding: 1.25em 2.375em;
 }
 
-.wp-block-image {
-  margin: 0 0 1em 0;
-}
 .wp-block-image img {
   height: auto;
   max-width: 100%;
@@ -1589,7 +1590,6 @@ ul.has-background {
   display: none;
 }
 .wp-block-navigation .wp-block-navigation-item__content {
-  color: inherit;
   display: block;
   padding: 0;
 }
@@ -2022,6 +2022,15 @@ button.wp-block-navigation-item__content {
   position: relative;
 }
 
+.has-modal-open .admin-bar .wp-block-navigation__responsive-dialog {
+  margin-top: 46px;
+}
+@media (min-width: 782px) {
+  .has-modal-open .admin-bar .wp-block-navigation__responsive-dialog {
+    margin-top: 32px;
+  }
+}
+
 html.has-modal-open {
   overflow: hidden;
 }
@@ -2215,7 +2224,8 @@ p.has-background {
 .wp-block-post-comments input:not([type=submit]):not([type=checkbox]) {
   padding: calc(0.667em + 2px);
 }
-.wp-block-post-comments input[type=submit] {
+
+:where(.wp-block-post-comments input[type="submit"]) {
   border: none;
 }
 
@@ -2382,49 +2392,40 @@ p.has-background {
   color: inherit;
 }
 
-.wp-block-post-template,
-.wp-block-query-loop {
+.wp-block-post-template {
   margin-top: 0;
   margin-bottom: 0;
   max-width: 100%;
   list-style: none;
   padding: 0;
 }
-.wp-block-post-template.wp-block-post-template,
-.wp-block-query-loop.wp-block-post-template {
+.wp-block-post-template.wp-block-post-template {
   background: none;
 }
-.wp-block-post-template.is-flex-container,
-.wp-block-query-loop.is-flex-container {
+.wp-block-post-template.is-flex-container {
   flex-direction: row;
   display: flex;
   flex-wrap: wrap;
   gap: 1.25em;
 }
-.wp-block-post-template.is-flex-container li,
-.wp-block-query-loop.is-flex-container li {
+.wp-block-post-template.is-flex-container li {
   margin: 0;
   width: 100%;
 }
 @media (min-width: 600px) {
-  .wp-block-post-template.is-flex-container.is-flex-container.columns-2 > li,
-.wp-block-query-loop.is-flex-container.is-flex-container.columns-2 > li {
+  .wp-block-post-template.is-flex-container.is-flex-container.columns-2 > li {
     width: calc((100% / 2) - 1.25em + (1.25em / 2));
   }
-  .wp-block-post-template.is-flex-container.is-flex-container.columns-3 > li,
-.wp-block-query-loop.is-flex-container.is-flex-container.columns-3 > li {
+  .wp-block-post-template.is-flex-container.is-flex-container.columns-3 > li {
     width: calc((100% / 3) - 1.25em + (1.25em / 3));
   }
-  .wp-block-post-template.is-flex-container.is-flex-container.columns-4 > li,
-.wp-block-query-loop.is-flex-container.is-flex-container.columns-4 > li {
+  .wp-block-post-template.is-flex-container.is-flex-container.columns-4 > li {
     width: calc((100% / 4) - 1.25em + (1.25em / 4));
   }
-  .wp-block-post-template.is-flex-container.is-flex-container.columns-5 > li,
-.wp-block-query-loop.is-flex-container.is-flex-container.columns-5 > li {
+  .wp-block-post-template.is-flex-container.is-flex-container.columns-5 > li {
     width: calc((100% / 5) - 1.25em + (1.25em / 5));
   }
-  .wp-block-post-template.is-flex-container.is-flex-container.columns-6 > li,
-.wp-block-query-loop.is-flex-container.is-flex-container.columns-6 > li {
+  .wp-block-post-template.is-flex-container.is-flex-container.columns-6 > li {
     width: calc((100% / 6) - 1.25em + (1.25em / 6));
   }
 }
@@ -2538,15 +2539,8 @@ ul.wp-block-rss.is-grid li {
 }
 
 .wp-block-search__button {
-  background: #f7f7f7;
-  border: 1px solid #ccc;
-  padding: 0.375em 0.625em;
-  color: #32373c;
   margin-right: 0.625em;
   word-break: normal;
-  font-size: inherit;
-  font-family: inherit;
-  line-height: inherit;
 }
 .wp-block-search__button.has-icon {
   line-height: 0;
@@ -2557,6 +2551,11 @@ ul.wp-block-rss.is-grid li {
   fill: currentColor;
 }
 
+:where(.wp-block-search__button) {
+  border: 1px solid #ccc;
+  padding: 0.375em 0.625em;
+}
+
 .wp-block-search__inside-wrapper {
   display: flex;
   flex: auto;
@@ -2582,19 +2581,19 @@ ul.wp-block-rss.is-grid li {
   margin-right: 0;
 }
 
-.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper {
+:where(.wp-block-search__button-inside .wp-block-search__inside-wrapper) {
   padding: 4px;
   border: 1px solid #949494;
 }
-.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__input {
+:where(.wp-block-search__button-inside .wp-block-search__inside-wrapper) .wp-block-search__input {
   border-radius: 0;
   border: none;
   padding: 0 0.25em 0 0;
 }
-.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__input:focus {
+:where(.wp-block-search__button-inside .wp-block-search__inside-wrapper) .wp-block-search__input:focus {
   outline: none;
 }
-.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button {
+:where(.wp-block-search__button-inside .wp-block-search__inside-wrapper) :where(.wp-block-search__button) {
   padding: 0.125em 0.5em;
 }
 
@@ -3055,7 +3054,6 @@ ul.wp-block-rss.is-grid li {
 }
 
 .wp-block-table {
-  margin: 0 0 1em 0;
   overflow-x: auto;
 }
 .wp-block-table table {
@@ -3207,16 +3205,12 @@ pre.wp-block-verse {
   white-space: pre-wrap;
 }
 
-.wp-block-video {
-  margin: 0 0 1em 0;
-}
 .wp-block-video video {
   width: 100%;
 }
 @supports (position: sticky) {
   .wp-block-video [poster] {
-    -o-object-fit: cover;
-       object-fit: cover;
+    object-fit: cover;
   }
 }
 .wp-block-video.aligncenter {
@@ -3326,7 +3320,6 @@ pre.wp-block-verse {
 .screen-reader-text {
   border: 0;
   clip: rect(1px, 1px, 1px, 1px);
-  -webkit-clip-path: inset(50%);
   clip-path: inset(50%);
   height: 1px;
   margin: -1px;
@@ -3340,8 +3333,7 @@ pre.wp-block-verse {
 .screen-reader-text:focus {
   background-color: #ddd;
   clip: auto !important;
-  -webkit-clip-path: none;
-          clip-path: none;
+  clip-path: none;
   color: #444;
   display: block;
   font-size: 1em;
@@ -3412,4 +3404,11 @@ html :where([style*="border-left-width"]) {
 html :where(img[class*="wp-image-"]) {
   height: auto;
   max-width: 100%;
+}
+
+/**
+ * Element styles.
+ */
+.wp-element-button {
+  cursor: pointer;
 }

package/build-style/style.css

@@ -83,9 +83,6 @@
   text-align: center;
 }
 
-.wp-block-audio {
-  margin: 0 0 1em 0;
-}
 .wp-block-audio figcaption {
   margin-top: 0.5em;
   margin-bottom: 1em;
@@ -96,14 +93,9 @@
 }
 
 .wp-block-button__link {
-  color: #fff;
-  background-color: #32373c;
-  border-radius: 9999px;
   box-shadow: none;
   cursor: pointer;
   display: inline-block;
-  font-size: 1.125em;
-  padding: calc(0.667em + 2px) calc(1.333em + 2px);
   text-align: center;
   text-decoration: none;
   word-break: break-word;
@@ -120,6 +112,11 @@
   text-align: right;
 }
 
+:where(.wp-block-button__link) {
+  border-radius: 9999px;
+  padding: calc(0.667em + 2px) calc(1.333em + 2px);
+}
+
 .wp-block-buttons > .wp-block-button.has-custom-width {
   max-width: none;
 }
@@ -394,6 +391,18 @@
   list-style: none;
   padding-left: 2rem;
 }
+.wp-block-comment-template.alignleft {
+  float: left;
+}
+.wp-block-comment-template.aligncenter {
+  margin-left: auto;
+  margin-right: auto;
+  width: -moz-fit-content;
+  width: fit-content;
+}
+.wp-block-comment-template.alignright {
+  float: right;
+}
 
 .wp-block-cover-image,
 .wp-block-cover {
@@ -709,8 +718,7 @@
   height: 100%;
   max-width: none;
   max-height: none;
-  -o-object-fit: cover;
-     object-fit: cover;
+  object-fit: cover;
   outline: none;
   border: none;
   box-shadow: none;
@@ -827,7 +835,6 @@ section.wp-block-cover-image > h2,
 }
 
 .wp-block-embed {
-  margin: 0 0 1em 0;
   overflow-wrap: break-word;
 }
 .wp-block-embed figcaption {
@@ -882,6 +889,9 @@ section.wp-block-cover-image > h2,
 .wp-block-file {
   margin-bottom: 1.5em;
 }
+.wp-block-file:not(.wp-element-button) {
+  font-size: 0.8em;
+}
 .wp-block-file.aligncenter {
   text-align: center;
 }
@@ -889,28 +899,24 @@ section.wp-block-cover-image > h2,
   /*rtl:ignore*/
   text-align: right;
 }
-.wp-block-file .wp-block-file__embed {
+.wp-block-file * + .wp-block-file__button {
+  margin-left: 0.75em;
+}
+
+.wp-block-file__embed {
   margin-bottom: 1em;
 }
-.wp-block-file .wp-block-file__button {
-  background: #32373c;
+
+:where(.wp-block-file__button) {
   border-radius: 2em;
-  color: #fff;
-  font-size: 0.8em;
   padding: 0.5em 1em;
 }
-.wp-block-file a.wp-block-file__button {
-  text-decoration: none;
-}
-.wp-block-file a.wp-block-file__button:hover, .wp-block-file a.wp-block-file__button:visited, .wp-block-file a.wp-block-file__button:focus, .wp-block-file a.wp-block-file__button:active {
+:where(.wp-block-file__button):is(a):hover, :where(.wp-block-file__button):is(a):visited, :where(.wp-block-file__button):is(a):focus, :where(.wp-block-file__button):is(a):active {
   box-shadow: none;
   color: #fff;
   opacity: 0.85;
   text-decoration: none;
 }
-.wp-block-file * + .wp-block-file__button {
-  margin-left: 0.75em;
-}
 
 .wp-block-gallery:not(.has-nested-images),
 .blocks-gallery-grid:not(.has-nested-images) {
@@ -995,8 +1001,7 @@ section.wp-block-cover-image > h2,
   width: 100%;
   height: 100%;
   flex: 1;
-  -o-object-fit: cover;
-     object-fit: cover;
+  object-fit: cover;
 }
 .wp-block-gallery:not(.has-nested-images).columns-1 .blocks-gallery-image, .wp-block-gallery:not(.has-nested-images).columns-1 .blocks-gallery-item,
 .blocks-gallery-grid:not(.has-nested-images).columns-1 .blocks-gallery-image,
@@ -1185,8 +1190,7 @@ figure.wp-block-gallery.has-nested-images {
   width: 100%;
   flex: 1 0 0%;
   height: 100%;
-  -o-object-fit: cover;
-     object-fit: cover;
+  object-fit: cover;
 }
 .wp-block-gallery.has-nested-images.columns-1 figure.wp-block-image:not(#individual-image) {
   width: 100%;
@@ -1242,9 +1246,6 @@ h6.has-background {
   padding: 1.25em 2.375em;
 }
 
-.wp-block-image {
-  margin: 0 0 1em 0;
-}
 .wp-block-image img {
   height: auto;
   max-width: 100%;
@@ -1615,7 +1616,6 @@ ul.has-background {
   display: none;
 }
 .wp-block-navigation .wp-block-navigation-item__content {
-  color: inherit;
   display: block;
   padding: 0;
 }
@@ -2048,6 +2048,15 @@ button.wp-block-navigation-item__content {
   position: relative;
 }
 
+.has-modal-open .admin-bar .wp-block-navigation__responsive-dialog {
+  margin-top: 46px;
+}
+@media (min-width: 782px) {
+  .has-modal-open .admin-bar .wp-block-navigation__responsive-dialog {
+    margin-top: 32px;
+  }
+}
+
 html.has-modal-open {
   overflow: hidden;
 }
@@ -2241,7 +2250,8 @@ p.has-background {
 .wp-block-post-comments input:not([type=submit]):not([type=checkbox]) {
   padding: calc(0.667em + 2px);
 }
-.wp-block-post-comments input[type=submit] {
+
+:where(.wp-block-post-comments input[type="submit"]) {
   border: none;
 }
 
@@ -2408,49 +2418,40 @@ p.has-background {
   color: inherit;
 }
 
-.wp-block-post-template,
-.wp-block-query-loop {
+.wp-block-post-template {
   margin-top: 0;
   margin-bottom: 0;
   max-width: 100%;
   list-style: none;
   padding: 0;
 }
-.wp-block-post-template.wp-block-post-template,
-.wp-block-query-loop.wp-block-post-template {
+.wp-block-post-template.wp-block-post-template {
   background: none;
 }
-.wp-block-post-template.is-flex-container,
-.wp-block-query-loop.is-flex-container {
+.wp-block-post-template.is-flex-container {
   flex-direction: row;
   display: flex;
   flex-wrap: wrap;
   gap: 1.25em;
 }
-.wp-block-post-template.is-flex-container li,
-.wp-block-query-loop.is-flex-container li {
+.wp-block-post-template.is-flex-container li {
   margin: 0;
   width: 100%;
 }
 @media (min-width: 600px) {
-  .wp-block-post-template.is-flex-container.is-flex-container.columns-2 > li,
-.wp-block-query-loop.is-flex-container.is-flex-container.columns-2 > li {
+  .wp-block-post-template.is-flex-container.is-flex-container.columns-2 > li {
     width: calc((100% / 2) - 1.25em + (1.25em / 2));
   }
-  .wp-block-post-template.is-flex-container.is-flex-container.columns-3 > li,
-.wp-block-query-loop.is-flex-container.is-flex-container.columns-3 > li {
+  .wp-block-post-template.is-flex-container.is-flex-container.columns-3 > li {
     width: calc((100% / 3) - 1.25em + (1.25em / 3));
   }
-  .wp-block-post-template.is-flex-container.is-flex-container.columns-4 > li,
-.wp-block-query-loop.is-flex-container.is-flex-container.columns-4 > li {
+  .wp-block-post-template.is-flex-container.is-flex-container.columns-4 > li {
     width: calc((100% / 4) - 1.25em + (1.25em / 4));
   }
-  .wp-block-post-template.is-flex-container.is-flex-container.columns-5 > li,
-.wp-block-query-loop.is-flex-container.is-flex-container.columns-5 > li {
+  .wp-block-post-template.is-flex-container.is-flex-container.columns-5 > li {
     width: calc((100% / 5) - 1.25em + (1.25em / 5));
   }
-  .wp-block-post-template.is-flex-container.is-flex-container.columns-6 > li,
-.wp-block-query-loop.is-flex-container.is-flex-container.columns-6 > li {
+  .wp-block-post-template.is-flex-container.is-flex-container.columns-6 > li {
     width: calc((100% / 6) - 1.25em + (1.25em / 6));
   }
 }
@@ -2568,15 +2569,8 @@ ul.wp-block-rss.is-grid li {
 }
 
 .wp-block-search__button {
-  background: #f7f7f7;
-  border: 1px solid #ccc;
-  padding: 0.375em 0.625em;
-  color: #32373c;
   margin-left: 0.625em;
   word-break: normal;
-  font-size: inherit;
-  font-family: inherit;
-  line-height: inherit;
 }
 .wp-block-search__button.has-icon {
   line-height: 0;
@@ -2587,6 +2581,11 @@ ul.wp-block-rss.is-grid li {
   fill: currentColor;
 }
 
+:where(.wp-block-search__button) {
+  border: 1px solid #ccc;
+  padding: 0.375em 0.625em;
+}
+
 .wp-block-search__inside-wrapper {
   display: flex;
   flex: auto;
@@ -2612,19 +2611,19 @@ ul.wp-block-rss.is-grid li {
   margin-left: 0;
 }
 
-.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper {
+:where(.wp-block-search__button-inside .wp-block-search__inside-wrapper) {
   padding: 4px;
   border: 1px solid #949494;
 }
-.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__input {
+:where(.wp-block-search__button-inside .wp-block-search__inside-wrapper) .wp-block-search__input {
   border-radius: 0;
   border: none;
   padding: 0 0 0 0.25em;
 }
-.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__input:focus {
+:where(.wp-block-search__button-inside .wp-block-search__inside-wrapper) .wp-block-search__input:focus {
   outline: none;
 }
-.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button {
+:where(.wp-block-search__button-inside .wp-block-search__inside-wrapper) :where(.wp-block-search__button) {
   padding: 0.125em 0.5em;
 }
 
@@ -3086,7 +3085,6 @@ ul.wp-block-rss.is-grid li {
 }
 
 .wp-block-table {
-  margin: 0 0 1em 0;
   overflow-x: auto;
 }
 .wp-block-table table {
@@ -3238,16 +3236,12 @@ pre.wp-block-verse {
   white-space: pre-wrap;
 }
 
-.wp-block-video {
-  margin: 0 0 1em 0;
-}
 .wp-block-video video {
   width: 100%;
 }
 @supports (position: sticky) {
   .wp-block-video [poster] {
-    -o-object-fit: cover;
-       object-fit: cover;
+    object-fit: cover;
   }
 }
 .wp-block-video.aligncenter {
@@ -3359,7 +3353,6 @@ pre.wp-block-verse {
 .screen-reader-text {
   border: 0;
   clip: rect(1px, 1px, 1px, 1px);
-  -webkit-clip-path: inset(50%);
   clip-path: inset(50%);
   height: 1px;
   margin: -1px;
@@ -3373,8 +3366,7 @@ pre.wp-block-verse {
 .screen-reader-text:focus {
   background-color: #ddd;
   clip: auto !important;
-  -webkit-clip-path: none;
-          clip-path: none;
+  clip-path: none;
   color: #444;
   display: block;
   font-size: 1em;
@@ -3445,4 +3437,11 @@ html :where([style*="border-left-width"]) {
 html :where(img[class*="wp-image-"]) {
   height: auto;
   max-width: 100%;
+}
+
+/**
+ * Element styles.
+ */
+.wp-element-button {
+  cursor: pointer;
 }

package/build-style/table/style-rtl.css

@@ -75,7 +75,6 @@
  * Reset the WP Admin page styles for Gutenberg-like pages.
  */
 .wp-block-table {
-  margin: 0 0 1em 0;
   overflow-x: auto;
 }
 .wp-block-table table {

package/build-style/table/style.css

@@ -75,7 +75,6 @@
  * Reset the WP Admin page styles for Gutenberg-like pages.
  */
 .wp-block-table {
-  margin: 0 0 1em 0;
   overflow-x: auto;
 }
 .wp-block-table table {