Twenty Twenty-One: Search block "Button inside" input border appears on front end but not in block editor

[levinbaria]

Theme: TwentyTwentyOne.

In the TwentyTwentyOne theme for WordPress, when using the Search block with the Button position set to "Button inside", the block editor (editor view) may not display a border around the search input, even though it appears correctly on the front-end (site view).

Theme: TwentyTwentyOne.

In the TwentyTwentyOne theme for WordPress, when using the Search block with the Button position set to "Button inside", the block editor (editor view) may not display a border around the search input, even though it appears correctly on the front-end (site view).

Trac ticket: https://core.trac.wordpress.org/ticket/63888

[sabernhardt]

The "Button inside" style intentionally removed the border from the input field (see ​PR 912 and ​PR 673).

Twenty Twenty-One added border: none in the editor but relied on the block library styles to remove the border from the front end. Then GB41393 lowered the specificity (0-1-0), and the theme's default border overrides that now (0-2-0).

To follow the original design, the front-end styles would need adjusting instead of editor styles. However, the border is part of the appearance since November 2022. People who have chosen the "Button inside" option in the past few years might appreciate that it has a border now. Changing the editor styles to match the front could be the better choice.