diff --git a/packages/edit-site/src/components/start-template-options/style.scss b/packages/edit-site/src/components/start-template-options/style.scss index 4a2199908de2e..11b971a7f4dd1 100644 --- a/packages/edit-site/src/components/start-template-options/style.scss +++ b/packages/edit-site/src/components/start-template-options/style.scss @@ -17,16 +17,17 @@ display: grid; width: 100%; margin-top: $grid-unit-05; - gap: $grid-unit-10; + gap: $grid-unit-30; grid-template-columns: repeat(auto-fit, minmax(min(100%/2, max(240px, 100%/10)), 1fr)); grid-auto-rows: var(--wp-edit-site-start-template-options-grid-height); .block-editor-block-patterns-list__list-item { break-inside: avoid-column; - margin-bottom: $grid-unit-30; + margin-bottom: 0; width: 100%; .block-editor-block-preview__container { height: 100%; + box-shadow: 0 0 0 1px $gray-300; } .block-editor-block-preview__content { @@ -37,6 +38,21 @@ .block-editor-block-patterns-list__item-title { display: none; } + + &:hover { + .block-editor-block-preview__container { + box-shadow: 0 0 0 2px var(--wp-admin-theme-color); + } + } + + &:focus { + .block-editor-block-preview__container { + box-shadow: inset 0 0 0 1px $white, 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color); + + // Windows High Contrast mode will show this outline, but not the box-shadow. + outline: 2px solid transparent; + } + } } // The start blank pattern is the last and we are selecting it. diff --git a/phpunit/class-gutenberg-rest-templates-controller-test.php b/phpunit/class-gutenberg-rest-templates-controller-test.php index 2c8521d63fd82..62087282abac1 100644 --- a/phpunit/class-gutenberg-rest-templates-controller-test.php +++ b/phpunit/class-gutenberg-rest-templates-controller-test.php @@ -48,6 +48,18 @@ public function test_get_template_fallback() { $request->set_param( 'template_prefix', 'page' ); $response = rest_get_server()->dispatch( $request ); $this->assertSame( 'singular', $response->get_data()['slug'], 'Should fallback to `singular.html`.' ); + // Should fallback to `tag.html`. + $request->set_param( 'slug', 'tag' ); + $request->set_param( 'ignore_empty', false ); + $request->set_param( 'is_custom', false ); + $response = rest_get_server()->dispatch( $request ); + $this->assertSame( 'tag', $response->get_data()['slug'], 'Should fallback to `tag.html`.' ); + // Should fallback to `index.html`. + $request->set_param( 'slug', 'tag' ); + $request->set_param( 'ignore_empty', true ); + $request->set_param( 'is_custom', false ); + $response = rest_get_server()->dispatch( $request ); + $this->assertSame( 'index', $response->get_data()['slug'], 'Should fallback to `index.html`.' ); // Should fallback to `index.html`. $request->set_param( 'slug', 'tag-rigas' ); $request->set_param( 'is_custom', false ); diff --git a/test/emptytheme/templates/tag.html b/test/emptytheme/templates/tag.html new file mode 100644 index 0000000000000..e69de29bb2d1d