mirror of
https://github.com/pelican-dev/panel.git
synced 2025-05-20 19:14:45 +02:00
Custom error pages (#810)
* add custom error pages * move icon in front of header text * show exception message if user is root admin * add missing page for very important error: 418 * Update resources/views/errors/layout.blade.php * Update resources/views/errors/layout.blade.php * add dark mode to error pages --------- Co-authored-by: Lance Pioch <lancepioch@gmail.com>
This commit is contained in:
Boy132
GitHub
parent
53460b8d1b
commit
3ffb54503f
8
resources/views/errors/401.blade.php
Normal file
8
resources/views/errors/401.blade.php
Normal file
@ -0,0 +1,8 @@
|
|||||||
|
@props([
|
||||||
|
'code' => '401',
|
||||||
|
'title' => 'Unauthorized',
|
||||||
|
'subtitle' => 'You are not authorized to access this resource.',
|
||||||
|
'icon' => 'tabler-exclamation-circle'
|
||||||
|
])
|
||||||
|
|
||||||
|
@extends('errors::layout')
|
||||||
8
resources/views/errors/403.blade.php
Normal file
8
resources/views/errors/403.blade.php
Normal file
@ -0,0 +1,8 @@
|
|||||||
|
@props([
|
||||||
|
'code' => '403',
|
||||||
|
'title' => 'Forbidden',
|
||||||
|
'subtitle' => $exception->getMessage(),
|
||||||
|
'icon' => 'tabler-exclamation-circle'
|
||||||
|
])
|
||||||
|
|
||||||
|
@extends('errors::layout')
|
||||||
8
resources/views/errors/404.blade.php
Normal file
8
resources/views/errors/404.blade.php
Normal file
@ -0,0 +1,8 @@
|
|||||||
|
@props([
|
||||||
|
'code' => '404',
|
||||||
|
'title' => 'Not found',
|
||||||
|
'subtitle' => 'The requested resource was not found.',
|
||||||
|
'icon' => 'tabler-zoom-question'
|
||||||
|
])
|
||||||
|
|
||||||
|
@extends('errors::layout')
|
||||||
8
resources/views/errors/418.blade.php
Normal file
8
resources/views/errors/418.blade.php
Normal file
@ -0,0 +1,8 @@
|
|||||||
|
@props([
|
||||||
|
'code' => '418',
|
||||||
|
'title' => 'I am a teapot',
|
||||||
|
'subtitle' => 'What happened?',
|
||||||
|
'icon' => 'tabler-teapot'
|
||||||
|
])
|
||||||
|
|
||||||
|
@extends('errors::layout')
|
||||||
8
resources/views/errors/500.blade.php
Normal file
8
resources/views/errors/500.blade.php
Normal file
@ -0,0 +1,8 @@
|
|||||||
|
@props([
|
||||||
|
'code' => '500',
|
||||||
|
'title' => 'Server Error',
|
||||||
|
'subtitle' => fn () => auth()->user()?->isRootAdmin() ? $exception->getMessage() : 'Something went wrong.',
|
||||||
|
'icon' => 'tabler-bug'
|
||||||
|
])
|
||||||
|
|
||||||
|
@extends('errors::layout')
|
||||||
8
resources/views/errors/503.blade.php
Normal file
8
resources/views/errors/503.blade.php
Normal file
@ -0,0 +1,8 @@
|
|||||||
|
@props([
|
||||||
|
'code' => '503',
|
||||||
|
'title' => 'Maintenance',
|
||||||
|
'subtitle' => 'This site is currently down for maintenance.',
|
||||||
|
'icon' => 'tabler-traffic-cone'
|
||||||
|
])
|
||||||
|
|
||||||
|
@extends('errors::layout')
|
||||||
82
resources/views/errors/layout.blade.php
Normal file
82
resources/views/errors/layout.blade.php
Normal file
@ -0,0 +1,82 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html
|
||||||
|
lang="{{ str_replace('_', '-', app()->getLocale()) }}"
|
||||||
|
@class([
|
||||||
|
'fi min-h-screen',
|
||||||
|
'dark' => filament()->hasDarkModeForced(),
|
||||||
|
])>
|
||||||
|
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
|
||||||
|
<link rel="icon" href="{{ config('app.favicon') }}" />
|
||||||
|
|
||||||
|
<title>
|
||||||
|
{{ $title }} - {{ config('app.name') }}
|
||||||
|
</title>
|
||||||
|
|
||||||
|
@filamentStyles
|
||||||
|
|
||||||
|
{{ filament()->getTheme()->getHtml() }}
|
||||||
|
{{ filament()->getFontHtml() }}
|
||||||
|
|
||||||
|
<style>
|
||||||
|
:root {
|
||||||
|
--font-family: '{!! filament()->getFontFamily() !!}';
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
||||||
|
@if (! filament()->hasDarkMode())
|
||||||
|
<script>
|
||||||
|
localStorage.setItem('theme', 'light');
|
||||||
|
</script>
|
||||||
|
@elseif (filament()->hasDarkModeForced())
|
||||||
|
<script>
|
||||||
|
localStorage.setItem('theme', 'dark');
|
||||||
|
</script>
|
||||||
|
@else
|
||||||
|
<script>
|
||||||
|
const theme = localStorage.getItem('theme') ??
|
||||||
|
@js(filament()->getDefaultThemeMode()->value)
|
||||||
|
|
||||||
|
if (
|
||||||
|
theme === 'dark' ||
|
||||||
|
(theme === 'system' &&
|
||||||
|
window.matchMedia('(prefers-color-scheme: dark)')
|
||||||
|
.matches)
|
||||||
|
) {
|
||||||
|
document.documentElement.classList.add('dark');
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
@endif
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body class="fi-body min-h-screen bg-gray-50 font-normal text-gray-950 antialiased dark:bg-gray-950 dark:text-white">
|
||||||
|
<div class="fi-simple-layout flex min-h-screen flex-col items-center">
|
||||||
|
<div class="fi-simple-main-ctn flex w-full flex-grow items-center justify-center">
|
||||||
|
<main
|
||||||
|
class="fi-simple-main my-16 w-full bg-white px-6 py-12 shadow-sm ring-1 ring-gray-950/5 dark:bg-gray-900 dark:ring-white/10 sm:rounded-xl sm:px-12 sm:max-w-lg">
|
||||||
|
<div class="fi-simple-page">
|
||||||
|
<section class="grid auto-cols-fr gap-y-6">
|
||||||
|
<header class="fi-simple-header flex flex-col items-center">
|
||||||
|
<h1 class="fi-simple-header-heading flex text-center text-2xl font-bold tracking-tight text-gray-950 dark:text-white">
|
||||||
|
@if(filled($icon))
|
||||||
|
<x-filament::icon icon="{{ $icon }}" class="h-8 w-8" />
|
||||||
|
@endif
|
||||||
|
|
||||||
|
{{$code}} | {{ $title }}
|
||||||
|
</h1>
|
||||||
|
|
||||||
|
<p class="fi-simple-header-subheading mt-2 text-center text-sm text-gray-500 dark:text-gray-400">
|
||||||
|
{{ $subtitle instanceof \Closure ? $subtitle() : $subtitle }}
|
||||||
|
</p>
|
||||||
|
</header>
|
||||||
|
</section>
|
||||||
|
</div>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
|
|
||||||
|
</html>
|
||||||
Loading…
x
Reference in New Issue
Block a user