feat: Add custom error pages

fixes #189 https://github.com/rico-vz/HeimerdingerLoL/issues/189
- Created custom error pages with specific messages and designs for HTTP status codes.
- Each page includes a title, description, appropriate message content, and a link to return to the homepage.
This commit is contained in:
Rico van Zelst
2024-04-14 14:02:20 +02:00
parent 01b3e35e87
commit 4cd8485a55
10 changed files with 160 additions and 0 deletions

View File

@@ -0,0 +1,16 @@
@extends('layouts.app')
@section('title', 'Heimerdinger • 401 Unauthorized')
@section('description', 'Explore League of Legends champions, skins, and game assets on Heimerdinger.')
@section('content')
<div class="flex items-center justify-center h-screen">
<div class="text-center">
<h1 class="font-bold text-orange-400 text-8xl">401</h1>
<h2 class="text-3xl font-bold text-white">Unauthorized</h2>
<p class="mb-8 text-stone-300">You are not authorized to view this page.</p>
<a href="/" class="px-4 py-2 mt-4 text-white bg-orange-400 rounded-md hover:bg-orange-500">Go back to the homepage</a>
</div>
</div>
@endsection

View File

@@ -0,0 +1,16 @@
@extends('layouts.app')
@section('title', 'Heimerdinger • 402 Payment Required')
@section('description', 'Explore League of Legends champions, skins, and game assets on Heimerdinger.')
@section('content')
<div class="flex items-center justify-center h-screen">
<div class="text-center">
<h1 class="font-bold text-orange-400 text-8xl">402</h1>
<h2 class="text-3xl font-bold text-white">Payment Required</h2>
<p class="mb-8 text-stone-300">You need to make a payment to view this page.</p>
<a href="/" class="px-4 py-2 mt-4 text-white bg-orange-400 rounded-md hover:bg-orange-500">Go back to the homepage</a>
</div>
</div>
@endsection

View File

@@ -0,0 +1,16 @@
@extends('layouts.app')
@section('title', 'Heimerdinger • 403 Forbidden')
@section('description', 'Explore League of Legends champions, skins, and game assets on Heimerdinger.')
@section('content')
<div class="flex items-center justify-center h-screen">
<div class="text-center">
<h1 class="font-bold text-orange-400 text-8xl">403</h1>
<h2 class="text-3xl font-bold text-white">Forbidden</h2>
<p class="mb-8 text-stone-300">You are not allowed to view this page.</p>
<a href="/" class="px-4 py-2 mt-4 text-white bg-orange-400 rounded-md hover:bg-orange-500">Go back to the homepage</a>
</div>
</div>
@endsection

View File

@@ -0,0 +1,16 @@
@extends('layouts.app')
@section('title', 'Heimerdinger • 404 Not Found')
@section('description', 'Explore League of Legends champions, skins, and game assets on Heimerdinger.')
@section('content')
<div class="flex items-center justify-center h-screen">
<div class="text-center">
<h1 class="font-bold text-orange-400 text-8xl">404</h1>
<h2 class="text-3xl font-bold text-white">Page Not Found</h2>
<p class="mb-8 text-stone-300">The page you are looking for does not exist.</p>
<a href="/" class="px-4 py-2 mt-4 text-white bg-orange-400 rounded-md hover:bg-orange-500">Go back to the homepage</a>
</div>
</div>
@endsection

View File

@@ -0,0 +1,16 @@
@extends('layouts.app')
@section('title', 'Heimerdinger • 419 Expired')
@section('description', 'Explore League of Legends champions, skins, and game assets on Heimerdinger.')
@section('content')
<div class="flex items-center justify-center h-screen">
<div class="text-center">
<h1 class="font-bold text-orange-400 text-8xl">419</h1>
<h2 class="text-3xl font-bold text-white">Expired</h2>
<p class="mb-8 text-stone-300">The page you are looking for has expired.</p>
<a href="/" class="px-4 py-2 mt-4 text-white bg-orange-400 rounded-md hover:bg-orange-500">Go back to the homepage</a>
</div>
</div>
@endsection

View File

@@ -0,0 +1,16 @@
@extends('layouts.app')
@section('title', 'Heimerdinger • 429 Limited')
@section('description', 'Explore League of Legends champions, skins, and game assets on Heimerdinger.')
@section('content')
<div class="flex items-center justify-center h-screen">
<div class="text-center">
<h1 class="font-bold text-orange-400 text-8xl">403</h1>
<h2 class="text-3xl font-bold text-white">Rate Limited</h2>
<p class="mb-8 text-stone-300">You have been rate limited. Please try again later.</p>
<a href="/" class="px-4 py-2 mt-4 text-white bg-orange-400 rounded-md hover:bg-orange-500">Go back to the homepage</a>
</div>
</div>
@endsection

View File

@@ -0,0 +1,16 @@
@extends('layouts.app')
@section('title', 'Heimerdinger')
@section('description', 'Explore League of Legends champions, skins, and game assets on Heimerdinger.')
@section('content')
<div class="flex items-center justify-center h-screen">
<div class="text-center">
<h1 class="font-bold text-orange-400 text-8xl">{{ $exception->getStatusCode() }}</h1>
<h2 class="mb-4 text-3xl font-bold text-white">{{ $exception->getMessage() }}</h2>
<a href="/" class="px-4 py-2 mt-4 text-white bg-orange-400 rounded-md hover:bg-orange-500">Go back to the
homepage</a>
</div>
</div>
@endsection

View File

@@ -0,0 +1,16 @@
@extends('layouts.app')
@section('title', 'Heimerdinger • 500')
@section('description', 'Explore League of Legends champions, skins, and game assets on Heimerdinger.')
@section('content')
<div class="flex items-center justify-center h-screen">
<div class="text-center">
<h1 class="font-bold text-orange-400 text-8xl">500</h1>
<h2 class="text-3xl font-bold text-white">Internal Server Error</h2>
<p class="mb-8 text-stone-300">An unexpected error occurred on the server.</p>
<a href="/" class="px-4 py-2 mt-4 text-white bg-orange-400 rounded-md hover:bg-orange-500">Go back to the homepage</a>
</div>
</div>
@endsection

View File

@@ -0,0 +1,16 @@
@extends('layouts.app')
@section('title', 'Heimerdinger • 503 Unavailable')
@section('description', 'Explore League of Legends champions, skins, and game assets on Heimerdinger.')
@section('content')
<div class="flex items-center justify-center h-screen">
<div class="text-center">
<h1 class="font-bold text-orange-400 text-8xl">503</h1>
<h2 class="text-3xl font-bold text-white">Unavailable</h2>
<p class="mb-8 text-stone-300">The page you are looking for is unavailable.</p>
<a href="/" class="px-4 py-2 mt-4 text-white bg-orange-400 rounded-md hover:bg-orange-500">Go back to the homepage</a>
</div>
</div>
@endsection

View File

@@ -0,0 +1,16 @@
@extends('layouts.app')
@section('title', 'Heimerdinger')
@section('description', 'Explore League of Legends champions, skins, and game assets on Heimerdinger.')
@section('content')
<div class="flex items-center justify-center h-screen">
<div class="text-center">
<h1 class="font-bold text-orange-400 text-8xl">{{ $exception->getStatusCode() }}</h1>
<h2 class="mb-4 text-3xl font-bold text-white">{{ $exception->getMessage() }}</h2>
<a href="/" class="px-4 py-2 mt-4 text-white bg-orange-400 rounded-md hover:bg-orange-500">Go back to the
homepage</a>
</div>
</div>
@endsection