diff --git a/lib/blocks.php b/lib/blocks.php index 3f0e8a547a868..18a9eb34ff166 100644 --- a/lib/blocks.php +++ b/lib/blocks.php @@ -199,7 +199,7 @@ function gutenberg_register_core_block_assets( $block_name ) { wp_register_style( "wp-block-{$block_name}", gutenberg_url( $style_path ), - array(), + array( 'global-styles' ), $default_version ); wp_style_add_data( "wp-block-{$block_name}", 'rtl', 'replace' ); @@ -207,7 +207,7 @@ function gutenberg_register_core_block_assets( $block_name ) { // Add a reference to the stylesheet's path to allow calculations for inlining styles in `wp_head`. wp_style_add_data( "wp-block-{$block_name}", 'path', gutenberg_dir_path() . $style_path ); } else { - wp_register_style( "wp-block-{$block_name}", false ); + wp_register_style( "wp-block-{$block_name}", false, array( 'global-styles' ) ); } // If the current theme supports wp-block-styles, dequeue the full stylesheet @@ -246,7 +246,7 @@ function() { wp_register_style( "wp-block-{$block_name}", gutenberg_url( $theme_style_path ), - array(), + array( 'global-styles' ), $default_version ); wp_style_add_data( "wp-block-{$block_name}", 'path', gutenberg_dir_path() . $theme_style_path ); diff --git a/lib/compat/wordpress-6.1/theme.json b/lib/compat/wordpress-6.1/theme.json index eb37ea2706887..d036c158d2f8e 100644 --- a/lib/compat/wordpress-6.1/theme.json +++ b/lib/compat/wordpress-6.1/theme.json @@ -247,7 +247,9 @@ "background": "#32373c" }, "typography": { - "fontSize": "1.125em", + "fontSize": "inherit", + "fontFamily": "inherit", + "lineHeight": "inherit", "textDecoration": "none" } }, diff --git a/packages/block-library/src/button/block.json b/packages/block-library/src/button/block.json index 35887f057ca81..f86030c7460a5 100644 --- a/packages/block-library/src/button/block.json +++ b/packages/block-library/src/button/block.json @@ -89,22 +89,7 @@ "radius": true } }, - "__experimentalSelector": ".wp-block-button__link", - "__experimentalStyle": { - "border": { - "//": "100% causes an oval, but any explicit but really high value retains the pill shape.", - "radius": "9999px" - }, - "spacing": { - "padding": { - "//": "The extra 2px are added to size solids the same as the outline versions.", - "top": "calc(0.667em + 2px)", - "right": "calc(1.333em + 2px)", - "bottom": "calc(0.667em + 2px)", - "left": "calc(1.333em + 2px)" - } - } - } + "__experimentalSelector": ".wp-block-button__link" }, "styles": [ { "name": "fill", "label": "Fill", "isDefault": true }, diff --git a/packages/block-library/src/button/style.scss b/packages/block-library/src/button/style.scss index 389b86194ad0c..b76aeb0daa784 100644 --- a/packages/block-library/src/button/style.scss +++ b/packages/block-library/src/button/style.scss @@ -29,6 +29,16 @@ $blocks-block__margin: 0.5em; } } +// These rules are set to zero specificity to keep the default styles for buttons. +// They are needed for backwards compatibility. +:where(.wp-block-button__link) { + // 100% causes an oval, but any explicit but really high value retains the pill shape. + border-radius: 9999px; + + // The extra 2px are added to size solids the same as the outline versions. + padding: calc(0.667em + 2px) calc(1.333em + 2px); +} + // Increased specificity needed to override margins. .wp-block-buttons > .wp-block-button { &.has-custom-width { diff --git a/packages/block-library/src/file/style.scss b/packages/block-library/src/file/style.scss index 6452fdb9e7889..3d3dc9b8ced48 100644 --- a/packages/block-library/src/file/style.scss +++ b/packages/block-library/src/file/style.scss @@ -24,7 +24,7 @@ } //This needs a low specificity so it won't override the rules from the button element if defined in theme.json. -.wp-block-file__button { +:where(.wp-block-file__button) { border-radius: 2em; padding: 0.5em 1em; diff --git a/packages/block-library/src/post-comments/style.scss b/packages/block-library/src/post-comments/style.scss index 44c0b9be2d7c3..ebcf192d898b1 100644 --- a/packages/block-library/src/post-comments/style.scss +++ b/packages/block-library/src/post-comments/style.scss @@ -128,8 +128,12 @@ input:not([type="submit"]):not([type="checkbox"]) { padding: calc(0.667em + 2px); // The extra 2px is added to match outline buttons. } +} - input[type="submit"] { - border: none; - } + +// Using :where to give this a low specificity so that element styles take precedence. +// Needed for backwards compatibility. +// Styles copied from button block styles. +:where(.wp-block-post-comments input[type="submit"]) { + border: none; } diff --git a/packages/block-library/src/search/style.scss b/packages/block-library/src/search/style.scss index 426e34662cde9..cc6aab40bd1cb 100644 --- a/packages/block-library/src/search/style.scss +++ b/packages/block-library/src/search/style.scss @@ -1,11 +1,6 @@ .wp-block-search__button { - border: 1px solid #ccc; - padding: 0.375em 0.625em; margin-left: 0.625em; word-break: normal; - font-size: inherit; - font-family: inherit; - line-height: inherit; &.has-icon { line-height: 0; @@ -18,6 +13,13 @@ } } +// These rules are set to zero specificity to keep the default styles for search buttons. +// They are needed for backwards compatibility. +:where(.wp-block-search__button) { + border: 1px solid #ccc; + padding: 0.375em 0.625em; +} + .wp-block-search__inside-wrapper { display: flex; flex: auto; @@ -60,7 +62,8 @@ } } - .wp-block-search__button { + // For lower specificity. + :where(.wp-block-search__button) { padding: 0.125em 0.5em; } }