Import the button stylesheet from list-detail.css for its back button

Plan step 36, navigation review sweep. <x-list-detail> renders an
<x-button> as the single-pane back action, but only pane.css picked up
button.css when the carry-over landed; an application importing
layout/list-detail.css alone got an unstyled back button. A new check
reads every layout view's component tags against its stylesheet's
imports, as the group stylesheet tests do for components.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01Qwx5USif3wFFmxtHg5U1g9
This commit is contained in:
Andreas Reinhold / reini
2026-09-15 01:14:07 +02:00
co-authored by Claude Opus 5
parent cbf6c36191
commit 27028bfb7a
2 changed files with 35 additions and 1 deletions
+3 -1
View File
@@ -25,12 +25,14 @@
* what is inside it that the margin is drawn. A pane that is focused as a whole draws no outline:
* it is not a control, and the element focus lands on inside it is what shows the ring.
*
* In `material.layout`; the state and focus are resources/js/layout.js.
* In `material.layout`; the state and focus are resources/js/layout.js. Imports button.css for the
* detail pane's back button.
*/
@layer material.reset, material.tokens, material.base, material.layout, material.components, material.text, material.visibility;
@import './visibility.css';
@import '../components/button.css';
@layer material.layout {
[data-md-list-detail] {
+32
View File
@@ -357,6 +357,38 @@ it('imports a stylesheet for every layout component from layout.css, each beside
}
});
it('imports, from every layout stylesheet, the stylesheet of each component its view renders', function () {
$checked = 0;
foreach (File::files(stylesheetPath('layout')) as $file) {
$name = $file->getBasename('.css');
$view = __DIR__."/../../resources/views/components/{$name}.blade.php";
if (! File::exists($view)) {
continue;
}
preg_match_all('/<x-livewire-material::([a-z-]+)/', File::get($view), $tags);
$imports = stylesheetImports($file->getPathname());
foreach (array_unique($tags[1]) as $tag) {
$import = match (true) {
File::exists(stylesheetPath()."/components/{$tag}.css") => "../components/{$tag}.css",
File::exists(stylesheetPath()."/layout/{$tag}.css") => "./{$tag}.css",
default => null,
};
if ($import !== null) {
$checked++;
expect(in_array($import, $imports, true))->toBeTrue("layout/{$name}.css renders <x-{$tag}> without importing {$import}");
}
}
}
expect($checked)->toBeGreaterThan(0);
});
it('opens every layout stylesheet with a header, the layer statement and plain imports', function () {
foreach (layoutStylesheets() as $file) {
$name = stylesheetName($file);