Ajouté pages et requetes d'erreurs par défaut.

This commit is contained in:
Fabrice Quenneville 2024-07-30 22:25:07 -04:00
parent 6127efd6e1
commit c63f44feee
34 changed files with 2521 additions and 0 deletions

View File

@ -0,0 +1,72 @@
HTTP/1.1 400 Bad Request
Cache-Control: no-cache
Connection: close
Content-Type: text/html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>400 Bad Request</title>
<style>
body {
font-family: Arial, sans-serif;
background-color: #f8f9fa;
color: #343a40;
text-align: center;
display: flex;
flex-direction: column;
justify-content: space-between;
min-height: 100vh;
margin: 0;
}
.container {
flex: 1;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
h1 {
font-size: 2.5em;
margin-bottom: 20px;
}
p {
font-size: 1.2em;
margin-bottom: 30px;
}
.footer {
font-size: 0.9em;
color: #6c757d;
position: fixed;
bottom: 0;
left: 0;
width: 100%;
background-color: #ffffff;
padding: 10px 0;
box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.1);
}
@media (max-width: 600px) {
h1 {
font-size: 2em;
}
p {
font-size: 1em;
}
}
</style>
</head>
<body>
<div class="container">
<h1>400 Bad Request</h1>
<p>Oops! Something went wrong with your request.</p>
</div>
<div class="footer">
<p>
Why did the server go broke? Because it couldn't process any requests!
</p>
</div>
</body>
</html>

View File

@ -0,0 +1,73 @@
HTTP/1.1 401 Unauthorized
Cache-Control: no-cache
Connection: close
Content-Type: text/html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>401 Unauthorized</title>
<style>
body {
font-family: Arial, sans-serif;
background-color: #f8f9fa;
color: #343a40;
text-align: center;
display: flex;
flex-direction: column;
justify-content: space-between;
min-height: 100vh;
margin: 0;
}
.container {
flex: 1;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
h1 {
font-size: 2.5em;
margin-bottom: 20px;
}
p {
font-size: 1.2em;
margin-bottom: 30px;
}
.footer {
font-size: 0.9em;
color: #6c757d;
position: fixed;
bottom: 0;
left: 0;
width: 100%;
background-color: #ffffff;
padding: 10px 0;
box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.1);
}
@media (max-width: 600px) {
h1 {
font-size: 2em;
}
p {
font-size: 1em;
}
}
</style>
</head>
<body>
<div class="container">
<h1>401 Unauthorized</h1>
<p>Oops! Access is denied. You are not authorized to view this page.</p>
</div>
<div class="footer">
<p>
Why did the hacker break up with his computer? He found out it was
"encrypting" with someone else behind his back!
</p>
</div>
</body>
</html>

View File

@ -0,0 +1,73 @@
HTTP/1.1 402 Payment Required
Cache-Control: no-cache
Connection: close
Content-Type: text/html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>402 Payment Required</title>
<style>
body {
font-family: Arial, sans-serif;
background-color: #f8f9fa;
color: #343a40;
text-align: center;
display: flex;
flex-direction: column;
justify-content: space-between;
min-height: 100vh;
margin: 0;
}
.container {
flex: 1;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
h1 {
font-size: 2.5em;
margin-bottom: 20px;
}
p {
font-size: 1.2em;
margin-bottom: 30px;
}
.footer {
font-size: 0.9em;
color: #6c757d;
position: fixed;
bottom: 0;
left: 0;
width: 100%;
background-color: #ffffff;
padding: 10px 0;
box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.1);
}
@media (max-width: 600px) {
h1 {
font-size: 2em;
}
p {
font-size: 1em;
}
}
</style>
</head>
<body>
<div class="container">
<h1>402 Payment Required</h1>
<p>Oops! You need to pay to access this resource.</p>
</div>
<div class="footer">
<p>
Why did the web developer always carry a credit card? To handle all
those "payment required" errors!
</p>
</div>
</body>
</html>

View File

@ -0,0 +1,73 @@
HTTP/1.1 403 Forbidden
Cache-Control: no-cache
Connection: close
Content-Type: text/html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>403 Forbidden</title>
<style>
body {
font-family: Arial, sans-serif;
background-color: #f8f9fa;
color: #343a40;
text-align: center;
display: flex;
flex-direction: column;
justify-content: space-between;
min-height: 100vh;
margin: 0;
}
.container {
flex: 1;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
h1 {
font-size: 2.5em;
margin-bottom: 20px;
}
p {
font-size: 1.2em;
margin-bottom: 30px;
}
.footer {
font-size: 0.9em;
color: #6c757d;
position: fixed;
bottom: 0;
left: 0;
width: 100%;
background-color: #ffffff;
padding: 10px 0;
box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.1);
}
@media (max-width: 600px) {
h1 {
font-size: 2em;
}
p {
font-size: 1em;
}
}
</style>
</head>
<body>
<div class="container">
<h1>403 Forbidden</h1>
<p>Oops! Access to this resource is forbidden.</p>
</div>
<div class="footer">
<p>
Why did the computer get grounded? It kept accessing "forbidden"
websites when its parents weren't looking!
</p>
</div>
</body>
</html>

View File

@ -0,0 +1,73 @@
HTTP/1.1 404 Not Found
Cache-Control: no-cache
Connection: close
Content-Type: text/html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>404 Not Found</title>
<style>
body {
font-family: Arial, sans-serif;
background-color: #f8f9fa;
color: #343a40;
text-align: center;
display: flex;
flex-direction: column;
justify-content: space-between;
min-height: 100vh;
margin: 0;
}
.container {
flex: 1;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
h1 {
font-size: 2.5em;
margin-bottom: 20px;
}
p {
font-size: 1.2em;
margin-bottom: 30px;
}
.footer {
font-size: 0.9em;
color: #6c757d;
position: fixed;
bottom: 0;
left: 0;
width: 100%;
background-color: #ffffff;
padding: 10px 0;
box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.1);
}
@media (max-width: 600px) {
h1 {
font-size: 2em;
}
p {
font-size: 1em;
}
}
</style>
</head>
<body>
<div class="container">
<h1>404 Not Found</h1>
<p>Oops! The page you are looking for could not be found.</p>
</div>
<div class="footer">
<p>
Why was the HTTP request so lonely? It kept getting "404 Not Found"
responses whenever it tried to connect!
</p>
</div>
</body>
</html>

View File

@ -0,0 +1,73 @@
HTTP/1.1 405 Method Not Allowed
Cache-Control: no-cache
Connection: close
Content-Type: text/html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>405 Method Not Allowed</title>
<style>
body {
font-family: Arial, sans-serif;
background-color: #f8f9fa;
color: #343a40;
text-align: center;
display: flex;
flex-direction: column;
justify-content: space-between;
min-height: 100vh;
margin: 0;
}
.container {
flex: 1;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
h1 {
font-size: 2.5em;
margin-bottom: 20px;
}
p {
font-size: 1.2em;
margin-bottom: 30px;
}
.footer {
font-size: 0.9em;
color: #6c757d;
position: fixed;
bottom: 0;
left: 0;
width: 100%;
background-color: #ffffff;
padding: 10px 0;
box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.1);
}
@media (max-width: 600px) {
h1 {
font-size: 2em;
}
p {
font-size: 1em;
}
}
</style>
</head>
<body>
<div class="container">
<h1>405 Method Not Allowed</h1>
<p>Oops! The method you used is not allowed for this resource.</p>
</div>
<div class="footer">
<p>
Why did the developer break up with his Git repository? Because it had
too many "commits"ment issues!
</p>
</div>
</body>
</html>

View File

@ -0,0 +1,75 @@
HTTP/1.1 406 Not Acceptable
Cache-Control: no-cache
Connection: close
Content-Type: text/html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>406 Not Acceptable</title>
<style>
body {
font-family: Arial, sans-serif;
background-color: #f8f9fa;
color: #343a40;
text-align: center;
display: flex;
flex-direction: column;
justify-content: space-between;
min-height: 100vh;
margin: 0;
}
.container {
flex: 1;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
h1 {
font-size: 2.5em;
margin-bottom: 20px;
}
p {
font-size: 1.2em;
margin-bottom: 30px;
}
.footer {
font-size: 0.9em;
color: #6c757d;
position: fixed;
bottom: 0;
left: 0;
width: 100%;
background-color: #ffffff;
padding: 10px 0;
box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.1);
}
@media (max-width: 600px) {
h1 {
font-size: 2em;
}
p {
font-size: 1em;
}
}
</style>
</head>
<body>
<div class="container">
<h1>406 Not Acceptable</h1>
<p>
Oops! The server cannot produce a response that the client will accept.
</p>
</div>
<div class="footer">
<p>
Why did the server break up with the client? They couldn't agree on
which language to speak!
</p>
</div>
</body>
</html>

View File

@ -0,0 +1,73 @@
HTTP/1.1 407 Proxy Authentication Required
Cache-Control: no-cache
Connection: close
Content-Type: text/html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>407 Proxy Authentication Required</title>
<style>
body {
font-family: Arial, sans-serif;
background-color: #f8f9fa;
color: #343a40;
text-align: center;
display: flex;
flex-direction: column;
justify-content: space-between;
min-height: 100vh;
margin: 0;
}
.container {
flex: 1;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
h1 {
font-size: 2.5em;
margin-bottom: 20px;
}
p {
font-size: 1.2em;
margin-bottom: 30px;
}
.footer {
font-size: 0.9em;
color: #6c757d;
position: fixed;
bottom: 0;
left: 0;
width: 100%;
background-color: #ffffff;
padding: 10px 0;
box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.1);
}
@media (max-width: 600px) {
h1 {
font-size: 2em;
}
p {
font-size: 1em;
}
}
</style>
</head>
<body>
<div class="container">
<h1>407 Proxy Authentication Required</h1>
<p>Oops! Proxy authentication is required to access this resource.</p>
</div>
<div class="footer">
<p>
Why was the proxy server so shy? It kept asking for authentication
before making friends!
</p>
</div>
</body>
</html>

View File

@ -0,0 +1,73 @@
HTTP/1.1 408 Request Timeout
Cache-Control: no-cache
Connection: close
Content-Type: text/html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>408 Request Timeout</title>
<style>
body {
font-family: Arial, sans-serif;
background-color: #f8f9fa;
color: #343a40;
text-align: center;
display: flex;
flex-direction: column;
justify-content: space-between;
min-height: 100vh;
margin: 0;
}
.container {
flex: 1;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
h1 {
font-size: 2.5em;
margin-bottom: 20px;
}
p {
font-size: 1.2em;
margin-bottom: 30px;
}
.footer {
font-size: 0.9em;
color: #6c757d;
position: fixed;
bottom: 0;
left: 0;
width: 100%;
background-color: #ffffff;
padding: 10px 0;
box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.1);
}
@media (max-width: 600px) {
h1 {
font-size: 2em;
}
p {
font-size: 1em;
}
}
</style>
</head>
<body>
<div class="container">
<h1>408 Request Timeout</h1>
<p>Oops! The server timed out waiting for the request.</p>
</div>
<div class="footer">
<p>
Why did the computer apply for a job as a referee? It was great at
calling "timeout"!
</p>
</div>
</body>
</html>

View File

@ -0,0 +1,73 @@
HTTP/1.1 409 Conflict
Cache-Control: no-cache
Connection: close
Content-Type: text/html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>409 Conflict</title>
<style>
body {
font-family: Arial, sans-serif;
background-color: #f8f9fa;
color: #343a40;
text-align: center;
display: flex;
flex-direction: column;
justify-content: space-between;
min-height: 100vh;
margin: 0;
}
.container {
flex: 1;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
h1 {
font-size: 2.5em;
margin-bottom: 20px;
}
p {
font-size: 1.2em;
margin-bottom: 30px;
}
.footer {
font-size: 0.9em;
color: #6c757d;
position: fixed;
bottom: 0;
left: 0;
width: 100%;
background-color: #ffffff;
padding: 10px 0;
box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.1);
}
@media (max-width: 600px) {
h1 {
font-size: 2em;
}
p {
font-size: 1em;
}
}
</style>
</head>
<body>
<div class="container">
<h1>409 Conflict</h1>
<p>Oops! There was a conflict with the current state of the resource.</p>
</div>
<div class="footer">
<p>
Why did the database refuse to go to therapy? It couldn't resolve its
"conflict" issues with the schema!
</p>
</div>
</body>
</html>

View File

@ -0,0 +1,75 @@
HTTP/1.1 410 Gone
Cache-Control: no-cache
Connection: close
Content-Type: text/html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>410 Gone</title>
<style>
body {
font-family: Arial, sans-serif;
background-color: #f8f9fa;
color: #343a40;
text-align: center;
display: flex;
flex-direction: column;
justify-content: space-between;
min-height: 100vh;
margin: 0;
}
.container {
flex: 1;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
h1 {
font-size: 2.5em;
margin-bottom: 20px;
}
p {
font-size: 1.2em;
margin-bottom: 30px;
}
.footer {
font-size: 0.9em;
color: #6c757d;
position: fixed;
bottom: 0;
left: 0;
width: 100%;
background-color: #ffffff;
padding: 10px 0;
box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.1);
}
@media (max-width: 600px) {
h1 {
font-size: 2em;
}
p {
font-size: 1em;
}
}
</style>
</head>
<body>
<div class="container">
<h1>410 Gone</h1>
<p>
Oops! The requested resource is no longer available and won't be back.
</p>
</div>
<div class="footer">
<p>
Why did the website file for divorce? It was tired of being "gone"
without any notice!
</p>
</div>
</body>
</html>

View File

@ -0,0 +1,73 @@
HTTP/1.1 500 Internal Server Error
Cache-Control: no-cache
Connection: close
Content-Type: text/html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>500 Internal Server Error</title>
<style>
body {
font-family: Arial, sans-serif;
background-color: #f8f9fa;
color: #343a40;
text-align: center;
display: flex;
flex-direction: column;
justify-content: space-between;
min-height: 100vh;
margin: 0;
}
.container {
flex: 1;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
h1 {
font-size: 2.5em;
margin-bottom: 20px;
}
p {
font-size: 1.2em;
margin-bottom: 30px;
}
.footer {
font-size: 0.9em;
color: #6c757d;
position: fixed;
bottom: 0;
left: 0;
width: 100%;
background-color: #ffffff;
padding: 10px 0;
box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.1);
}
@media (max-width: 600px) {
h1 {
font-size: 2em;
}
p {
font-size: 1em;
}
}
</style>
</head>
<body>
<div class="container">
<h1>500 Internal Server Error</h1>
<p>Oops! Something went wrong on the server.</p>
</div>
<div class="footer">
<p>
Why did the server go to therapy? It had too many internal issues it
couldn't resolve!
</p>
</div>
</body>
</html>

View File

@ -0,0 +1,76 @@
HTTP/1.1 501 Not Implemented
Cache-Control: no-cache
Connection: close
Content-Type: text/html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>501 Not Implemented</title>
<style>
body {
font-family: Arial, sans-serif;
background-color: #f8f9fa;
color: #343a40;
text-align: center;
display: flex;
flex-direction: column;
justify-content: space-between;
min-height: 100vh;
margin: 0;
}
.container {
flex: 1;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
h1 {
font-size: 2.5em;
margin-bottom: 20px;
}
p {
font-size: 1.2em;
margin-bottom: 30px;
}
.footer {
font-size: 0.9em;
color: #6c757d;
position: fixed;
bottom: 0;
left: 0;
width: 100%;
background-color: #ffffff;
padding: 10px 0;
box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.1);
}
@media (max-width: 600px) {
h1 {
font-size: 2em;
}
p {
font-size: 1em;
}
}
</style>
</head>
<body>
<div class="container">
<h1>501 Not Implemented</h1>
<p>
Oops! The server does not support the functionality required to fulfill
the request.
</p>
</div>
<div class="footer">
<p>
Why did the server break up with the developer? It couldn't implement
the changes requested!
</p>
</div>
</body>
</html>

View File

@ -0,0 +1,75 @@
HTTP/1.1 502 Bad Gateway
Cache-Control: no-cache
Connection: close
Content-Type: text/html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>502 Bad Gateway</title>
<style>
body {
font-family: Arial, sans-serif;
background-color: #f8f9fa;
color: #343a40;
text-align: center;
display: flex;
flex-direction: column;
justify-content: space-between;
min-height: 100vh;
margin: 0;
}
.container {
flex: 1;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
h1 {
font-size: 2.5em;
margin-bottom: 20px;
}
p {
font-size: 1.2em;
margin-bottom: 30px;
}
.footer {
font-size: 0.9em;
color: #6c757d;
position: fixed;
bottom: 0;
left: 0;
width: 100%;
background-color: #ffffff;
padding: 10px 0;
box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.1);
}
@media (max-width: 600px) {
h1 {
font-size: 2em;
}
p {
font-size: 1em;
}
}
</style>
</head>
<body>
<div class="container">
<h1>502 Bad Gateway</h1>
<p>
Oops! The server received an invalid response from an inbound server.
</p>
</div>
<div class="footer">
<p>
Why did the server go to counseling? It couldn't find a good gateway to
communicate!
</p>
</div>
</body>
</html>

View File

@ -0,0 +1,70 @@
HTTP/1.1 503 Service Unavailable
Cache-Control: no-cache
Connection: close
Content-Type: text/html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>503 Service Unavailable</title>
<style>
body {
font-family: Arial, sans-serif;
background-color: #f8f9fa;
color: #343a40;
text-align: center;
display: flex;
flex-direction: column;
justify-content: space-between;
min-height: 100vh;
margin: 0;
}
.container {
flex: 1;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
h1 {
font-size: 2.5em;
margin-bottom: 20px;
}
p {
font-size: 1.2em;
margin-bottom: 30px;
}
.footer {
font-size: 0.9em;
color: #6c757d;
position: fixed;
bottom: 0;
left: 0;
width: 100%;
background-color: #ffffff;
padding: 10px 0;
box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.1);
}
@media (max-width: 600px) {
h1 {
font-size: 2em;
}
p {
font-size: 1em;
}
}
</style>
</head>
<body>
<div class="container">
<h1>503 Service Unavailable</h1>
<p>Oops! The server is temporarily unable to handle the request.</p>
</div>
<div class="footer">
<p>Server status report: currently enjoying an extended coffee break!</p>
</div>
</body>
</html>

View File

@ -0,0 +1,76 @@
HTTP/1.1 504 Gateway Timeout
Cache-Control: no-cache
Connection: close
Content-Type: text/html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>504 Gateway Timeout</title>
<style>
body {
font-family: Arial, sans-serif;
background-color: #f8f9fa;
color: #343a40;
text-align: center;
display: flex;
flex-direction: column;
justify-content: space-between;
min-height: 100vh;
margin: 0;
}
.container {
flex: 1;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
h1 {
font-size: 2.5em;
margin-bottom: 20px;
}
p {
font-size: 1.2em;
margin-bottom: 30px;
}
.footer {
font-size: 0.9em;
color: #6c757d;
position: fixed;
bottom: 0;
left: 0;
width: 100%;
background-color: #ffffff;
padding: 10px 0;
box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.1);
}
@media (max-width: 600px) {
h1 {
font-size: 2em;
}
p {
font-size: 1em;
}
}
</style>
</head>
<body>
<div class="container">
<h1>504 Gateway Timeout</h1>
<p>
Oops! The server didn't receive a timely response from an upstream
server.
</p>
</div>
<div class="footer">
<p>
Server timeout: It's like waiting for a bus in a town with no schedule
you never know when it's coming!
</p>
</div>
</body>
</html>

View File

@ -0,0 +1,76 @@
HTTP/1.1 505 HTTP Version Not Supported
Cache-Control: no-cache
Connection: close
Content-Type: text/html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>505 HTTP Version Not Supported</title>
<style>
body {
font-family: Arial, sans-serif;
background-color: #f8f9fa;
color: #343a40;
text-align: center;
display: flex;
flex-direction: column;
justify-content: space-between;
min-height: 100vh;
margin: 0;
}
.container {
flex: 1;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
h1 {
font-size: 2.5em;
margin-bottom: 20px;
}
p {
font-size: 1.2em;
margin-bottom: 30px;
}
.footer {
font-size: 0.9em;
color: #6c757d;
position: fixed;
bottom: 0;
left: 0;
width: 100%;
background-color: #ffffff;
padding: 10px 0;
box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.1);
}
@media (max-width: 600px) {
h1 {
font-size: 2em;
}
p {
font-size: 1em;
}
}
</style>
</head>
<body>
<div class="container">
<h1>505 HTTP Version Not Supported</h1>
<p>
Oops! The server does not support the HTTP protocol version used in the
request.
</p>
</div>
<div class="footer">
<p>
Attempting to connect? It's like trying to use a VHS tape in a Blu-ray
player no support for the outdated format!
</p>
</div>
</body>
</html>

View File

@ -0,0 +1,73 @@
HTTP/1.1 400 Bad Request
Cache-Control: no-cache
Connection: close
Content-Type: text/html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>400 Bad Request</title>
<style>
body {
font-family: Arial, sans-serif;
background-color: #f8f9fa;
color: #343a40;
text-align: center;
display: flex;
flex-direction: column;
justify-content: space-between;
min-height: 100vh;
margin: 0;
}
.container {
flex: 1;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
h1 {
font-size: 2.5em;
margin-bottom: 20px;
}
p {
font-size: 1.2em;
margin-bottom: 30px;
}
.footer {
font-size: 0.9em;
color: #6c757d;
position: fixed;
bottom: 0;
left: 0;
width: 100%;
background-color: #ffffff;
padding: 10px 0;
box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.1);
}
@media (max-width: 600px) {
h1 {
font-size: 2em;
}
p {
font-size: 1em;
}
}
</style>
</head>
<body>
<div class="container">
<h1>400 Bad Request</h1>
<h2>Proxy Error</h2>
<p>Oops! Something went wrong with your request.</p>
</div>
<div class="footer">
<p>
Why did the server go broke? Because it couldn't process any requests!
</p>
</div>
</body>
</html>

View File

@ -0,0 +1,74 @@
HTTP/1.1 401 Unauthorized
Cache-Control: no-cache
Connection: close
Content-Type: text/html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>401 Unauthorized</title>
<style>
body {
font-family: Arial, sans-serif;
background-color: #f8f9fa;
color: #343a40;
text-align: center;
display: flex;
flex-direction: column;
justify-content: space-between;
min-height: 100vh;
margin: 0;
}
.container {
flex: 1;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
h1 {
font-size: 2.5em;
margin-bottom: 20px;
}
p {
font-size: 1.2em;
margin-bottom: 30px;
}
.footer {
font-size: 0.9em;
color: #6c757d;
position: fixed;
bottom: 0;
left: 0;
width: 100%;
background-color: #ffffff;
padding: 10px 0;
box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.1);
}
@media (max-width: 600px) {
h1 {
font-size: 2em;
}
p {
font-size: 1em;
}
}
</style>
</head>
<body>
<div class="container">
<h1>401 Unauthorized</h1>
<h2>Proxy Error</h2>
<p>Oops! Access is denied. You are not authorized to view this page.</p>
</div>
<div class="footer">
<p>
Why did the hacker break up with his computer? He found out it was
"encrypting" with someone else behind his back!
</p>
</div>
</body>
</html>

View File

@ -0,0 +1,74 @@
HTTP/1.1 402 Payment Required
Cache-Control: no-cache
Connection: close
Content-Type: text/html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>402 Payment Required</title>
<style>
body {
font-family: Arial, sans-serif;
background-color: #f8f9fa;
color: #343a40;
text-align: center;
display: flex;
flex-direction: column;
justify-content: space-between;
min-height: 100vh;
margin: 0;
}
.container {
flex: 1;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
h1 {
font-size: 2.5em;
margin-bottom: 20px;
}
p {
font-size: 1.2em;
margin-bottom: 30px;
}
.footer {
font-size: 0.9em;
color: #6c757d;
position: fixed;
bottom: 0;
left: 0;
width: 100%;
background-color: #ffffff;
padding: 10px 0;
box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.1);
}
@media (max-width: 600px) {
h1 {
font-size: 2em;
}
p {
font-size: 1em;
}
}
</style>
</head>
<body>
<div class="container">
<h1>402 Payment Required</h1>
<h2>Proxy Error</h2>
<p>Oops! You need to pay to access this resource.</p>
</div>
<div class="footer">
<p>
Why did the web developer always carry a credit card? To handle all
those "payment required" errors!
</p>
</div>
</body>
</html>

View File

@ -0,0 +1,74 @@
HTTP/1.1 403 Forbidden
Cache-Control: no-cache
Connection: close
Content-Type: text/html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>403 Forbidden</title>
<style>
body {
font-family: Arial, sans-serif;
background-color: #f8f9fa;
color: #343a40;
text-align: center;
display: flex;
flex-direction: column;
justify-content: space-between;
min-height: 100vh;
margin: 0;
}
.container {
flex: 1;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
h1 {
font-size: 2.5em;
margin-bottom: 20px;
}
p {
font-size: 1.2em;
margin-bottom: 30px;
}
.footer {
font-size: 0.9em;
color: #6c757d;
position: fixed;
bottom: 0;
left: 0;
width: 100%;
background-color: #ffffff;
padding: 10px 0;
box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.1);
}
@media (max-width: 600px) {
h1 {
font-size: 2em;
}
p {
font-size: 1em;
}
}
</style>
</head>
<body>
<div class="container">
<h1>403 Forbidden</h1>
<h2>Proxy Error</h2>
<p>Oops! Access to this resource is forbidden.</p>
</div>
<div class="footer">
<p>
Why did the computer get grounded? It kept accessing "forbidden"
websites when its parents weren't looking!
</p>
</div>
</body>
</html>

View File

@ -0,0 +1,74 @@
HTTP/1.1 404 Not Found
Cache-Control: no-cache
Connection: close
Content-Type: text/html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>404 Not Found</title>
<style>
body {
font-family: Arial, sans-serif;
background-color: #f8f9fa;
color: #343a40;
text-align: center;
display: flex;
flex-direction: column;
justify-content: space-between;
min-height: 100vh;
margin: 0;
}
.container {
flex: 1;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
h1 {
font-size: 2.5em;
margin-bottom: 20px;
}
p {
font-size: 1.2em;
margin-bottom: 30px;
}
.footer {
font-size: 0.9em;
color: #6c757d;
position: fixed;
bottom: 0;
left: 0;
width: 100%;
background-color: #ffffff;
padding: 10px 0;
box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.1);
}
@media (max-width: 600px) {
h1 {
font-size: 2em;
}
p {
font-size: 1em;
}
}
</style>
</head>
<body>
<div class="container">
<h1>404 Not Found</h1>
<h2>Proxy Error</h2>
<p>Oops! The page you are looking for could not be found.</p>
</div>
<div class="footer">
<p>
Why was the HTTP request so lonely? It kept getting "404 Not Found"
responses whenever it tried to connect!
</p>
</div>
</body>
</html>

View File

@ -0,0 +1,74 @@
HTTP/1.1 405 Method Not Allowed
Cache-Control: no-cache
Connection: close
Content-Type: text/html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>405 Method Not Allowed</title>
<style>
body {
font-family: Arial, sans-serif;
background-color: #f8f9fa;
color: #343a40;
text-align: center;
display: flex;
flex-direction: column;
justify-content: space-between;
min-height: 100vh;
margin: 0;
}
.container {
flex: 1;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
h1 {
font-size: 2.5em;
margin-bottom: 20px;
}
p {
font-size: 1.2em;
margin-bottom: 30px;
}
.footer {
font-size: 0.9em;
color: #6c757d;
position: fixed;
bottom: 0;
left: 0;
width: 100%;
background-color: #ffffff;
padding: 10px 0;
box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.1);
}
@media (max-width: 600px) {
h1 {
font-size: 2em;
}
p {
font-size: 1em;
}
}
</style>
</head>
<body>
<div class="container">
<h1>405 Method Not Allowed</h1>
<h2>Proxy Error</h2>
<p>Oops! The method you used is not allowed for this resource.</p>
</div>
<div class="footer">
<p>
Why did the developer break up with his Git repository? Because it had
too many "commits"ment issues!
</p>
</div>
</body>
</html>

View File

@ -0,0 +1,76 @@
HTTP/1.1 406 Not Acceptable
Cache-Control: no-cache
Connection: close
Content-Type: text/html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>406 Not Acceptable</title>
<style>
body {
font-family: Arial, sans-serif;
background-color: #f8f9fa;
color: #343a40;
text-align: center;
display: flex;
flex-direction: column;
justify-content: space-between;
min-height: 100vh;
margin: 0;
}
.container {
flex: 1;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
h1 {
font-size: 2.5em;
margin-bottom: 20px;
}
p {
font-size: 1.2em;
margin-bottom: 30px;
}
.footer {
font-size: 0.9em;
color: #6c757d;
position: fixed;
bottom: 0;
left: 0;
width: 100%;
background-color: #ffffff;
padding: 10px 0;
box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.1);
}
@media (max-width: 600px) {
h1 {
font-size: 2em;
}
p {
font-size: 1em;
}
}
</style>
</head>
<body>
<div class="container">
<h1>406 Not Acceptable</h1>
<h2>Proxy Error</h2>
<p>
Oops! The server cannot produce a response that the client will accept.
</p>
</div>
<div class="footer">
<p>
Why did the server break up with the client? They couldn't agree on
which language to speak!
</p>
</div>
</body>
</html>

View File

@ -0,0 +1,74 @@
HTTP/1.1 407 Proxy Authentication Required
Cache-Control: no-cache
Connection: close
Content-Type: text/html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>407 Proxy Authentication Required</title>
<style>
body {
font-family: Arial, sans-serif;
background-color: #f8f9fa;
color: #343a40;
text-align: center;
display: flex;
flex-direction: column;
justify-content: space-between;
min-height: 100vh;
margin: 0;
}
.container {
flex: 1;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
h1 {
font-size: 2.5em;
margin-bottom: 20px;
}
p {
font-size: 1.2em;
margin-bottom: 30px;
}
.footer {
font-size: 0.9em;
color: #6c757d;
position: fixed;
bottom: 0;
left: 0;
width: 100%;
background-color: #ffffff;
padding: 10px 0;
box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.1);
}
@media (max-width: 600px) {
h1 {
font-size: 2em;
}
p {
font-size: 1em;
}
}
</style>
</head>
<body>
<div class="container">
<h1>407 Proxy Authentication Required</h1>
<h2>Proxy Error</h2>
<p>Oops! Proxy authentication is required to access this resource.</p>
</div>
<div class="footer">
<p>
Why was the proxy server so shy? It kept asking for authentication
before making friends!
</p>
</div>
</body>
</html>

View File

@ -0,0 +1,74 @@
HTTP/1.1 408 Request Timeout
Cache-Control: no-cache
Connection: close
Content-Type: text/html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>408 Request Timeout</title>
<style>
body {
font-family: Arial, sans-serif;
background-color: #f8f9fa;
color: #343a40;
text-align: center;
display: flex;
flex-direction: column;
justify-content: space-between;
min-height: 100vh;
margin: 0;
}
.container {
flex: 1;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
h1 {
font-size: 2.5em;
margin-bottom: 20px;
}
p {
font-size: 1.2em;
margin-bottom: 30px;
}
.footer {
font-size: 0.9em;
color: #6c757d;
position: fixed;
bottom: 0;
left: 0;
width: 100%;
background-color: #ffffff;
padding: 10px 0;
box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.1);
}
@media (max-width: 600px) {
h1 {
font-size: 2em;
}
p {
font-size: 1em;
}
}
</style>
</head>
<body>
<div class="container">
<h1>408 Request Timeout</h1>
<h2>Proxy Error</h2>
<p>Oops! The server timed out waiting for the request.</p>
</div>
<div class="footer">
<p>
Why did the computer apply for a job as a referee? It was great at
calling "timeout"!
</p>
</div>
</body>
</html>

View File

@ -0,0 +1,74 @@
HTTP/1.1 409 Conflict
Cache-Control: no-cache
Connection: close
Content-Type: text/html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>409 Conflict</title>
<style>
body {
font-family: Arial, sans-serif;
background-color: #f8f9fa;
color: #343a40;
text-align: center;
display: flex;
flex-direction: column;
justify-content: space-between;
min-height: 100vh;
margin: 0;
}
.container {
flex: 1;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
h1 {
font-size: 2.5em;
margin-bottom: 20px;
}
p {
font-size: 1.2em;
margin-bottom: 30px;
}
.footer {
font-size: 0.9em;
color: #6c757d;
position: fixed;
bottom: 0;
left: 0;
width: 100%;
background-color: #ffffff;
padding: 10px 0;
box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.1);
}
@media (max-width: 600px) {
h1 {
font-size: 2em;
}
p {
font-size: 1em;
}
}
</style>
</head>
<body>
<div class="container">
<h1>409 Conflict</h1>
<h2>Proxy Error</h2>
<p>Oops! There was a conflict with the current state of the resource.</p>
</div>
<div class="footer">
<p>
Why did the database refuse to go to therapy? It couldn't resolve its
"conflict" issues with the schema!
</p>
</div>
</body>
</html>

View File

@ -0,0 +1,76 @@
HTTP/1.1 410 Gone
Cache-Control: no-cache
Connection: close
Content-Type: text/html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>410 Gone</title>
<style>
body {
font-family: Arial, sans-serif;
background-color: #f8f9fa;
color: #343a40;
text-align: center;
display: flex;
flex-direction: column;
justify-content: space-between;
min-height: 100vh;
margin: 0;
}
.container {
flex: 1;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
h1 {
font-size: 2.5em;
margin-bottom: 20px;
}
p {
font-size: 1.2em;
margin-bottom: 30px;
}
.footer {
font-size: 0.9em;
color: #6c757d;
position: fixed;
bottom: 0;
left: 0;
width: 100%;
background-color: #ffffff;
padding: 10px 0;
box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.1);
}
@media (max-width: 600px) {
h1 {
font-size: 2em;
}
p {
font-size: 1em;
}
}
</style>
</head>
<body>
<div class="container">
<h1>410 Gone</h1>
<h2>Proxy Error</h2>
<p>
Oops! The requested resource is no longer available and won't be back.
</p>
</div>
<div class="footer">
<p>
Why did the website file for divorce? It was tired of being "gone"
without any notice!
</p>
</div>
</body>
</html>

View File

@ -0,0 +1,74 @@
HTTP/1.1 500 Internal Server Error
Cache-Control: no-cache
Connection: close
Content-Type: text/html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>500 Internal Server Error</title>
<style>
body {
font-family: Arial, sans-serif;
background-color: #f8f9fa;
color: #343a40;
text-align: center;
display: flex;
flex-direction: column;
justify-content: space-between;
min-height: 100vh;
margin: 0;
}
.container {
flex: 1;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
h1 {
font-size: 2.5em;
margin-bottom: 20px;
}
p {
font-size: 1.2em;
margin-bottom: 30px;
}
.footer {
font-size: 0.9em;
color: #6c757d;
position: fixed;
bottom: 0;
left: 0;
width: 100%;
background-color: #ffffff;
padding: 10px 0;
box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.1);
}
@media (max-width: 600px) {
h1 {
font-size: 2em;
}
p {
font-size: 1em;
}
}
</style>
</head>
<body>
<div class="container">
<h1>500 Internal Server Error</h1>
<h2>Proxy Error</h2>
<p>Oops! Something went wrong on the server.</p>
</div>
<div class="footer">
<p>
Why did the server go to therapy? It had too many internal issues it
couldn't resolve!
</p>
</div>
</body>
</html>

View File

@ -0,0 +1,77 @@
HTTP/1.1 501 Not Implemented
Cache-Control: no-cache
Connection: close
Content-Type: text/html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>501 Not Implemented</title>
<style>
body {
font-family: Arial, sans-serif;
background-color: #f8f9fa;
color: #343a40;
text-align: center;
display: flex;
flex-direction: column;
justify-content: space-between;
min-height: 100vh;
margin: 0;
}
.container {
flex: 1;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
h1 {
font-size: 2.5em;
margin-bottom: 20px;
}
p {
font-size: 1.2em;
margin-bottom: 30px;
}
.footer {
font-size: 0.9em;
color: #6c757d;
position: fixed;
bottom: 0;
left: 0;
width: 100%;
background-color: #ffffff;
padding: 10px 0;
box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.1);
}
@media (max-width: 600px) {
h1 {
font-size: 2em;
}
p {
font-size: 1em;
}
}
</style>
</head>
<body>
<div class="container">
<h1>501 Not Implemented</h1>
<h2>Proxy Error</h2>
<p>
Oops! The server does not support the functionality required to fulfill
the request.
</p>
</div>
<div class="footer">
<p>
Why did the server break up with the developer? It couldn't implement
the changes requested!
</p>
</div>
</body>
</html>

View File

@ -0,0 +1,76 @@
HTTP/1.1 502 Bad Gateway
Cache-Control: no-cache
Connection: close
Content-Type: text/html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>502 Bad Gateway</title>
<style>
body {
font-family: Arial, sans-serif;
background-color: #f8f9fa;
color: #343a40;
text-align: center;
display: flex;
flex-direction: column;
justify-content: space-between;
min-height: 100vh;
margin: 0;
}
.container {
flex: 1;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
h1 {
font-size: 2.5em;
margin-bottom: 20px;
}
p {
font-size: 1.2em;
margin-bottom: 30px;
}
.footer {
font-size: 0.9em;
color: #6c757d;
position: fixed;
bottom: 0;
left: 0;
width: 100%;
background-color: #ffffff;
padding: 10px 0;
box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.1);
}
@media (max-width: 600px) {
h1 {
font-size: 2em;
}
p {
font-size: 1em;
}
}
</style>
</head>
<body>
<div class="container">
<h1>502 Bad Gateway</h1>
<h2>Proxy Error</h2>
<p>
Oops! The server received an invalid response from an inbound server.
</p>
</div>
<div class="footer">
<p>
Why did the server go to counseling? It couldn't find a good gateway to
communicate!
</p>
</div>
</body>
</html>

View File

@ -0,0 +1,71 @@
HTTP/1.1 503 Service Unavailable
Cache-Control: no-cache
Connection: close
Content-Type: text/html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>503 Service Unavailable</title>
<style>
body {
font-family: Arial, sans-serif;
background-color: #f8f9fa;
color: #343a40;
text-align: center;
display: flex;
flex-direction: column;
justify-content: space-between;
min-height: 100vh;
margin: 0;
}
.container {
flex: 1;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
h1 {
font-size: 2.5em;
margin-bottom: 20px;
}
p {
font-size: 1.2em;
margin-bottom: 30px;
}
.footer {
font-size: 0.9em;
color: #6c757d;
position: fixed;
bottom: 0;
left: 0;
width: 100%;
background-color: #ffffff;
padding: 10px 0;
box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.1);
}
@media (max-width: 600px) {
h1 {
font-size: 2em;
}
p {
font-size: 1em;
}
}
</style>
</head>
<body>
<div class="container">
<h1>503 Service Unavailable</h1>
<h2>Proxy Error</h2>
<p>Oops! The server is temporarily unable to handle the request.</p>
</div>
<div class="footer">
<p>Server status report: currently enjoying an extended coffee break!</p>
</div>
</body>
</html>

View File

@ -0,0 +1,77 @@
HTTP/1.1 504 Gateway Timeout
Cache-Control: no-cache
Connection: close
Content-Type: text/html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>504 Gateway Timeout</title>
<style>
body {
font-family: Arial, sans-serif;
background-color: #f8f9fa;
color: #343a40;
text-align: center;
display: flex;
flex-direction: column;
justify-content: space-between;
min-height: 100vh;
margin: 0;
}
.container {
flex: 1;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
h1 {
font-size: 2.5em;
margin-bottom: 20px;
}
p {
font-size: 1.2em;
margin-bottom: 30px;
}
.footer {
font-size: 0.9em;
color: #6c757d;
position: fixed;
bottom: 0;
left: 0;
width: 100%;
background-color: #ffffff;
padding: 10px 0;
box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.1);
}
@media (max-width: 600px) {
h1 {
font-size: 2em;
}
p {
font-size: 1em;
}
}
</style>
</head>
<body>
<div class="container">
<h1>504 Gateway Timeout</h1>
<h2>Proxy Error</h2>
<p>
Oops! The server didn't receive a timely response from an upstream
server.
</p>
</div>
<div class="footer">
<p>
Server timeout: It's like waiting for a bus in a town with no schedule
you never know when it's coming!
</p>
</div>
</body>
</html>

View File

@ -0,0 +1,77 @@
HTTP/1.1 505 HTTP Version Not Supported
Cache-Control: no-cache
Connection: close
Content-Type: text/html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>505 HTTP Version Not Supported</title>
<style>
body {
font-family: Arial, sans-serif;
background-color: #f8f9fa;
color: #343a40;
text-align: center;
display: flex;
flex-direction: column;
justify-content: space-between;
min-height: 100vh;
margin: 0;
}
.container {
flex: 1;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
h1 {
font-size: 2.5em;
margin-bottom: 20px;
}
p {
font-size: 1.2em;
margin-bottom: 30px;
}
.footer {
font-size: 0.9em;
color: #6c757d;
position: fixed;
bottom: 0;
left: 0;
width: 100%;
background-color: #ffffff;
padding: 10px 0;
box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.1);
}
@media (max-width: 600px) {
h1 {
font-size: 2em;
}
p {
font-size: 1em;
}
}
</style>
</head>
<body>
<div class="container">
<h1>505 HTTP Version Not Supported</h1>
<h2>Proxy Error</h2>
<p>
Oops! The server does not support the HTTP protocol version used in the
request.
</p>
</div>
<div class="footer">
<p>
Attempting to connect? It's like trying to use a VHS tape in a Blu-ray
player no support for the outdated format!
</p>
</div>
</body>
</html>