Andreas Reinhold / reiniandClaude Opus 5
1e580c573e
Package views now write <x-livewire-material::button>, so a configured prefix (which Blade spells <x-m::button>) and an application component of the same name can no longer break or shadow them. The showcase rewrites its examples to the configured prefix. Adds the README, and waits for the adaptive rail to hear a resize before the navigation tests press its menu button. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01V9NnLxnPp8vaaurb3Z1MFy
84 lines
4.1 KiB
PHP
84 lines
4.1 KiB
PHP
{{-- The layout every error page extends: this package's 403, 404, 419, 429, 500 and 503, and the
|
|
framework's own 401 and 402, which extend `errors::minimal` and find this file before the
|
|
framework's (the provider appends this folder's parent to `view.paths`).
|
|
|
|
Sections — the framework layout's `title`, `code` and `message`, plus three of its own, so
|
|
either layout renders the other's pages:
|
|
`title` the browser tab, followed by the app name;
|
|
`code` the status, drawn in display type over the shape;
|
|
`headline` what happened, in a few words (without it, `message` is the headline);
|
|
`message` one sentence on what to do about it;
|
|
`shape` an M3 Expressive shape name (`cookie-7` by default), in primary-container;
|
|
`actions` the buttons; by default a filled Home and, when the visitor came from a page on
|
|
the way here, a text Back.
|
|
|
|
The app's own Vite entries (`livewire-material.showcase.vite`) bring its scheme, font and
|
|
utilities. But an error page is also what shows while a deploy has no build yet, so when
|
|
those tags cannot be made the page brings a small stylesheet of its own: the app's scheme
|
|
from its scheme data, drawn onto the `data-error-*` hooks. Keep the hooks when changing
|
|
the markup. The shape turns once a minute, unless the visitor asks for reduced motion. --}}
|
|
|
|
@php
|
|
$assets = \NoNameWeb\LivewireMaterial\Support\ErrorPage::assets();
|
|
$back = \NoNameWeb\LivewireMaterial\Support\ErrorPage::backUrl();
|
|
@endphp
|
|
|
|
<!DOCTYPE html>
|
|
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
|
|
<head>
|
|
<meta charset="utf-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
<meta name="robots" content="noindex" />
|
|
|
|
<title>@yield('title') · {{ config('app.name') }}</title>
|
|
|
|
<x-livewire-material::theme-script />
|
|
|
|
@if ($assets !== null)
|
|
{{ $assets }}
|
|
@else
|
|
<style data-error-fallback>{{ \NoNameWeb\LivewireMaterial\Support\ErrorPage::fallbackStyles() }}</style>
|
|
@endif
|
|
|
|
<style>
|
|
@keyframes material-error-turn { to { transform: rotate(1turn); } }
|
|
@media (prefers-reduced-motion: no-preference) { [data-error-shape] { animation: material-error-turn 60s linear infinite; } }
|
|
</style>
|
|
</head>
|
|
<body class="min-h-dvh bg-surface font-sans text-on-surface antialiased">
|
|
<main data-error-page class="mx-auto flex min-h-dvh max-w-xl flex-col items-center justify-center px-6 py-12 text-center">
|
|
<div data-error-art class="relative grid size-48 shrink-0 place-items-center sm:size-60">
|
|
<div data-error-shape class="absolute inset-0">
|
|
<x-livewire-material::shape :name="trim($__env->yieldContent('shape', 'cookie-7'))" class="size-full text-primary-container" />
|
|
</div>
|
|
|
|
<p data-error-code class="relative type-emphasized-display-lg text-on-primary-container tabular-nums">@yield('code')</p>
|
|
</div>
|
|
|
|
<h1 data-error-headline class="mt-10 type-headline-md text-balance sm:type-headline-lg">
|
|
@hasSection('headline')
|
|
@yield('headline')
|
|
@else
|
|
@yield('message')
|
|
@endif
|
|
</h1>
|
|
|
|
@hasSection('headline')
|
|
<p data-error-message class="mt-3 max-w-md type-body-lg text-balance text-on-surface-variant">@yield('message')</p>
|
|
@endif
|
|
|
|
<div data-error-actions class="mt-10 flex flex-wrap items-center justify-center gap-3">
|
|
@hasSection('actions')
|
|
@yield('actions')
|
|
@else
|
|
<x-livewire-material::button :link="url('/')" :label="__('Go home')" variant="filled" size="md" no-wire-navigate />
|
|
|
|
@if ($back !== null)
|
|
<x-livewire-material::button :link="$back" :label="__('Go back')" variant="text" size="md" no-wire-navigate />
|
|
@endif
|
|
@endif
|
|
</div>
|
|
</main>
|
|
</body>
|
|
</html>
|