| @@ -57,11 +57,13 @@ | ||
| 57 | 57 | align-items: center; |
| 58 | 58 | justify-content: center; |
| 59 | 59 | } |
| 60 | 60 | |
| 61 | -.wp-block-accordion-panel[inert], .wp-block-accordion-panel[aria-hidden=true] { | |
| 62 | - display: none; | |
| 61 | +.wp-block-accordion-panel[hidden] { | |
| 62 | + border: none !important; | |
| 63 | + box-shadow: none !important; | |
| 63 | 64 | margin-block-start: 0; |
| 65 | + padding: 0 !important; | |
| 64 | 66 | } |
| 65 | 67 | |
| 66 | 68 | .wp-block-archives { |
| 67 | 69 | box-sizing: border-box; |
| @@ -151,8 +153,14 @@ | ||
| 151 | 153 | /** |
| 152 | 154 | * Focus styles. |
| 153 | 155 | */ |
| 154 | 156 | /** |
| 157 | + * Standard focus rings for the WordPress Design System. | |
| 158 | + * | |
| 159 | + * Apply `outset-ring__focus` inside the relevant pseudo-class at the call site, | |
| 160 | + * e.g. `&:focus { @include outset-ring__focus(); }`. | |
| 161 | + */ | |
| 162 | +/** | |
| 155 | 163 | * Applies editor left position to the selector passed as argument |
| 156 | 164 | */ |
| 157 | 165 | /** |
| 158 | 166 | * Styles that are reused verbatim in a few places |
| @@ -212,9 +220,10 @@ | ||
| 212 | 220 | .wp-block-button__link { |
| 213 | 221 | cursor: pointer; |
| 214 | 222 | display: inline-block; |
| 215 | 223 | text-align: center; |
| 216 | - word-break: break-word; | |
| 224 | + word-break: normal; | |
| 225 | + overflow-wrap: anywhere; | |
| 217 | 226 | box-sizing: border-box; |
| 218 | 227 | height: 100%; |
| 219 | 228 | align-content: center; |
| 220 | 229 | } |
| @@ -417,9 +426,10 @@ | ||
| 417 | 426 | } |
| 418 | 427 | .wp-block-categories.wp-block-categories-dropdown.aligncenter { |
| 419 | 428 | text-align: center; |
| 420 | 429 | } |
| 421 | -.wp-block-categories .wp-block-categories__label:not(.screen-reader-text) { | |
| 430 | + | |
| 431 | +:where(.wp-block-categories__label:not(.screen-reader-text)) { | |
| 422 | 432 | width: 100%; |
| 423 | 433 | display: block; |
| 424 | 434 | } |
| 425 | 435 | |
| @@ -491,15 +501,15 @@ | ||
| 491 | 501 | margin-bottom: 1.75em; |
| 492 | 502 | } |
| 493 | 503 | |
| 494 | 504 | :where(.wp-block-columns.has-background) { |
| 495 | - padding: 1.25em 2.375em; | |
| 505 | + padding: var(--wp--style--block-background-padding, 1.25em 2.375em); | |
| 496 | 506 | } |
| 497 | 507 | |
| 498 | 508 | .wp-block-column { |
| 499 | 509 | flex-grow: 1; |
| 500 | 510 | min-width: 0; |
| 501 | - word-break: break-word; | |
| 511 | + word-break: normal; | |
| 502 | 512 | overflow-wrap: break-word; |
| 503 | 513 | /** |
| 504 | 514 | * Individual Column Alignment |
| 505 | 515 | */ |
| @@ -578,9 +588,9 @@ | ||
| 578 | 588 | font-size: 0.875em; |
| 579 | 589 | line-height: 1.5; |
| 580 | 590 | } |
| 581 | 591 | .wp-block-post-comments .comment-meta b { |
| 582 | - font-weight: normal; | |
| 592 | + font-weight: 400; | |
| 583 | 593 | } |
| 584 | 594 | .wp-block-post-comments .comment-meta .comment-awaiting-moderation { |
| 585 | 595 | margin-top: 1em; |
| 586 | 596 | margin-bottom: 1em; |
| @@ -588,15 +598,8 @@ | ||
| 588 | 598 | } |
| 589 | 599 | .wp-block-post-comments .comment-body .commentmetadata { |
| 590 | 600 | font-size: 0.875em; |
| 591 | 601 | } |
| 592 | -.wp-block-post-comments .comment-form-comment label, | |
| 593 | -.wp-block-post-comments .comment-form-author label, | |
| 594 | -.wp-block-post-comments .comment-form-email label, | |
| 595 | -.wp-block-post-comments .comment-form-url label { | |
| 596 | - display: block; | |
| 597 | - margin-bottom: 0.25em; | |
| 598 | -} | |
| 599 | 602 | .wp-block-post-comments .comment-form textarea, |
| 600 | 603 | .wp-block-post-comments .comment-form input:not([type=submit]):not([type=checkbox]) { |
| 601 | 604 | display: block; |
| 602 | 605 | box-sizing: border-box; |
| @@ -630,8 +633,16 @@ | ||
| 630 | 633 | .wp-block-post-comments input:not([type=submit]):not([type=checkbox]) { |
| 631 | 634 | padding: calc(0.667em + 2px); |
| 632 | 635 | } |
| 633 | 636 | |
| 637 | +:where(.wp-block-post-comments .comment-form-comment label), | |
| 638 | +:where(.wp-block-post-comments .comment-form-author label), | |
| 639 | +:where(.wp-block-post-comments .comment-form-email label), | |
| 640 | +:where(.wp-block-post-comments .comment-form-url label) { | |
| 641 | + display: block; | |
| 642 | + margin-bottom: 0.25em; | |
| 643 | +} | |
| 644 | + | |
| 634 | 645 | :where(.wp-block-post-comments input[type=submit]) { |
| 635 | 646 | border: none; |
| 636 | 647 | } |
| 637 | 648 | |
| @@ -683,9 +694,8 @@ | ||
| 683 | 694 | } |
| 684 | 695 | .wp-block-comment-template.aligncenter { |
| 685 | 696 | margin-left: auto; |
| 686 | 697 | margin-right: auto; |
| 687 | - width: -moz-fit-content; | |
| 688 | 698 | width: fit-content; |
| 689 | 699 | } |
| 690 | 700 | .wp-block-comment-template.alignright { |
| 691 | 701 | float: right; |
| @@ -1007,14 +1017,19 @@ | ||
| 1007 | 1017 | width: 100%; |
| 1008 | 1018 | height: 100%; |
| 1009 | 1019 | max-width: none; |
| 1010 | 1020 | max-height: none; |
| 1011 | - -o-object-fit: cover; | |
| 1012 | - object-fit: cover; | |
| 1021 | + object-fit: cover; | |
| 1013 | 1022 | outline: none; |
| 1014 | 1023 | border: none; |
| 1015 | 1024 | box-shadow: none; |
| 1016 | 1025 | } |
| 1026 | +@supports (-webkit-hyphens: none) { | |
| 1027 | + .wp-block-cover-image.has-aspect-ratio, | |
| 1028 | + .wp-block-cover.has-aspect-ratio { | |
| 1029 | + min-height: fit-content !important; | |
| 1030 | + } | |
| 1031 | +} | |
| 1017 | 1032 | .wp-block-cover-image .wp-block-cover__embed-background, |
| 1018 | 1033 | .wp-block-cover .wp-block-cover__embed-background { |
| 1019 | 1034 | position: absolute; |
| 1020 | 1035 | top: 0; |
| @@ -1305,57 +1320,8 @@ | ||
| 1305 | 1320 | opacity: 0.85; |
| 1306 | 1321 | text-decoration: none; |
| 1307 | 1322 | } |
| 1308 | 1323 | |
| 1309 | -.wp-block-form-input__label { | |
| 1310 | - width: 100%; | |
| 1311 | - display: flex; | |
| 1312 | - flex-direction: column; | |
| 1313 | - gap: 0.25em; | |
| 1314 | - margin-bottom: 0.5em; | |
| 1315 | -} | |
| 1316 | -.wp-block-form-input__label.is-label-inline { | |
| 1317 | - flex-direction: row; | |
| 1318 | - gap: 0.5em; | |
| 1319 | - align-items: center; | |
| 1320 | -} | |
| 1321 | -.wp-block-form-input__label.is-label-inline .wp-block-form-input__label-content { | |
| 1322 | - margin-bottom: 0.5em; | |
| 1323 | -} | |
| 1324 | -.wp-block-form-input__label:has(input[type=checkbox]) { | |
| 1325 | - flex-direction: row; | |
| 1326 | - width: -moz-fit-content; | |
| 1327 | - width: fit-content; | |
| 1328 | -} | |
| 1329 | -.wp-block-form-input__label:has(input[type=checkbox]) .wp-block-form-input__label-content { | |
| 1330 | - margin: 0; | |
| 1331 | -} | |
| 1332 | -.wp-block-form-input__label:has(.wp-block-form-input__label-content + input[type=checkbox]) { | |
| 1333 | - /* stylelint-disable-next-line declaration-property-value-allowed-list -- This style is required for old markup. */ | |
| 1334 | - flex-direction: row-reverse; | |
| 1335 | -} | |
| 1336 | - | |
| 1337 | -.wp-block-form-input__label-content { | |
| 1338 | - width: -moz-fit-content; | |
| 1339 | - width: fit-content; | |
| 1340 | -} | |
| 1341 | - | |
| 1342 | -:where(.wp-block-form-input__input) { | |
| 1343 | - padding: 0 0.5em; | |
| 1344 | - font-size: 1em; | |
| 1345 | - margin-bottom: 0.5em; | |
| 1346 | -} | |
| 1347 | -:where(.wp-block-form-input__input)[type=text], :where(.wp-block-form-input__input)[type=password], :where(.wp-block-form-input__input)[type=date], :where(.wp-block-form-input__input)[type=datetime], :where(.wp-block-form-input__input)[type=datetime-local], :where(.wp-block-form-input__input)[type=email], :where(.wp-block-form-input__input)[type=month], :where(.wp-block-form-input__input)[type=number], :where(.wp-block-form-input__input)[type=search], :where(.wp-block-form-input__input)[type=tel], :where(.wp-block-form-input__input)[type=time], :where(.wp-block-form-input__input)[type=url], :where(.wp-block-form-input__input)[type=week] { | |
| 1348 | - min-height: 2em; | |
| 1349 | - line-height: 2; | |
| 1350 | - border-width: 1px; | |
| 1351 | - border-style: solid; | |
| 1352 | -} | |
| 1353 | - | |
| 1354 | -textarea.wp-block-form-input__input { | |
| 1355 | - min-height: 10em; | |
| 1356 | -} | |
| 1357 | - | |
| 1358 | 1324 | .wp-block-gallery:not(.has-nested-images), |
| 1359 | 1325 | .blocks-gallery-grid:not(.has-nested-images) { |
| 1360 | 1326 | display: flex; |
| 1361 | 1327 | flex-wrap: wrap; |
| @@ -1437,10 +1403,9 @@ | ||
| 1437 | 1403 | .blocks-gallery-grid:not(.has-nested-images).is-cropped .blocks-gallery-item img { |
| 1438 | 1404 | width: 100%; |
| 1439 | 1405 | height: 100%; |
| 1440 | 1406 | flex: 1; |
| 1441 | - -o-object-fit: cover; | |
| 1442 | - object-fit: cover; | |
| 1407 | + object-fit: cover; | |
| 1443 | 1408 | } |
| 1444 | 1409 | .wp-block-gallery:not(.has-nested-images).columns-1 .blocks-gallery-image, .wp-block-gallery:not(.has-nested-images).columns-1 .blocks-gallery-item, |
| 1445 | 1410 | .blocks-gallery-grid:not(.has-nested-images).columns-1 .blocks-gallery-image, |
| 1446 | 1411 | .blocks-gallery-grid:not(.has-nested-images).columns-1 .blocks-gallery-item { |
| @@ -1545,37 +1510,104 @@ | ||
| 1545 | 1510 | .wp-block-gallery:not(.is-cropped) .blocks-gallery-item { |
| 1546 | 1511 | align-self: flex-start; |
| 1547 | 1512 | } |
| 1548 | 1513 | |
| 1549 | -figure.wp-block-gallery.has-nested-images { | |
| 1514 | +figure.wp-block-gallery.has-nested-images:where(.is-layout-flex) { | |
| 1550 | 1515 | align-items: normal; |
| 1551 | 1516 | } |
| 1552 | 1517 | |
| 1553 | -.wp-block-gallery.has-nested-images figure.wp-block-image:not(#individual-image) { | |
| 1518 | +.wp-block-gallery.has-nested-images:where(.is-layout-flex) figure.wp-block-image:not(#individual-image) { | |
| 1554 | 1519 | width: calc(50% - var(--wp--style--unstable-gallery-gap, 16px) / 2); |
| 1555 | 1520 | margin: 0; |
| 1556 | 1521 | } |
| 1557 | -.wp-block-gallery.has-nested-images figure.wp-block-image { | |
| 1522 | +.wp-block-gallery.has-nested-images:where(.is-layout-flex) figure.wp-block-image { | |
| 1558 | 1523 | display: flex; |
| 1559 | 1524 | flex-grow: 1; |
| 1560 | 1525 | justify-content: center; |
| 1561 | - position: relative; | |
| 1562 | 1526 | flex-direction: column; |
| 1563 | 1527 | max-width: 100%; |
| 1564 | 1528 | box-sizing: border-box; |
| 1565 | 1529 | } |
| 1566 | -.wp-block-gallery.has-nested-images figure.wp-block-image > div, | |
| 1567 | -.wp-block-gallery.has-nested-images figure.wp-block-image > a { | |
| 1530 | +.wp-block-gallery.has-nested-images:where(.is-layout-flex) figure.wp-block-image > div, | |
| 1531 | +.wp-block-gallery.has-nested-images:where(.is-layout-flex) figure.wp-block-image > a { | |
| 1568 | 1532 | margin: 0; |
| 1569 | 1533 | flex-direction: column; |
| 1570 | 1534 | flex-grow: 1; |
| 1571 | 1535 | } |
| 1572 | -.wp-block-gallery.has-nested-images figure.wp-block-image img { | |
| 1536 | +.wp-block-gallery.has-nested-images:where(.is-layout-flex) figure.wp-block-image img { | |
| 1573 | 1537 | display: block; |
| 1574 | 1538 | height: auto; |
| 1575 | 1539 | max-width: 100% !important; |
| 1576 | 1540 | width: auto; |
| 1577 | 1541 | } |
| 1542 | +.wp-block-gallery.has-nested-images:where(.is-layout-flex) figcaption { | |
| 1543 | + flex-grow: 1; | |
| 1544 | + flex-basis: 100%; | |
| 1545 | + text-align: center; | |
| 1546 | +} | |
| 1547 | +.wp-block-gallery.has-nested-images:where(.is-layout-flex):not(.is-cropped) figure.wp-block-image:not(#individual-image) { | |
| 1548 | + margin-top: 0; | |
| 1549 | + margin-bottom: auto; | |
| 1550 | +} | |
| 1551 | +.wp-block-gallery.has-nested-images:where(.is-layout-flex).is-cropped figure.wp-block-image:not(#individual-image) { | |
| 1552 | + align-self: inherit; | |
| 1553 | +} | |
| 1554 | +.wp-block-gallery.has-nested-images:where(.is-layout-flex).is-cropped figure.wp-block-image:not(#individual-image) > div:not(.components-drop-zone), | |
| 1555 | +.wp-block-gallery.has-nested-images:where(.is-layout-flex).is-cropped figure.wp-block-image:not(#individual-image) > a { | |
| 1556 | + display: flex; | |
| 1557 | +} | |
| 1558 | +.wp-block-gallery.has-nested-images:where(.is-layout-flex).is-cropped figure.wp-block-image:not(#individual-image) a, | |
| 1559 | +.wp-block-gallery.has-nested-images:where(.is-layout-flex).is-cropped figure.wp-block-image:not(#individual-image) img { | |
| 1560 | + width: 100%; | |
| 1561 | + flex: 1 0 0%; | |
| 1562 | + height: 100%; | |
| 1563 | + object-fit: cover; | |
| 1564 | +} | |
| 1565 | +.wp-block-gallery.has-nested-images:where(.is-layout-flex).columns-1 figure.wp-block-image:not(#individual-image) { | |
| 1566 | + width: 100%; | |
| 1567 | +} | |
| 1568 | +@media (min-width: 600px) { | |
| 1569 | + .wp-block-gallery.has-nested-images:where(.is-layout-flex).columns-3 figure.wp-block-image:not(#individual-image) { | |
| 1570 | + width: calc(33.3333333333% - var(--wp--style--unstable-gallery-gap, 16px) * 0.6666666667); | |
| 1571 | + } | |
| 1572 | + .wp-block-gallery.has-nested-images:where(.is-layout-flex).columns-4 figure.wp-block-image:not(#individual-image) { | |
| 1573 | + width: calc(25% - var(--wp--style--unstable-gallery-gap, 16px) * 0.75); | |
| 1574 | + } | |
| 1575 | + .wp-block-gallery.has-nested-images:where(.is-layout-flex).columns-5 figure.wp-block-image:not(#individual-image) { | |
| 1576 | + width: calc(20% - var(--wp--style--unstable-gallery-gap, 16px) * 0.8); | |
| 1577 | + } | |
| 1578 | + .wp-block-gallery.has-nested-images:where(.is-layout-flex).columns-6 figure.wp-block-image:not(#individual-image) { | |
| 1579 | + width: calc(16.6666666667% - var(--wp--style--unstable-gallery-gap, 16px) * 0.8333333333); | |
| 1580 | + } | |
| 1581 | + .wp-block-gallery.has-nested-images:where(.is-layout-flex).columns-7 figure.wp-block-image:not(#individual-image) { | |
| 1582 | + width: calc(14.2857142857% - var(--wp--style--unstable-gallery-gap, 16px) * 0.8571428571); | |
| 1583 | + } | |
| 1584 | + .wp-block-gallery.has-nested-images:where(.is-layout-flex).columns-8 figure.wp-block-image:not(#individual-image) { | |
| 1585 | + width: calc(12.5% - var(--wp--style--unstable-gallery-gap, 16px) * 0.875); | |
| 1586 | + } | |
| 1587 | + .wp-block-gallery.has-nested-images:where(.is-layout-flex).columns-default figure.wp-block-image:not(#individual-image) { | |
| 1588 | + width: calc(33.33% - var(--wp--style--unstable-gallery-gap, 16px) * 0.6666666667); | |
| 1589 | + } | |
| 1590 | + .wp-block-gallery.has-nested-images:where(.is-layout-flex).columns-default figure.wp-block-image:not(#individual-image):first-child:nth-last-child(2), | |
| 1591 | + .wp-block-gallery.has-nested-images:where(.is-layout-flex).columns-default figure.wp-block-image:not(#individual-image):first-child:nth-last-child(2) ~ figure.wp-block-image:not(#individual-image) { | |
| 1592 | + width: calc(50% - var(--wp--style--unstable-gallery-gap, 16px) * 0.5); | |
| 1593 | + } | |
| 1594 | + .wp-block-gallery.has-nested-images:where(.is-layout-flex).columns-default figure.wp-block-image:not(#individual-image):first-child:nth-last-child(1) { | |
| 1595 | + width: 100%; | |
| 1596 | + } | |
| 1597 | +} | |
| 1598 | +.wp-block-gallery.has-nested-images:where(.is-layout-flex).alignleft, .wp-block-gallery.has-nested-images:where(.is-layout-flex).alignright { | |
| 1599 | + max-width: 420px; | |
| 1600 | + width: 100%; | |
| 1601 | +} | |
| 1602 | +.wp-block-gallery.has-nested-images:where(.is-layout-flex).aligncenter { | |
| 1603 | + justify-content: center; | |
| 1604 | +} | |
| 1605 | + | |
| 1606 | +.wp-block-gallery.has-nested-images figure.wp-block-image { | |
| 1607 | + position: relative; | |
| 1608 | + margin: 0; | |
| 1609 | +} | |
| 1578 | 1610 | .wp-block-gallery.has-nested-images figure.wp-block-image:has(figcaption)::before, |
| 1579 | 1611 | .wp-block-gallery.has-nested-images figure.wp-block-image figcaption { |
| 1580 | 1612 | position: absolute; |
| 1581 | 1613 | bottom: 0; |
| @@ -1588,10 +1620,9 @@ | ||
| 1588 | 1620 | height: 100%; |
| 1589 | 1621 | max-height: 3em; |
| 1590 | 1622 | pointer-events: none; |
| 1591 | 1623 | backdrop-filter: blur(3px); |
| 1592 | - -webkit-mask-image: linear-gradient(0deg, #000 20%, transparent 100%); | |
| 1593 | - mask-image: linear-gradient(0deg, #000 20%, transparent 100%); | |
| 1624 | + mask-image: linear-gradient(0deg, #000 20%, transparent 100%); | |
| 1594 | 1625 | } |
| 1595 | 1626 | .wp-block-gallery.has-nested-images figure.wp-block-image figcaption { |
| 1596 | 1627 | color: #fff; |
| 1597 | 1628 | text-shadow: 0 0 1.5px #000; |
| @@ -1662,72 +1693,13 @@ | ||
| 1662 | 1693 | } |
| 1663 | 1694 | .wp-block-gallery.has-nested-images figure.wp-block-image.is-style-rounded::before, .wp-block-gallery.has-nested-images figure.wp-block-image.has-custom-border::before { |
| 1664 | 1695 | content: none; |
| 1665 | 1696 | } |
| 1666 | -.wp-block-gallery.has-nested-images figcaption { | |
| 1667 | - flex-grow: 1; | |
| 1668 | - flex-basis: 100%; | |
| 1697 | + | |
| 1698 | +:where(.wp-block-gallery.has-nested-images.is-layout-grid) > .blocks-gallery-caption { | |
| 1699 | + grid-column: 1/-1; | |
| 1669 | 1700 | text-align: center; |
| 1670 | 1701 | } |
| 1671 | -.wp-block-gallery.has-nested-images:not(.is-cropped) figure.wp-block-image:not(#individual-image) { | |
| 1672 | - margin-top: 0; | |
| 1673 | - margin-bottom: auto; | |
| 1674 | -} | |
| 1675 | -.wp-block-gallery.has-nested-images.is-cropped figure.wp-block-image:not(#individual-image) { | |
| 1676 | - align-self: inherit; | |
| 1677 | -} | |
| 1678 | -.wp-block-gallery.has-nested-images.is-cropped figure.wp-block-image:not(#individual-image) > div:not(.components-drop-zone), | |
| 1679 | -.wp-block-gallery.has-nested-images.is-cropped figure.wp-block-image:not(#individual-image) > a { | |
| 1680 | - display: flex; | |
| 1681 | -} | |
| 1682 | -.wp-block-gallery.has-nested-images.is-cropped figure.wp-block-image:not(#individual-image) a, | |
| 1683 | -.wp-block-gallery.has-nested-images.is-cropped figure.wp-block-image:not(#individual-image) img { | |
| 1684 | - width: 100%; | |
| 1685 | - flex: 1 0 0%; | |
| 1686 | - height: 100%; | |
| 1687 | - -o-object-fit: cover; | |
| 1688 | - object-fit: cover; | |
| 1689 | -} | |
| 1690 | -.wp-block-gallery.has-nested-images.columns-1 figure.wp-block-image:not(#individual-image) { | |
| 1691 | - width: 100%; | |
| 1692 | -} | |
| 1693 | -@media (min-width: 600px) { | |
| 1694 | - .wp-block-gallery.has-nested-images.columns-3 figure.wp-block-image:not(#individual-image) { | |
| 1695 | - width: calc(33.3333333333% - var(--wp--style--unstable-gallery-gap, 16px) * 0.6666666667); | |
| 1696 | - } | |
| 1697 | - .wp-block-gallery.has-nested-images.columns-4 figure.wp-block-image:not(#individual-image) { | |
| 1698 | - width: calc(25% - var(--wp--style--unstable-gallery-gap, 16px) * 0.75); | |
| 1699 | - } | |
| 1700 | - .wp-block-gallery.has-nested-images.columns-5 figure.wp-block-image:not(#individual-image) { | |
| 1701 | - width: calc(20% - var(--wp--style--unstable-gallery-gap, 16px) * 0.8); | |
| 1702 | - } | |
| 1703 | - .wp-block-gallery.has-nested-images.columns-6 figure.wp-block-image:not(#individual-image) { | |
| 1704 | - width: calc(16.6666666667% - var(--wp--style--unstable-gallery-gap, 16px) * 0.8333333333); | |
| 1705 | - } | |
| 1706 | - .wp-block-gallery.has-nested-images.columns-7 figure.wp-block-image:not(#individual-image) { | |
| 1707 | - width: calc(14.2857142857% - var(--wp--style--unstable-gallery-gap, 16px) * 0.8571428571); | |
| 1708 | - } | |
| 1709 | - .wp-block-gallery.has-nested-images.columns-8 figure.wp-block-image:not(#individual-image) { | |
| 1710 | - width: calc(12.5% - var(--wp--style--unstable-gallery-gap, 16px) * 0.875); | |
| 1711 | - } | |
| 1712 | - .wp-block-gallery.has-nested-images.columns-default figure.wp-block-image:not(#individual-image) { | |
| 1713 | - width: calc(33.33% - var(--wp--style--unstable-gallery-gap, 16px) * 0.6666666667); | |
| 1714 | - } | |
| 1715 | - .wp-block-gallery.has-nested-images.columns-default figure.wp-block-image:not(#individual-image):first-child:nth-last-child(2), | |
| 1716 | - .wp-block-gallery.has-nested-images.columns-default figure.wp-block-image:not(#individual-image):first-child:nth-last-child(2) ~ figure.wp-block-image:not(#individual-image) { | |
| 1717 | - width: calc(50% - var(--wp--style--unstable-gallery-gap, 16px) * 0.5); | |
| 1718 | - } | |
| 1719 | - .wp-block-gallery.has-nested-images.columns-default figure.wp-block-image:not(#individual-image):first-child:nth-last-child(1) { | |
| 1720 | - width: 100%; | |
| 1721 | - } | |
| 1722 | -} | |
| 1723 | -.wp-block-gallery.has-nested-images.alignleft, .wp-block-gallery.has-nested-images.alignright { | |
| 1724 | - max-width: 420px; | |
| 1725 | - width: 100%; | |
| 1726 | -} | |
| 1727 | -.wp-block-gallery.has-nested-images.aligncenter { | |
| 1728 | - justify-content: center; | |
| 1729 | -} | |
| 1730 | 1702 | |
| 1731 | 1703 | .wp-block-group { |
| 1732 | 1704 | box-sizing: border-box; |
| 1733 | 1705 | } |
| @@ -1741,9 +1713,9 @@ | ||
| 1741 | 1713 | h3:where(.wp-block-heading).has-background, |
| 1742 | 1714 | h4:where(.wp-block-heading).has-background, |
| 1743 | 1715 | h5:where(.wp-block-heading).has-background, |
| 1744 | 1716 | h6:where(.wp-block-heading).has-background { |
| 1745 | - padding: 1.25em 2.375em; | |
| 1717 | + padding: var(--wp--style--block-background-padding, 1.25em 2.375em); | |
| 1746 | 1718 | } |
| 1747 | 1719 | h1.has-text-align-right[style*=writing-mode]:where([style*=vertical-rl]), h1.has-text-align-left[style*=writing-mode]:where([style*=vertical-lr]), |
| 1748 | 1720 | h2.has-text-align-right[style*=writing-mode]:where([style*=vertical-rl]), |
| 1749 | 1721 | h2.has-text-align-left[style*=writing-mode]:where([style*=vertical-lr]), |
| @@ -1772,17 +1744,30 @@ | ||
| 1772 | 1744 | .wp-block-icon svg { |
| 1773 | 1745 | box-sizing: border-box; |
| 1774 | 1746 | fill: currentColor; |
| 1775 | 1747 | } |
| 1748 | +.wp-block-icon svg.is-flip-horizontal { | |
| 1749 | + transform: scaleX(-1); | |
| 1750 | +} | |
| 1751 | +.wp-block-icon svg.is-flip-vertical { | |
| 1752 | + transform: scaleY(-1); | |
| 1753 | +} | |
| 1754 | +.wp-block-icon svg.is-flip-horizontal.is-flip-vertical { | |
| 1755 | + transform: scaleX(-1) scaleY(-1); | |
| 1756 | +} | |
| 1776 | 1757 | |
| 1777 | 1758 | :where(.wp-block-icon) svg { |
| 1778 | 1759 | width: 100%; |
| 1779 | 1760 | height: 100%; |
| 1780 | 1761 | } |
| 1762 | +:where(.wp-block-icon) svg :where(path, rect, circle, ellipse, line, polygon, polyline) { | |
| 1763 | + vector-effect: none; | |
| 1764 | +} | |
| 1781 | 1765 | |
| 1782 | 1766 | .wp-block-image > a, |
| 1783 | 1767 | .wp-block-image > figure > a { |
| 1784 | 1768 | display: inline-block; |
| 1769 | + color: inherit; | |
| 1785 | 1770 | } |
| 1786 | 1771 | .wp-block-image img { |
| 1787 | 1772 | height: auto; |
| 1788 | 1773 | max-width: 100%; |
| @@ -1857,20 +1842,15 @@ | ||
| 1857 | 1842 | } |
| 1858 | 1843 | .wp-block-image.is-style-circle-mask img { |
| 1859 | 1844 | border-radius: 9999px; |
| 1860 | 1845 | } |
| 1861 | -@supports ((-webkit-mask-image: none) or (mask-image: none)) or (-webkit-mask-image: none) { | |
| 1846 | +@supports (mask-image: none) or (-webkit-mask-image: none) { | |
| 1862 | 1847 | .wp-block-image.is-style-circle-mask img { |
| 1863 | - /* stylelint-disable-next-line function-url-quotes -- We need quotes for the data URL to use the SVG inline. */ | |
| 1864 | - -webkit-mask-image: url('data:image/svg+xml;utf8,<svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg"><circle cx="50" cy="50" r="50"/></svg>'); | |
| 1865 | - mask-image: url('data:image/svg+xml;utf8,<svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg"><circle cx="50" cy="50" r="50"/></svg>'); | |
| 1848 | + mask-image: url('data:image/svg+xml;utf8,<svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg"><circle cx="50" cy="50" r="50"/></svg>'); | |
| 1866 | 1849 | mask-mode: alpha; |
| 1867 | - -webkit-mask-repeat: no-repeat; | |
| 1868 | - mask-repeat: no-repeat; | |
| 1869 | - -webkit-mask-size: contain; | |
| 1870 | - mask-size: contain; | |
| 1871 | - -webkit-mask-position: center; | |
| 1872 | - mask-position: center; | |
| 1850 | + mask-repeat: no-repeat; | |
| 1851 | + mask-size: contain; | |
| 1852 | + mask-position: center; | |
| 1873 | 1853 | border-radius: 0; |
| 1874 | 1854 | } |
| 1875 | 1855 | } |
| 1876 | 1856 | |
| @@ -2250,49 +2230,54 @@ | ||
| 2250 | 2230 | .wp-block-latest-posts.wp-block-latest-posts__list li { |
| 2251 | 2231 | clear: both; |
| 2252 | 2232 | overflow-wrap: break-word; |
| 2253 | 2233 | } |
| 2254 | -.wp-block-latest-posts.is-grid { | |
| 2234 | +.wp-block-latest-posts.is-grid:not(.is-layout-grid) { | |
| 2255 | 2235 | display: flex; |
| 2256 | 2236 | flex-wrap: wrap; |
| 2257 | 2237 | } |
| 2258 | -.wp-block-latest-posts.is-grid li { | |
| 2238 | +.wp-block-latest-posts.is-grid:not(.is-layout-grid) li { | |
| 2259 | 2239 | margin: 0 1.25em 1.25em 0; |
| 2260 | 2240 | width: 100%; |
| 2261 | 2241 | } |
| 2262 | 2242 | @media (min-width: 600px) { |
| 2263 | - .wp-block-latest-posts.columns-2 li { | |
| 2243 | + .wp-block-latest-posts.columns-2:not(.is-layout-grid) li { | |
| 2264 | 2244 | width: calc(100% / 2 - 1.25em + 1.25em / 2); |
| 2265 | 2245 | } |
| 2266 | - .wp-block-latest-posts.columns-2 li:nth-child(2n) { | |
| 2246 | + .wp-block-latest-posts.columns-2:not(.is-layout-grid) li:nth-child(2n) { | |
| 2267 | 2247 | margin-right: 0; |
| 2268 | 2248 | } |
| 2269 | - .wp-block-latest-posts.columns-3 li { | |
| 2249 | + .wp-block-latest-posts.columns-3:not(.is-layout-grid) li { | |
| 2270 | 2250 | width: calc(100% / 3 - 1.25em + 1.25em / 3); |
| 2271 | 2251 | } |
| 2272 | - .wp-block-latest-posts.columns-3 li:nth-child(3n) { | |
| 2252 | + .wp-block-latest-posts.columns-3:not(.is-layout-grid) li:nth-child(3n) { | |
| 2273 | 2253 | margin-right: 0; |
| 2274 | 2254 | } |
| 2275 | - .wp-block-latest-posts.columns-4 li { | |
| 2255 | + .wp-block-latest-posts.columns-4:not(.is-layout-grid) li { | |
| 2276 | 2256 | width: calc(100% / 4 - 1.25em + 1.25em / 4); |
| 2277 | 2257 | } |
| 2278 | - .wp-block-latest-posts.columns-4 li:nth-child(4n) { | |
| 2258 | + .wp-block-latest-posts.columns-4:not(.is-layout-grid) li:nth-child(4n) { | |
| 2279 | 2259 | margin-right: 0; |
| 2280 | 2260 | } |
| 2281 | - .wp-block-latest-posts.columns-5 li { | |
| 2261 | + .wp-block-latest-posts.columns-5:not(.is-layout-grid) li { | |
| 2282 | 2262 | width: calc(100% / 5 - 1.25em + 1.25em / 5); |
| 2283 | 2263 | } |
| 2284 | - .wp-block-latest-posts.columns-5 li:nth-child(5n) { | |
| 2264 | + .wp-block-latest-posts.columns-5:not(.is-layout-grid) li:nth-child(5n) { | |
| 2285 | 2265 | margin-right: 0; |
| 2286 | 2266 | } |
| 2287 | - .wp-block-latest-posts.columns-6 li { | |
| 2267 | + .wp-block-latest-posts.columns-6:not(.is-layout-grid) li { | |
| 2288 | 2268 | width: calc(100% / 6 - 1.25em + 1.25em / 6); |
| 2289 | 2269 | } |
| 2290 | - .wp-block-latest-posts.columns-6 li:nth-child(6n) { | |
| 2270 | + .wp-block-latest-posts.columns-6:not(.is-layout-grid) li:nth-child(6n) { | |
| 2291 | 2271 | margin-right: 0; |
| 2292 | 2272 | } |
| 2293 | 2273 | } |
| 2294 | 2274 | |
| 2275 | +@media (max-width: 600px) { | |
| 2276 | + .wp-block-latest-posts-is-layout-grid[class*=columns-]:not(.has-native-responsive-grid) { | |
| 2277 | + grid-template-columns: 1fr; | |
| 2278 | + } | |
| 2279 | +} | |
| 2295 | 2280 | :root :where(.wp-block-latest-posts.is-grid) { |
| 2296 | 2281 | padding: 0; |
| 2297 | 2282 | } |
| 2298 | 2283 | :root :where(.wp-block-latest-posts.wp-block-latest-posts__list) { |
| @@ -2341,9 +2326,9 @@ | ||
| 2341 | 2326 | box-sizing: border-box; |
| 2342 | 2327 | } |
| 2343 | 2328 | |
| 2344 | 2329 | :root :where(.wp-block-list.has-background) { |
| 2345 | - padding: 1.25em 2.375em; | |
| 2330 | + padding: var(--wp--style--block-background-padding, 1.25em 2.375em); | |
| 2346 | 2331 | } |
| 2347 | 2332 | |
| 2348 | 2333 | .wp-block-loginout { |
| 2349 | 2334 | box-sizing: border-box; |
| @@ -2446,9 +2431,9 @@ | ||
| 2446 | 2431 | height: 1px; |
| 2447 | 2432 | padding: 0; |
| 2448 | 2433 | margin: -1px; |
| 2449 | 2434 | overflow: hidden; |
| 2450 | - clip: rect(0, 0, 0, 0); | |
| 2435 | + clip-path: inset(50%); | |
| 2451 | 2436 | border: 0; |
| 2452 | 2437 | } |
| 2453 | 2438 | |
| 2454 | 2439 | /* Image fill for versions 8 and onwards */ |
| @@ -2466,10 +2451,9 @@ | ||
| 2466 | 2451 | .wp-block-media-text.is-image-fill-element > .wp-block-media-text__media img { |
| 2467 | 2452 | position: absolute; |
| 2468 | 2453 | width: 100%; |
| 2469 | 2454 | height: 100%; |
| 2470 | - -o-object-fit: cover; | |
| 2471 | - object-fit: cover; | |
| 2455 | + object-fit: cover; | |
| 2472 | 2456 | } |
| 2473 | 2457 | |
| 2474 | 2458 | /* |
| 2475 | 2459 | * Here we here not able to use a mobile first CSS approach. |
| @@ -2565,9 +2549,16 @@ | ||
| 2565 | 2549 | .wp-block-navigation.is-vertical { |
| 2566 | 2550 | --navigation-layout-direction: column; |
| 2567 | 2551 | --navigation-layout-justify: initial; |
| 2568 | 2552 | --navigation-layout-align: flex-start; |
| 2553 | + text-align: var(--navigation-layout-text-align, inherit); | |
| 2569 | 2554 | } |
| 2555 | +.wp-block-navigation.is-vertical .wp-block-navigation-item__content { | |
| 2556 | + text-align: inherit; | |
| 2557 | +} | |
| 2558 | +.wp-block-navigation.is-vertical .wp-block-navigation-item:not(.open-always) > .wp-block-navigation__submenu-container { | |
| 2559 | + text-align: initial; | |
| 2560 | +} | |
| 2570 | 2561 | .wp-block-navigation.no-wrap { |
| 2571 | 2562 | --navigation-layout-wrap: nowrap; |
| 2572 | 2563 | } |
| 2573 | 2564 | .wp-block-navigation.items-justified-center { |
| @@ -2572,8 +2563,9 @@ | ||
| 2572 | 2563 | } |
| 2573 | 2564 | .wp-block-navigation.items-justified-center { |
| 2574 | 2565 | --navigation-layout-justification-setting: center; |
| 2575 | 2566 | --navigation-layout-justify: center; |
| 2567 | + --navigation-layout-text-align: center; | |
| 2576 | 2568 | } |
| 2577 | 2569 | .wp-block-navigation.items-justified-center.is-vertical { |
| 2578 | 2570 | --navigation-layout-align: center; |
| 2579 | 2571 | } |
| @@ -2579,8 +2571,9 @@ | ||
| 2579 | 2571 | } |
| 2580 | 2572 | .wp-block-navigation.items-justified-right { |
| 2581 | 2573 | --navigation-layout-justification-setting: flex-end; |
| 2582 | 2574 | --navigation-layout-justify: flex-end; |
| 2575 | + --navigation-layout-text-align: end; | |
| 2583 | 2576 | } |
| 2584 | 2577 | .wp-block-navigation.items-justified-right.is-vertical { |
| 2585 | 2578 | --navigation-layout-align: flex-end; |
| 2586 | 2579 | } |
| @@ -2651,9 +2644,9 @@ | ||
| 2651 | 2644 | transform: rotate(-90deg); |
| 2652 | 2645 | } |
| 2653 | 2646 | } |
| 2654 | 2647 | @media (hover: hover) { |
| 2655 | - .wp-block-navigation .has-child:not(.open-on-click):hover > .wp-block-navigation__submenu-container { | |
| 2648 | + .wp-block-navigation .has-child:not(.open-on-click):not(.open-always):hover > .wp-block-navigation__submenu-container { | |
| 2656 | 2649 | visibility: visible; |
| 2657 | 2650 | overflow: visible; |
| 2658 | 2651 | opacity: 1; |
| 2659 | 2652 | width: auto; |
| @@ -2660,10 +2653,9 @@ | ||
| 2660 | 2653 | height: auto; |
| 2661 | 2654 | min-width: 200px; |
| 2662 | 2655 | } |
| 2663 | 2656 | } |
| 2664 | -.wp-block-navigation .has-child:not(.open-on-click):not(.open-on-hover-click):focus-within > .wp-block-navigation__submenu-container, | |
| 2665 | -.wp-block-navigation .has-child .wp-block-navigation-submenu__toggle[aria-expanded=true] ~ .wp-block-navigation__submenu-container { | |
| 2657 | +.wp-block-navigation .has-child:not(.open-on-click):not(.open-on-hover-click):not(.open-always):focus-within > .wp-block-navigation__submenu-container, .wp-block-navigation .has-child:not(.open-always) .wp-block-navigation-submenu__toggle[aria-expanded=true] ~ .wp-block-navigation__submenu-container { | |
| 2666 | 2658 | visibility: visible; |
| 2667 | 2659 | overflow: visible; |
| 2668 | 2660 | opacity: 1; |
| 2669 | 2661 | width: auto; |
| @@ -2711,8 +2703,9 @@ | ||
| 2711 | 2703 | position: static; |
| 2712 | 2704 | border: none; |
| 2713 | 2705 | background-color: transparent; |
| 2714 | 2706 | color: inherit; |
| 2707 | + box-shadow: none !important; | |
| 2715 | 2708 | } |
| 2716 | 2709 | |
| 2717 | 2710 | .wp-block-navigation.has-background .has-child .wp-block-navigation__submenu-container { |
| 2718 | 2711 | left: 0; |
| @@ -2918,8 +2911,9 @@ | ||
| 2918 | 2911 | display: flex; |
| 2919 | 2912 | flex-direction: column; |
| 2920 | 2913 | flex-wrap: nowrap; |
| 2921 | 2914 | align-items: var(--navigation-layout-justification-setting, inherit); |
| 2915 | + text-align: var(--navigation-layout-text-align, inherit); | |
| 2922 | 2916 | } |
| 2923 | 2917 | .wp-block-navigation__responsive-container.is-menu-open:where(:not(.disable-default-overlay)) .wp-block-navigation__responsive-container-content, |
| 2924 | 2918 | .wp-block-navigation__responsive-container.is-menu-open:where(:not(.disable-default-overlay)) .wp-block-navigation__responsive-container-content .wp-block-page-list, |
| 2925 | 2919 | .wp-block-navigation__responsive-container.is-menu-open:where(:not(.disable-default-overlay)) .wp-block-navigation__responsive-container-content .wp-block-navigation__container { |
| @@ -2945,11 +2939,13 @@ | ||
| 2945 | 2939 | gap: inherit; |
| 2946 | 2940 | } |
| 2947 | 2941 | .wp-block-navigation__responsive-container.is-menu-open:where(:not(.disable-default-overlay)) .wp-block-navigation__responsive-container-content .wp-block-navigation__submenu-container { |
| 2948 | 2942 | padding-top: var(--wp--style--block-gap, 2em); |
| 2943 | + text-align: inherit; | |
| 2949 | 2944 | } |
| 2950 | 2945 | .wp-block-navigation__responsive-container.is-menu-open:where(:not(.disable-default-overlay)) .wp-block-navigation__responsive-container-content .wp-block-navigation-item__content { |
| 2951 | 2946 | padding: 0; |
| 2947 | + text-align: inherit; | |
| 2952 | 2948 | } |
| 2953 | 2949 | .wp-block-navigation__responsive-container.is-menu-open:where(:not(.disable-default-overlay)) .wp-block-navigation__responsive-container-content .wp-block-navigation__container, |
| 2954 | 2950 | .wp-block-navigation__responsive-container.is-menu-open:where(:not(.disable-default-overlay)) .wp-block-navigation__responsive-container-content .wp-block-navigation-item, |
| 2955 | 2951 | .wp-block-navigation__responsive-container.is-menu-open:where(:not(.disable-default-overlay)) .wp-block-navigation__responsive-container-content .wp-block-page-list { |
| @@ -2963,8 +2959,11 @@ | ||
| 2963 | 2959 | .wp-block-navigation__responsive-container.is-menu-open:where(:not(.disable-default-overlay)) .wp-block-page-list { |
| 2964 | 2960 | color: inherit !important; |
| 2965 | 2961 | background: transparent !important; |
| 2966 | 2962 | } |
| 2963 | +.wp-block-navigation__responsive-container.is-menu-open:where(:not(.disable-default-overlay)) .wp-block-navigation-item .wp-block-navigation__submenu-container { | |
| 2964 | + box-shadow: none !important; | |
| 2965 | +} | |
| 2967 | 2966 | .wp-block-navigation__responsive-container.is-menu-open:where(:not(.disable-default-overlay)) .wp-block-navigation__submenu-container.wp-block-navigation__submenu-container.wp-block-navigation__submenu-container.wp-block-navigation__submenu-container { |
| 2968 | 2967 | right: auto; |
| 2969 | 2968 | left: auto; |
| 2970 | 2969 | } |
| @@ -3010,9 +3009,9 @@ | ||
| 3010 | 3009 | } |
| 3011 | 3010 | |
| 3012 | 3011 | .wp-block-navigation__toggle_button_label { |
| 3013 | 3012 | font-size: 1rem; |
| 3014 | - font-weight: bold; | |
| 3013 | + font-weight: 700; | |
| 3015 | 3014 | } |
| 3016 | 3015 | |
| 3017 | 3016 | .wp-block-navigation__responsive-container-open, |
| 3018 | 3017 | .wp-block-navigation__responsive-container-close { |
| @@ -3120,8 +3119,20 @@ | ||
| 3120 | 3119 | margin-left: 8px; |
| 3121 | 3120 | text-transform: uppercase; |
| 3122 | 3121 | } |
| 3123 | 3122 | |
| 3123 | +:where(.wp-block-navigation-overlay-close) { | |
| 3124 | + color: inherit; | |
| 3125 | + font-family: inherit; | |
| 3126 | + font-size: inherit; | |
| 3127 | + font-style: inherit; | |
| 3128 | + font-weight: inherit; | |
| 3129 | + letter-spacing: inherit; | |
| 3130 | + line-height: inherit; | |
| 3131 | + text-transform: inherit; | |
| 3132 | + border: none; | |
| 3133 | +} | |
| 3134 | + | |
| 3124 | 3135 | .wp-block-navigation-overlay-close { |
| 3125 | 3136 | display: inline-flex; |
| 3126 | 3137 | align-items: center; |
| 3127 | 3138 | justify-content: center; |
| @@ -3126,9 +3137,8 @@ | ||
| 3126 | 3137 | align-items: center; |
| 3127 | 3138 | justify-content: center; |
| 3128 | 3139 | gap: 0.5em; |
| 3129 | 3140 | padding: 0; |
| 3130 | - border: none; | |
| 3131 | 3141 | background: transparent; |
| 3132 | 3142 | cursor: pointer; |
| 3133 | 3143 | text-decoration: none; |
| 3134 | 3144 | } |
| @@ -3198,9 +3208,9 @@ | ||
| 3198 | 3208 | overflow: hidden; |
| 3199 | 3209 | } |
| 3200 | 3210 | |
| 3201 | 3211 | :root :where(p.has-background) { |
| 3202 | - padding: 1.25em 2.375em; | |
| 3212 | + padding: var(--wp--style--block-background-padding, 1.25em 2.375em); | |
| 3203 | 3213 | } |
| 3204 | 3214 | |
| 3205 | 3215 | :where(p.has-text-color:not(.has-link-color)) a { |
| 3206 | 3216 | color: inherit; |
| @@ -3213,11 +3223,23 @@ | ||
| 3213 | 3223 | |
| 3214 | 3224 | .waveform-player { |
| 3215 | 3225 | font-family: inherit; |
| 3216 | 3226 | color: inherit; |
| 3217 | - line-height: 1.4; | |
| 3227 | + line-height: var(--waveform-line-height, 1.4); | |
| 3228 | + --wfp-accent: #71717a; | |
| 3229 | + --wfp-button-color: rgba(255, 255, 255, .9); | |
| 3230 | + --wfp-text-color: #ffffff; | |
| 3231 | + --wfp-text-secondary-color: rgba(255, 255, 255, .6); | |
| 3232 | + --wfp-btn-artwork-color: rgba(255, 255, 255, .9); | |
| 3233 | + --wfp-btn-artwork-scrim: rgba(0, 0, 0, .5); | |
| 3218 | 3234 | } |
| 3219 | 3235 | |
| 3236 | +.waveform-player.waveform-theme-light { | |
| 3237 | + --wfp-button-color: rgba(0, 0, 0, .8); | |
| 3238 | + --wfp-text-color: #333333; | |
| 3239 | + --wfp-text-secondary-color: rgba(0, 0, 0, .6); | |
| 3240 | +} | |
| 3241 | + | |
| 3220 | 3242 | .waveform-player * { |
| 3221 | 3243 | box-sizing: border-box; |
| 3222 | 3244 | } |
| 3223 | 3245 | |
| @@ -3223,26 +3245,26 @@ | ||
| 3223 | 3245 | |
| 3224 | 3246 | .waveform-body { |
| 3225 | 3247 | display: flex; |
| 3226 | 3248 | flex-direction: column; |
| 3227 | - gap: 8px; | |
| 3249 | + gap: var(--waveform-body-gap, 8px); | |
| 3228 | 3250 | } |
| 3229 | 3251 | |
| 3230 | 3252 | .waveform-track { |
| 3231 | 3253 | display: flex; |
| 3232 | 3254 | align-items: center; |
| 3233 | - gap: 12px; | |
| 3255 | + gap: var(--waveform-track-gap, 12px); | |
| 3234 | 3256 | position: relative; |
| 3235 | 3257 | } |
| 3236 | 3258 | |
| 3237 | 3259 | .waveform-btn { |
| 3238 | - width: 36px; | |
| 3239 | - height: 36px; | |
| 3240 | - min-width: 36px; | |
| 3241 | - border-radius: 50%; | |
| 3260 | + width: var(--wfp-btn-size, 36px); | |
| 3261 | + height: var(--wfp-btn-size, 36px); | |
| 3262 | + min-width: var(--wfp-btn-size, 36px); | |
| 3263 | + border-radius: var(--wfp-btn-radius, 50%); | |
| 3242 | 3264 | border: 2px solid currentColor; |
| 3243 | 3265 | background: transparent; |
| 3244 | - color: inherit; | |
| 3266 | + color: var(--wfp-button-color, inherit); | |
| 3245 | 3267 | cursor: pointer; |
| 3246 | 3268 | display: flex; |
| 3247 | 3269 | align-items: center; |
| 3248 | 3270 | justify-content: center; |
| @@ -3256,8 +3278,27 @@ | ||
| 3256 | 3278 | opacity: 1; |
| 3257 | 3279 | transform: scale(1.05); |
| 3258 | 3280 | } |
| 3259 | 3281 | |
| 3282 | +.waveform-btn-minimal { | |
| 3283 | + width: calc(var(--wfp-btn-size, 36px) * 1.1); | |
| 3284 | + height: calc(var(--wfp-btn-size, 36px) * 1.1); | |
| 3285 | + min-width: calc(var(--wfp-btn-size, 36px) * 1.1); | |
| 3286 | + border: none; | |
| 3287 | + border-radius: 0; | |
| 3288 | + opacity: 0.7; | |
| 3289 | +} | |
| 3290 | + | |
| 3291 | +.waveform-btn-minimal:hover:not(:disabled) { | |
| 3292 | + opacity: 1; | |
| 3293 | + transform: none; | |
| 3294 | +} | |
| 3295 | + | |
| 3296 | +.waveform-btn.waveform-btn-minimal svg { | |
| 3297 | + width: calc(var(--wfp-btn-size, 36px) * 0.94); | |
| 3298 | + height: calc(var(--wfp-btn-size, 36px) * 0.94); | |
| 3299 | +} | |
| 3300 | + | |
| 3260 | 3301 | .waveform-btn:disabled { |
| 3261 | 3302 | cursor: not-allowed; |
| 3262 | 3303 | opacity: 0.3; |
| 3263 | 3304 | } |
| @@ -3270,14 +3311,48 @@ | ||
| 3270 | 3311 | height: 100%; |
| 3271 | 3312 | } |
| 3272 | 3313 | |
| 3273 | 3314 | .waveform-btn svg { |
| 3274 | - width: 16px; | |
| 3275 | - height: 16px; | |
| 3315 | + width: calc(var(--wfp-btn-size, 36px) * 0.45); | |
| 3316 | + height: calc(var(--wfp-btn-size, 36px) * 0.45); | |
| 3276 | 3317 | fill: currentColor; |
| 3277 | 3318 | display: block; |
| 3278 | 3319 | } |
| 3279 | 3320 | |
| 3321 | +.waveform-btn-has-artwork { | |
| 3322 | + --wfp-btn-size: 64px; | |
| 3323 | + --wfp-btn-radius: 8px; | |
| 3324 | + position: relative; | |
| 3325 | + overflow: hidden; | |
| 3326 | + border: none; | |
| 3327 | + color: var(--wfp-btn-artwork-color); | |
| 3328 | +} | |
| 3329 | + | |
| 3330 | +.waveform-btn > .waveform-btn-artwork { | |
| 3331 | + display: block; | |
| 3332 | + position: absolute; | |
| 3333 | + inset: 0; | |
| 3334 | + width: 100%; | |
| 3335 | + height: 100%; | |
| 3336 | + object-fit: cover; | |
| 3337 | + pointer-events: none; | |
| 3338 | + z-index: 0; | |
| 3339 | +} | |
| 3340 | + | |
| 3341 | +.waveform-btn-has-artwork:after { | |
| 3342 | + content: ""; | |
| 3343 | + position: absolute; | |
| 3344 | + inset: 0; | |
| 3345 | + background: var(--wfp-btn-artwork-scrim); | |
| 3346 | + pointer-events: none; | |
| 3347 | + z-index: 1; | |
| 3348 | +} | |
| 3349 | + | |
| 3350 | +.waveform-btn-has-artwork > :not(.waveform-btn-artwork) { | |
| 3351 | + position: relative; | |
| 3352 | + z-index: 2; | |
| 3353 | +} | |
| 3354 | + | |
| 3280 | 3355 | .waveform-icon-play svg { |
| 3281 | 3356 | margin-left: 1px; |
| 3282 | 3357 | } |
| 3283 | 3358 | |
| @@ -3289,8 +3364,12 @@ | ||
| 3289 | 3364 | min-width: 0; |
| 3290 | 3365 | width: 100%; |
| 3291 | 3366 | } |
| 3292 | 3367 | |
| 3368 | +.waveform-container:focus-visible { | |
| 3369 | + outline: 2px solid currentColor; | |
| 3370 | +} | |
| 3371 | + | |
| 3293 | 3372 | .waveform-container canvas { |
| 3294 | 3373 | display: block; |
| 3295 | 3374 | width: 100%; |
| 3296 | 3375 | height: 100%; |
| @@ -3316,8 +3395,9 @@ | ||
| 3316 | 3395 | min-width: 0; |
| 3317 | 3396 | } |
| 3318 | 3397 | |
| 3319 | 3398 | .waveform-title { |
| 3399 | + color: var(--wfp-text-color); | |
| 3320 | 3400 | white-space: nowrap; |
| 3321 | 3401 | overflow: hidden; |
| 3322 | 3402 | text-overflow: ellipsis; |
| 3323 | 3403 | font-weight: 500; |
| @@ -3322,9 +3402,10 @@ | ||
| 3322 | 3402 | text-overflow: ellipsis; |
| 3323 | 3403 | font-weight: 500; |
| 3324 | 3404 | } |
| 3325 | 3405 | |
| 3326 | -.waveform-subtitle { | |
| 3406 | +.waveform-artist { | |
| 3407 | + color: var(--wfp-text-secondary-color); | |
| 3327 | 3408 | font-size: 11px; |
| 3328 | 3409 | white-space: nowrap; |
| 3329 | 3410 | overflow: hidden; |
| 3330 | 3411 | text-overflow: ellipsis; |
| @@ -3330,8 +3411,9 @@ | ||
| 3330 | 3411 | text-overflow: ellipsis; |
| 3331 | 3412 | } |
| 3332 | 3413 | |
| 3333 | 3414 | .waveform-time { |
| 3415 | + color: var(--wfp-text-secondary-color); | |
| 3334 | 3416 | font-size: 11px; |
| 3335 | 3417 | white-space: nowrap; |
| 3336 | 3418 | flex-shrink: 0; |
| 3337 | 3419 | } |
| @@ -3336,8 +3418,9 @@ | ||
| 3336 | 3418 | flex-shrink: 0; |
| 3337 | 3419 | } |
| 3338 | 3420 | |
| 3339 | 3421 | .waveform-bpm { |
| 3422 | + color: var(--wfp-text-secondary-color); | |
| 3340 | 3423 | font-size: 11px; |
| 3341 | 3424 | white-space: nowrap; |
| 3342 | 3425 | flex-shrink: 0; |
| 3343 | 3426 | display: inline-flex; |
| @@ -3393,8 +3476,14 @@ | ||
| 3393 | 3476 | width: 4px; |
| 3394 | 3477 | z-index: 20; |
| 3395 | 3478 | } |
| 3396 | 3479 | |
| 3480 | +.waveform-marker.active { | |
| 3481 | + width: 4px; | |
| 3482 | + background: currentColor; | |
| 3483 | + z-index: 10; | |
| 3484 | +} | |
| 3485 | + | |
| 3397 | 3486 | .waveform-marker-tooltip { |
| 3398 | 3487 | position: absolute; |
| 3399 | 3488 | bottom: calc(100% + 4px); |
| 3400 | 3489 | left: 50%; |
| @@ -3410,12 +3499,54 @@ | ||
| 3410 | 3499 | transition: opacity 0.2s; |
| 3411 | 3500 | z-index: 1000; |
| 3412 | 3501 | } |
| 3413 | 3502 | |
| 3414 | -.waveform-marker:hover .waveform-marker-tooltip { | |
| 3503 | +.waveform-marker:hover .waveform-marker-tooltip, .waveform-marker.show-label .waveform-marker-tooltip { | |
| 3415 | 3504 | opacity: 1; |
| 3416 | 3505 | } |
| 3417 | 3506 | |
| 3507 | +.waveform-hover-time { | |
| 3508 | + position: absolute; | |
| 3509 | + bottom: calc(100% + 4px); | |
| 3510 | + transform: translate(-50%); | |
| 3511 | + background: rgba(0, 0, 0, 0.9019607843); | |
| 3512 | + color: #fff; | |
| 3513 | + padding: 3px 7px; | |
| 3514 | + border-radius: 4px; | |
| 3515 | + font-size: 11px; | |
| 3516 | + font-variant-numeric: tabular-nums; | |
| 3517 | + white-space: nowrap; | |
| 3518 | + pointer-events: none; | |
| 3519 | + opacity: 0; | |
| 3520 | + transition: opacity 0.15s; | |
| 3521 | + z-index: 1000; | |
| 3522 | +} | |
| 3523 | + | |
| 3524 | +.waveform-seek-handle { | |
| 3525 | + position: absolute; | |
| 3526 | + top: 50%; | |
| 3527 | + left: 0; | |
| 3528 | + width: 11px; | |
| 3529 | + height: 11px; | |
| 3530 | + border-radius: 50%; | |
| 3531 | + background: #fff; | |
| 3532 | + box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3490196078); | |
| 3533 | + transform: translate(-50%, -50%) scale(0); | |
| 3534 | + opacity: 0; | |
| 3535 | + transition: opacity 0.12s ease, transform 0.12s ease; | |
| 3536 | + pointer-events: none; | |
| 3537 | + z-index: 6; | |
| 3538 | +} | |
| 3539 | + | |
| 3540 | +.waveform-seek-handle.is-visible { | |
| 3541 | + opacity: 1; | |
| 3542 | + transform: translate(-50%, -50%) scale(1); | |
| 3543 | +} | |
| 3544 | + | |
| 3545 | +.waveform-seek-handle.is-active { | |
| 3546 | + transform: translate(-50%, -50%) scale(1.25); | |
| 3547 | +} | |
| 3548 | + | |
| 3418 | 3549 | .waveform-btn:focus-visible { |
| 3419 | 3550 | outline: 2px solid currentColor; |
| 3420 | 3551 | outline-offset: 2px; |
| 3421 | 3552 | } |
| @@ -3484,15 +3615,15 @@ | ||
| 3484 | 3615 | color: #fff; |
| 3485 | 3616 | } |
| 3486 | 3617 | |
| 3487 | 3618 | .speed-option.active { |
| 3488 | - background: rgba(168, 85, 247, 0.2); | |
| 3489 | - color: #a855f7; | |
| 3619 | + background: rgba(255, 255, 255, 0.1607843137); | |
| 3620 | + color: #fff; | |
| 3490 | 3621 | font-weight: 600; |
| 3491 | 3622 | } |
| 3492 | 3623 | |
| 3493 | 3624 | .waveform-player.waveform-focused { |
| 3494 | - outline: 2px solid rgba(168, 85, 247, 0.5); | |
| 3625 | + outline: 2px solid var(--wfp-accent); | |
| 3495 | 3626 | outline-offset: 2px; |
| 3496 | 3627 | border-radius: 4px; |
| 3497 | 3628 | } |
| 3498 | 3629 | |
| @@ -3500,12 +3631,26 @@ | ||
| 3500 | 3631 | outline: none; |
| 3501 | 3632 | } |
| 3502 | 3633 | |
| 3503 | 3634 | .waveform-player:focus-visible { |
| 3504 | - outline: 1px solid rgba(168, 85, 247, 0.3); | |
| 3635 | + outline: 1px solid var(--wfp-accent); | |
| 3505 | 3636 | outline-offset: 1px; |
| 3506 | 3637 | } |
| 3507 | 3638 | |
| 3639 | +.waveform-layout-preview .waveform-meta { | |
| 3640 | + display: none !important; | |
| 3641 | +} | |
| 3642 | + | |
| 3643 | +.waveform-layout-preview .waveform-info { | |
| 3644 | + justify-content: center; | |
| 3645 | +} | |
| 3646 | + | |
| 3647 | +.waveform-layout-preview .waveform-text { | |
| 3648 | + flex: 0 1 auto; | |
| 3649 | + align-items: center; | |
| 3650 | + text-align: center; | |
| 3651 | +} | |
| 3652 | + | |
| 3508 | 3653 | .waveform-player.waveform-focused { |
| 3509 | 3654 | outline: none; |
| 3510 | 3655 | } |
| 3511 | 3656 | |
| @@ -3530,11 +3675,11 @@ | ||
| 3530 | 3675 | } |
| 3531 | 3676 | |
| 3532 | 3677 | @media (max-width: 480px) { |
| 3533 | 3678 | .waveform-btn { |
| 3534 | - width: 32px; | |
| 3535 | - height: 32px; | |
| 3536 | - min-width: 32px; | |
| 3679 | + width: var(--wfp-btn-size, 32px); | |
| 3680 | + height: var(--wfp-btn-size, 32px); | |
| 3681 | + min-width: var(--wfp-btn-size, 32px); | |
| 3537 | 3682 | } |
| 3538 | 3683 | .waveform-container { |
| 3539 | 3684 | min-height: 50px; |
| 3540 | 3685 | } |
| @@ -3540,15 +3685,21 @@ | ||
| 3540 | 3685 | } |
| 3541 | 3686 | .waveform-info { |
| 3542 | 3687 | font-size: 12px; |
| 3543 | 3688 | } |
| 3544 | - .waveform-subtitle, .waveform-time, .waveform-bpm { | |
| 3689 | + .waveform-artist, .waveform-time, .waveform-bpm { | |
| 3545 | 3690 | font-size: 10px; |
| 3546 | 3691 | } |
| 3547 | 3692 | } |
| 3693 | +@media (prefers-reduced-motion: reduce) { | |
| 3694 | + .waveform-player *, .waveform-player *:before, .waveform-player *:after { | |
| 3695 | + transition-duration: 0.01ms !important; | |
| 3696 | + animation-duration: 0.01ms !important; | |
| 3697 | + animation-iteration-count: 1 !important; | |
| 3698 | + } | |
| 3699 | +} | |
| 3548 | 3700 | .wp-block-playlist { |
| 3549 | - overflow: hidden; | |
| 3550 | - overflow: clip; | |
| 3701 | + box-sizing: border-box; | |
| 3551 | 3702 | } |
| 3552 | 3703 | .wp-block-playlist .wp-block-playlist__waveform-player { |
| 3553 | 3704 | width: 100%; |
| 3554 | 3705 | margin: var(--wp--preset--spacing--20, 0.625em) 0; |
| @@ -3553,13 +3704,18 @@ | ||
| 3553 | 3704 | width: 100%; |
| 3554 | 3705 | margin: var(--wp--preset--spacing--20, 0.625em) 0; |
| 3555 | 3706 | position: relative; |
| 3556 | 3707 | } |
| 3708 | +.wp-block-playlist .wp-block-playlist__waveform-player:focus-visible { | |
| 3709 | + outline: revert; | |
| 3710 | + outline-offset: revert; | |
| 3711 | +} | |
| 3557 | 3712 | .wp-block-playlist .waveform-track { |
| 3558 | 3713 | height: 100px; |
| 3559 | 3714 | gap: 0; |
| 3560 | 3715 | } |
| 3561 | 3716 | .wp-block-playlist .waveform-btn { |
| 3717 | + border: none; | |
| 3562 | 3718 | border-radius: 0; |
| 3563 | 3719 | border-end-start-radius: 0.125rem; |
| 3564 | 3720 | border-start-start-radius: 0.125rem; |
| 3565 | 3721 | width: 100px; |
| @@ -3570,14 +3726,45 @@ | ||
| 3570 | 3726 | } |
| 3571 | 3727 | .wp-block-playlist .waveform-btn:hover:not(:disabled) { |
| 3572 | 3728 | transform: none; |
| 3573 | 3729 | } |
| 3730 | +.wp-block-playlist .waveform-btn svg { | |
| 3731 | + width: 3rem; | |
| 3732 | + height: 3rem; | |
| 3733 | +} | |
| 3734 | +.wp-block-playlist .waveform-btn .waveform-icon-pause svg { | |
| 3735 | + width: 2.625rem; | |
| 3736 | + height: 2.625rem; | |
| 3737 | +} | |
| 3738 | +.wp-block-playlist .waveform-player.has-play-button-artwork .waveform-btn { | |
| 3739 | + background-image: var(--wp--playlist--play-button-artwork); | |
| 3740 | + background-position: center; | |
| 3741 | + background-size: cover; | |
| 3742 | + color: #fff; | |
| 3743 | +} | |
| 3744 | +.wp-block-playlist .waveform-player.has-play-button-artwork .waveform-btn svg { | |
| 3745 | + filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.45)); | |
| 3746 | +} | |
| 3747 | +.wp-block-playlist .waveform-player.has-play-button-artwork .waveform-btn svg path { | |
| 3748 | + fill: #fff !important; | |
| 3749 | +} | |
| 3574 | 3750 | .wp-block-playlist .waveform-track.waveform-align-bottom .waveform-btn { |
| 3575 | 3751 | margin-bottom: 0; |
| 3576 | 3752 | } |
| 3577 | -.wp-block-playlist .waveform-subtitle { | |
| 3753 | +.wp-block-playlist .waveform-btn:focus-visible, | |
| 3754 | +.wp-block-playlist .waveform-container:focus-visible { | |
| 3755 | + outline: revert; | |
| 3756 | + outline-offset: revert; | |
| 3757 | +} | |
| 3758 | +.wp-block-playlist .waveform-artist { | |
| 3578 | 3759 | opacity: 0.7; |
| 3579 | 3760 | } |
| 3761 | +.wp-block-playlist .waveform-info, | |
| 3762 | +.wp-block-playlist .waveform-artist, | |
| 3763 | +.wp-block-playlist .waveform-title, | |
| 3764 | +.wp-block-playlist .waveform-time { | |
| 3765 | + font-size: inherit; | |
| 3766 | +} | |
| 3580 | 3767 | .wp-block-playlist .wp-block-playlist__tracklist { |
| 3581 | 3768 | margin: 0; |
| 3582 | 3769 | padding-left: 0; |
| 3583 | 3770 | list-style: none; |
| @@ -3624,8 +3811,17 @@ | ||
| 3624 | 3811 | margin-right: var(--wp--preset--spacing--20, 0.5em); |
| 3625 | 3812 | font-size: 0.85em; |
| 3626 | 3813 | opacity: 0.7; |
| 3627 | 3814 | } |
| 3815 | +.wp-block-playlist-track .wp-block-playlist-track__button .wp-block-playlist-track__image { | |
| 3816 | + flex: 0 0 50px; | |
| 3817 | + width: 50px; | |
| 3818 | + height: 50px; | |
| 3819 | + margin-right: var(--wp--preset--spacing--20, 0.5em); | |
| 3820 | + border: 1px solid rgba(0, 0, 0, 0.08); | |
| 3821 | + box-sizing: border-box; | |
| 3822 | + object-fit: cover; | |
| 3823 | +} | |
| 3628 | 3824 | .wp-block-playlist-track .wp-block-playlist-track__button .wp-block-playlist-track__content { |
| 3629 | 3825 | flex: 1 1 0; |
| 3630 | 3826 | min-width: 0; |
| 3631 | 3827 | } |
| @@ -3672,8 +3868,9 @@ | ||
| 3672 | 3868 | |
| 3673 | 3869 | .wp-block-post-author-biography { |
| 3674 | 3870 | box-sizing: border-box; |
| 3675 | 3871 | white-space: pre-wrap; |
| 3872 | + overflow-wrap: break-word; | |
| 3676 | 3873 | } |
| 3677 | 3874 | |
| 3678 | 3875 | :where(.wp-block-post-comments-form textarea), |
| 3679 | 3876 | :where(.wp-block-post-comments-form input:not([type=submit])) { |
| @@ -3722,14 +3919,8 @@ | ||
| 3722 | 3919 | display: block; |
| 3723 | 3920 | box-sizing: border-box; |
| 3724 | 3921 | width: 100%; |
| 3725 | 3922 | } |
| 3726 | -.wp-block-post-comments-form .comment-form-author label, | |
| 3727 | -.wp-block-post-comments-form .comment-form-email label, | |
| 3728 | -.wp-block-post-comments-form .comment-form-url label { | |
| 3729 | - display: block; | |
| 3730 | - margin-bottom: 0.25em; | |
| 3731 | -} | |
| 3732 | 3923 | .wp-block-post-comments-form .comment-form-cookies-consent { |
| 3733 | 3924 | display: flex; |
| 3734 | 3925 | gap: 0.25em; |
| 3735 | 3926 | } |
| @@ -3743,8 +3934,15 @@ | ||
| 3743 | 3934 | font-size: var(--wp--preset--font-size--medium, smaller); |
| 3744 | 3935 | margin-left: 0.5em; |
| 3745 | 3936 | } |
| 3746 | 3937 | |
| 3938 | +:where(.wp-block-post-comments-form .comment-form-author label), | |
| 3939 | +:where(.wp-block-post-comments-form .comment-form-email label), | |
| 3940 | +:where(.wp-block-post-comments-form .comment-form-url label) { | |
| 3941 | + display: block; | |
| 3942 | + margin-bottom: 0.25em; | |
| 3943 | +} | |
| 3944 | + | |
| 3747 | 3945 | .wp-block-post-comments-count { |
| 3748 | 3946 | box-sizing: border-box; |
| 3749 | 3947 | } |
| 3750 | 3948 | |
| @@ -3846,8 +4044,11 @@ | ||
| 3846 | 4044 | .wp-block-post-featured-image:where(.alignleft, .alignright) { |
| 3847 | 4045 | width: 100%; |
| 3848 | 4046 | } |
| 3849 | 4047 | |
| 4048 | +.wp-block-post-navigation-link { | |
| 4049 | + box-sizing: border-box; | |
| 4050 | +} | |
| 3850 | 4051 | .wp-block-post-navigation-link .wp-block-post-navigation-link__arrow-previous { |
| 3851 | 4052 | display: inline-block; |
| 3852 | 4053 | margin-right: 1ch; |
| 3853 | 4054 | } |
| @@ -3876,13 +4077,13 @@ | ||
| 3876 | 4077 | box-sizing: border-box; |
| 3877 | 4078 | } |
| 3878 | 4079 | |
| 3879 | 4080 | .wp-block-post-title { |
| 3880 | - word-break: break-word; | |
| 4081 | + word-break: normal; | |
| 4082 | + overflow-wrap: anywhere; | |
| 3881 | 4083 | box-sizing: border-box; |
| 3882 | 4084 | } |
| 3883 | 4085 | .wp-block-post-title :where(a) { |
| 3884 | - display: inline-block; | |
| 3885 | 4086 | font-family: inherit; |
| 3886 | 4087 | font-size: inherit; |
| 3887 | 4088 | font-style: inherit; |
| 3888 | 4089 | font-weight: inherit; |
| @@ -3900,9 +4101,9 @@ | ||
| 3900 | 4101 | white-space: pre-wrap; |
| 3901 | 4102 | } |
| 3902 | 4103 | |
| 3903 | 4104 | :where(.wp-block-preformatted.has-background) { |
| 3904 | - padding: 1.25em 2.375em; | |
| 4105 | + padding: var(--wp--style--block-background-padding, 1.25em 2.375em); | |
| 3905 | 4106 | } |
| 3906 | 4107 | |
| 3907 | 4108 | .wp-block-pullquote { |
| 3908 | 4109 | text-align: center; |
| @@ -4030,8 +4231,12 @@ | ||
| 4030 | 4231 | margin-inline-start: auto; |
| 4031 | 4232 | margin-inline-end: auto; |
| 4032 | 4233 | } |
| 4033 | 4234 | |
| 4235 | +:where(.wp-block-query-no-results) { | |
| 4236 | + box-sizing: border-box; | |
| 4237 | +} | |
| 4238 | + | |
| 4034 | 4239 | .wp-block-query-pagination.is-content-justification-space-between > .wp-block-query-pagination-next:last-of-type { |
| 4035 | 4240 | margin-inline-start: auto; |
| 4036 | 4241 | } |
| 4037 | 4242 | .wp-block-query-pagination.is-content-justification-space-between > .wp-block-query-pagination-previous:first-child { |
| @@ -4087,9 +4292,8 @@ | ||
| 4087 | 4292 | } |
| 4088 | 4293 | |
| 4089 | 4294 | .wp-block-read-more { |
| 4090 | 4295 | display: block; |
| 4091 | - width: -moz-fit-content; | |
| 4092 | 4296 | width: fit-content; |
| 4093 | 4297 | } |
| 4094 | 4298 | .wp-block-read-more:where(:not([style*=text-decoration])) { |
| 4095 | 4299 | text-decoration: none; |
| @@ -4172,9 +4376,9 @@ | ||
| 4172 | 4376 | flex-wrap: nowrap; |
| 4173 | 4377 | max-width: 100%; |
| 4174 | 4378 | } |
| 4175 | 4379 | |
| 4176 | -.wp-block-search__label { | |
| 4380 | +:where(.wp-block-search__label) { | |
| 4177 | 4381 | width: 100%; |
| 4178 | 4382 | } |
| 4179 | 4383 | |
| 4180 | 4384 | .wp-block-search.wp-block-search__button-only .wp-block-search__button { |
| @@ -4225,11 +4429,9 @@ | ||
| 4225 | 4429 | margin-right: 0; |
| 4226 | 4430 | min-width: 3rem; |
| 4227 | 4431 | border: 1px solid #949494; |
| 4228 | 4432 | text-decoration: unset !important; |
| 4229 | - -webkit-appearance: initial; | |
| 4230 | - -moz-appearance: initial; | |
| 4231 | - appearance: initial; | |
| 4433 | + appearance: initial; | |
| 4232 | 4434 | } |
| 4233 | 4435 | |
| 4234 | 4436 | :where(.wp-block-search__button-inside .wp-block-search__inside-wrapper) { |
| 4235 | 4437 | padding: 4px; |
| @@ -4794,13 +4996,12 @@ | ||
| 4794 | 4996 | padding: 1ch 2ch; |
| 4795 | 4997 | text-decoration: none !important; |
| 4796 | 4998 | } |
| 4797 | 4999 | |
| 4798 | -.wp-block-tab { | |
| 5000 | +:where(.wp-block-tab-list button) { | |
| 4799 | 5001 | box-sizing: border-box; |
| 4800 | 5002 | color: inherit; |
| 4801 | 5003 | display: block; |
| 4802 | - width: -moz-max-content; | |
| 4803 | 5004 | width: max-content; |
| 4804 | 5005 | text-decoration: none; |
| 4805 | 5006 | cursor: pointer; |
| 4806 | 5007 | flex-basis: inherit !important; |
| @@ -4807,10 +5008,9 @@ | ||
| 4807 | 5008 | flex-grow: inherit !important; |
| 4808 | 5009 | position: relative; |
| 4809 | 5010 | border: none; |
| 4810 | 5011 | background: none; |
| 4811 | - -moz-appearance: none; | |
| 4812 | - appearance: none; | |
| 5012 | + appearance: none; | |
| 4813 | 5013 | -webkit-appearance: none; |
| 4814 | 5014 | margin: 0; |
| 4815 | 5015 | padding: var(--wp--preset--spacing--20, 0.5em) var(--wp--preset--spacing--30, 1em); |
| 4816 | 5016 | font-size: inherit; |
| @@ -4820,9 +5020,9 @@ | ||
| 4820 | 5020 | letter-spacing: inherit; |
| 4821 | 5021 | text-transform: inherit; |
| 4822 | 5022 | text-align: inherit; |
| 4823 | 5023 | } |
| 4824 | -.wp-block-tab[aria-selected=true]::before, .wp-block-tab.is-active::before { | |
| 5024 | +:where(.wp-block-tab-list button)[aria-selected=true]::before { | |
| 4825 | 5025 | content: ""; |
| 4826 | 5026 | position: absolute; |
| 4827 | 5027 | border-bottom: 2px solid currentColor; |
| 4828 | 5028 | pointer-events: none; |
| @@ -4830,34 +5030,18 @@ | ||
| 4830 | 5030 | width: 100%; |
| 4831 | 5031 | bottom: 0; |
| 4832 | 5032 | } |
| 4833 | 5033 | |
| 4834 | -.wp-block-tab-panel { | |
| 4835 | - max-width: 100%; | |
| 4836 | - flex-basis: 100%; | |
| 4837 | - flex-grow: 1; | |
| 4838 | - box-sizing: border-box; | |
| 4839 | -} | |
| 4840 | -.wp-block-tab-panel > *:first-child { | |
| 4841 | - margin-top: 0; | |
| 4842 | -} | |
| 4843 | -.wp-block-tab-panel > *:last-child { | |
| 4844 | - margin-bottom: 0; | |
| 4845 | -} | |
| 4846 | -.wp-block-tab-panel[hidden], .wp-block-tab-panel:empty { | |
| 5034 | +.wp-block-tab-panel:empty { | |
| 4847 | 5035 | display: none !important; |
| 4848 | 5036 | } |
| 4849 | - | |
| 4850 | -.wp-block-tab-panel.wp-block.has-background, | |
| 4851 | -.wp-block-tab-panel:not(.wp-block).has-background { | |
| 4852 | - padding: var(--wp--preset--spacing--30); | |
| 5037 | +.wp-block-tab-panel[hidden] { | |
| 5038 | + box-shadow: none !important; | |
| 5039 | + border: none !important; | |
| 5040 | + margin-block-start: 0; | |
| 5041 | + padding: 0 !important; | |
| 4853 | 5042 | } |
| 4854 | 5043 | |
| 4855 | -.wp-block-tab-panels { | |
| 4856 | - flex-grow: 1; | |
| 4857 | - min-width: 0; | |
| 4858 | -} | |
| 4859 | - | |
| 4860 | 5044 | .wp-block-table { |
| 4861 | 5045 | overflow-x: auto; |
| 4862 | 5046 | } |
| 4863 | 5047 | .wp-block-table table { |
| @@ -5056,9 +5240,10 @@ | ||
| 5056 | 5240 | box-sizing: border-box; |
| 5057 | 5241 | overflow: auto; |
| 5058 | 5242 | white-space: pre-wrap; |
| 5059 | 5243 | min-width: 1em; |
| 5060 | - word-break: break-word; | |
| 5244 | + word-break: normal; | |
| 5245 | + overflow-wrap: break-word; | |
| 5061 | 5246 | } |
| 5062 | 5247 | |
| 5063 | 5248 | :where(pre.wp-block-verse) { |
| 5064 | 5249 | font-family: inherit; |
| @@ -5073,10 +5258,9 @@ | ||
| 5073 | 5258 | vertical-align: middle; |
| 5074 | 5259 | } |
| 5075 | 5260 | @supports (position: sticky) { |
| 5076 | 5261 | .wp-block-video [poster] { |
| 5077 | - -o-object-fit: cover; | |
| 5078 | - object-fit: cover; | |
| 5262 | + object-fit: cover; | |
| 5079 | 5263 | } |
| 5080 | 5264 | } |
| 5081 | 5265 | .wp-block-video.aligncenter { |
| 5082 | 5266 | text-align: center; |
| @@ -5240,9 +5424,9 @@ | ||
| 5240 | 5424 | overflow: hidden; |
| 5241 | 5425 | padding: 0; |
| 5242 | 5426 | position: absolute; |
| 5243 | 5427 | width: 1px; |
| 5244 | - word-wrap: normal !important; | |
| 5428 | + overflow-wrap: normal !important; | |
| 5245 | 5429 | word-break: normal !important; |
| 5246 | 5430 | } |
| 5247 | 5431 | |
| 5248 | 5432 | .screen-reader-text:focus { |
| @@ -5355,16 +5539,12 @@ | ||
| 5355 | 5539 | margin: 0 0 1em 0; |
| 5356 | 5540 | } |
| 5357 | 5541 | |
| 5358 | 5542 | html :where(.is-position-sticky) { |
| 5359 | - /* stylelint-disable length-zero-no-unit -- 0px is set explicitly so that it can be used in a calc value. */ | |
| 5360 | 5543 | --wp-admin--admin-bar--position-offset: var(--wp-admin--admin-bar--height, 0px); |
| 5361 | - /* stylelint-enable length-zero-no-unit */ | |
| 5362 | 5544 | } |
| 5363 | 5545 | |
| 5364 | 5546 | @media screen and (max-width: 600px) { |
| 5365 | 5547 | html :where(.is-position-sticky) { |
| 5366 | - /* stylelint-disable length-zero-no-unit -- 0px is set explicitly so that it can be used in a calc value. */ | |
| 5367 | 5548 | --wp-admin--admin-bar--position-offset: 0px; |
| 5368 | - /* stylelint-enable length-zero-no-unit */ | |
| 5369 | 5549 | } |
| 5370 | 5550 | } |