Give each canonical layout a page of its own in the Layout section

Plan step 38: the Layout section's Overview keeps its breakpoint
table and live "This window" readout (now a shared
<x-showcase::breakpoint-readout> partial, and the five breakpoint
cards a real range-queried data-md-showcase-breakpoint-card instead
of Tailwind's max-medium:/medium:max-expanded: variants), but the
three canonical layouts move off it onto a page of their own:
/material/layout/{list-detail,supporting-pane,feed}
(ShowcaseController::layout(), routes/showcase.php), each built on
the real component, sharing one <x-section-nav> Sections::
layoutPages() feeds. The search index gains an entry per page with
its own URL, and the component-homes scan now also reads the three
pages' own source so <x-list-detail>, <x-supporting-pane> and
<x-feed> keep a home.

The whole section moves onto the layout components and md-* classes:
no bespoke Tailwind grid or table styling remains.

LayoutTest's browser test now visits the three dedicated pages
instead of one shared /material/layout; a new Feature test asserts
each page renders and is linked from the Layout section.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01Qwx5USif3wFFmxtHg5U1g9
This commit is contained in:
Andreas Reinhold / reini
2026-09-15 04:22:38 +02:00
co-authored by Claude Sonnet 5
parent 44a29a8ea2
commit 487176d345
11 changed files with 355 additions and 120 deletions
+18
View File
@@ -45,6 +45,24 @@ it('gives every section a page of its own, linked from the overview and the rail
$this->get('/material/not-a-section')->assertNotFound();
});
it('gives each canonical layout a page of its own, linked from the Layout section', function () {
foreach (['list-detail', 'supporting-pane', 'feed'] as $page) {
test()->withoutVite()->get("/material/layout/{$page}")
->assertOk()
->assertSee('id="example-'.$page.'"', false)
// Its own navigation reaches the other three pages, including itself.
->assertSee(route('livewire-material.layout', 'list-detail', false), false)
->assertSee(route('livewire-material.layout', 'supporting-pane', false), false)
->assertSee(route('livewire-material.layout', 'feed', false), false);
}
test()->withoutVite()->get('/material/layout')
->assertOk()
->assertSee(route('livewire-material.layout', 'list-detail', false), false)
->assertSee(route('livewire-material.layout', 'supporting-pane', false), false)
->assertSee(route('livewire-material.layout', 'feed', false), false);
});
it('indexes every section, example and component for the search, each linking to a place that exists', function () {
$index = collect($this->getJson('/material/search.json')->assertOk()->json());