Added files

This commit is contained in:
nanometer5088
2023-06-15 01:37:35 -03:00
parent 22b21c98ff
commit aa2beac2e9
11 changed files with 227 additions and 2 deletions

BIN
Error 404/caveman.gif Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.3 MiB

72
Error 404/custom_404.html Normal file
View File

@@ -0,0 +1,72 @@
<!DOCTYPE html>
<html>
<head>
<title>404 - Page Not Found</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
body {
font-family: Arial, sans-serif;
background-color: white;
margin: 0;
padding: 0;
}
.container {
max-width: 800px;
margin: 0 auto;
padding: 10px;
text-align: center;
}
h1 {
font-size: 48px;
margin-top: 0;
margin-bottom: 30px;
}
img {
max-width: 100%;
height: auto;
margin-bottom: 10px;
}
.button {
display: inline-block;
background-color: #af664c;
color: white;
padding: 10px 20px;
border-radius: 5px;
text-decoration: none;
transition: background-color 0.6s ease, transform 0.4s ease;
}
.button:hover {
background-color: #00cc81;
transform: scale(1.2);
}
@media only screen and (max-width: 600px) {
.container {
padding: 20px;
}
h1 {
font-size: 36px;
margin-top: 20px;
margin-bottom: 10px;
}
img {
margin-bottom: 30px;
}
}
</style>
</head>
<body>
<div class="container">
<img src="caveman.gif" alt="Caveman GIF">
<h1>Seems like you are lost, that's a 404!</h1>
<a class="button" href="https://example.com">To the main page</a>
</div>
</body>
</html>

View File

@@ -1,2 +1,13 @@
# HTTP-Response-Websites # Custom HTTP Error Pages
Custom error pages for various HTTP status codes that are triggered when an error is encountered acessing my website
This repository contains custom error pages for various HTTP status codes that are triggered when an error is encountered on a website. These error pages can help improve the user experience by providing a more visually appealing error message.
## Usage
To use these custom error pages, simply download the files and place them in the appropriate directory on your server. The location of this directory may vary depending on your web server and configuration.
In some cases, certain webpages may not function as intended unless specific modifications are made, such as adding a link to the button that redirects to your website.
## License
This repository is licensed under the [AGPL-3.0 license](LICENSE).

BIN
Unavailable/cat.gif Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.4 MiB

BIN
Unavailable/maintenance.gif Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 983 KiB

View File

@@ -0,0 +1,87 @@
<!DOCTYPE html>
<html>
<head>
<title>Under Maintenance</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
body {
background-color: #1f1f1f;
color: #f5f5f5;
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
}
.container {
max-width: 800px;
margin: 0 auto;
padding: 20px;
text-align: center;
}
img {
max-width: 100%;
height: auto;
margin-bottom: 30px;
}
h1 {
font-size: 48px;
margin-top: 0;
margin-bottom: 30px;
}
p {
font-size: 24px;
margin-bottom: 30px;
}
a {
background-color: #af664c;
color: white;
padding: 10px 20px;
border-radius: 5px;
text-decoration: none;
transition: background-color 0.6s ease, transform 0.4s ease;
font-size: 20px;
}
a:hover {
background-color: #dc8962;
transform: scale(1.1);
}
.dropdown {
position: relative;
display: inline-block;
}
.dropdown-content {
display: none;
position: sticky;
z-index: 1;
background-color: #1f1f1f;
min-width: 320px;
max-width: 320px;
/* box-shadow: 1px 1px 1px 1px rgba(0, 0, 0, 0.2); */
padding: 3px 3px;
border-radius: 4px;
cursor: pointer;
}
.dropdown:hover .dropdown-content {
display: block;
}
.dropdown:hover .dropbtn {
background-color: #8a2c2c;
transform: scale(1.1);
}
</style>
</head>
<body>
<div class="container">
<h1>Temporarily Unavailable</h1>
<img src="maintenance.gif" alt="Under Maintenance GIF">
<p>We're giving our systems a tune-up to keep things running smoothly. Please pardon our dust while we work behind the scenes.</p>
<div class="dropdown">
<u class="dropbtn">here's a cat gif for now </u>
<div class="dropdown-content">
<img src="cat.gif" alt="Cat GIF">
</div>
</div>
</div>
</body>
</html>

View File

@@ -0,0 +1,9 @@
<html style="height: 100%;">
<head>
<meta name="viewport" content="width=device-width, minimum-scale=0.1">
<title>504</title>
</head>
<body style="margin: 0px; background: #0e0e0e; height: 100%; text-align: center;">
<img style="display: block;-webkit-user-select: none;margin: auto;background-color: hsl(0, 0%, 90%);transition: background-color 300ms;" src="https://http.cat/401">
</body>
</html>

View File

@@ -0,0 +1,7 @@
<html style="height: 100%;">
<head>
<meta name="viewport" content="width=device-width, minimum-scale=0.1">
<title>403</title>
</head>
<body style="margin: 0px; background: #0e0e0e; height: 100%"><img style="display: block;-webkit-user-select: none;margin: auto;background-color: hsl(0, 0%, 90%);transition: background-color 300ms;" src="https://http.cat/403"></body>
</html>

View File

@@ -0,0 +1,18 @@
<html>
<header><title>Error 404</title></header>
<head>
<meta name="viewport" content="width=device-width; height=device-height;">
<link rel="stylesheet" href="resource://content-accessible/ImageDocument.css">
<link rel="stylesheet" href="resource://content-accessible/TopLevelImageDocument.css">
<title>404 (JPEG Image, 750&nbsp;×&nbsp;600 pixels)</title>
<style>
img {
display: block;
margin: auto;
}
</style>
</head>
<body>
<img src="https://http.cat/404" alt="https://http.cat/404">
</body>
</html>

View File

@@ -0,0 +1,12 @@
<html>
<header><title>Error 502</title></header>
<head>
<meta name="viewport" content="width=device-width; height=device-height;">
<link rel="stylesheet" href="resource://content-accessible/ImageDocument.css">
<link rel="stylesheet" href="resource://content-accessible/TopLevelImageDocument.css">
<title>502 (JPEG Image, 750&nbsp;×&nbsp;600 pixels)</title>
</head>
<body style="text-align:center;">
<img src="https://http.cat/502" alt="https://http.cat/502">
</body>
</html>

View File

@@ -0,0 +1,9 @@
<html style="height: 100%;">
<head>
<meta name="viewport" content="width=device-width, minimum-scale=0.1">
<title>504</title>
</head>
<body style="margin: 0px; background: #0e0e0e; height: 100%; text-align: center;">
<img style="display: block;-webkit-user-select: none;margin: auto;background-color: hsl(0, 0%, 90%);transition: background-color 300ms;" src="https://http.cat/504">
</body>
</html>