mirror of
https://github.com/tarampampam/error-pages.git
synced 2024-08-30 18:22:40 +00:00
187 lines
20 KiB
HTML
187 lines
20 KiB
HTML
|
<!DOCTYPE html>
|
||
|
|
<!--
|
||
|
|
Error 500: Internal Server Error
|
||
|
|
Description: The server met an unexpected condition
|
||
|
|
-->
|
||
|
|
<html lang="en">
|
||
|
|
<head>
|
||
|
|
<meta charset="utf-8">
|
||
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||
|
|
<meta name="robots" content="noindex, nofollow"/>
|
||
|
|
<link rel="preconnect" href="https://fonts.bunny.net" crossorigin>
|
||
|
|
<link rel="dns-prefetch" href="https://fonts.bunny.net">
|
||
|
|
<link href="https://fonts.bunny.net/css?family=Nunito&display=swap" rel="stylesheet">
|
||
|
|
<title>Internal Server Error</title>
|
||
|
|
<style>
|
||
|
|
:root {
|
||
|
|
--color-bg-primary: #fff;
|
||
|
|
--color-text-primary: #22292f;
|
||
|
|
--color-text-secondary: #606f7b;
|
||
|
|
}
|
||
|
|
|
||
|
|
@media (prefers-color-scheme: dark) {
|
||
|
|
:root {
|
||
|
|
--color-bg-primary: #212121;
|
||
|
|
--color-text-primary: #fafafa;
|
||
|
|
--color-text-secondary: #9db6cb;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
html, body {
|
||
|
|
height: 100%;
|
||
|
|
line-height: 1.15;
|
||
|
|
text-size-adjust: 100%;
|
||
|
|
box-sizing: border-box;
|
||
|
|
font-family: Nunito, sans-serif;
|
||
|
|
-webkit-font-smoothing: antialiased;
|
||
|
|
-moz-osx-font-smoothing: grayscale;
|
||
|
|
margin: 0;
|
||
|
|
padding: 0;
|
||
|
|
background-color: var(--color-bg-primary);
|
||
|
|
}
|
||
|
|
|
||
|
|
*,
|
||
|
|
*::before,
|
||
|
|
*::after {
|
||
|
|
box-sizing: inherit;
|
||
|
|
border-style: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
p {
|
||
|
|
margin: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
main {
|
||
|
|
display: flex;
|
||
|
|
flex-direction: column;
|
||
|
|
height: 100vh;
|
||
|
|
}
|
||
|
|
|
||
|
|
main .left, main .right {
|
||
|
|
width: 100%;
|
||
|
|
}
|
||
|
|
|
||
|
|
main .left .container {
|
||
|
|
max-width: 30rem;
|
||
|
|
margin: 2rem;
|
||
|
|
}
|
||
|
|
|
||
|
|
main .left .container .code {
|
||
|
|
color: var(--color-text-primary);
|
||
|
|
font-size: 3rem;
|
||
|
|
font-weight: 900;
|
||
|
|
}
|
||
|
|
|
||
|
|
main .left .container .space {
|
||
|
|
width: 4rem;
|
||
|
|
height: .25rem;
|
||
|
|
background-color: #a779e9;
|
||
|
|
margin-top: .75rem;
|
||
|
|
margin-bottom: .75rem;
|
||
|
|
}
|
||
|
|
|
||
|
|
main .left .container .description {
|
||
|
|
color: var(--color-text-secondary);
|
||
|
|
font-size: 1.5rem;
|
||
|
|
margin-bottom: 2rem;
|
||
|
|
}
|
||
|
|
|
||
|
|
main .right {
|
||
|
|
height: 100%;
|
||
|
|
}
|
||
|
|
|
||
|
|
main .right .container {
|
||
|
|
width: 100%;
|
||
|
|
height: 100%;
|
||
|
|
background-size: cover;
|
||
|
|
background-repeat: no-repeat;
|
||
|
|
/* */
|
||
|
|
/* https://github.com/LaravelCollective/errors/blob/8a0cf6fb73ba0041330967d3d6a137bd4509f7bd/src/publish/svg/500.svg */
|
||
|
|
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' viewBox='0 0 1024 1024'%3E%3Cdefs%3E%3ClinearGradient id='a' x1='50%25' x2='50%25' y1='100%25' y2='0%25'%3E%3Cstop offset='0%25' stop-color='%23F6EDAE'/%3E%3Cstop offset='100%25' stop-color='%2391D4D7'/%3E%3C/linearGradient%3E%3ClinearGradient id='b' x1='49.87%25' x2='49.87%25' y1='3.62%25' y2='77.75%25'%3E%3Cstop offset='0%25' stop-color='%23B0DDF1'/%3E%3Cstop offset='100%25' stop-color='%23325C82'/%3E%3C/linearGradient%3E%3ClinearGradient id='c' x1='100%25' x2='72.45%25' y1='0%25' y2='85.2%25'%3E%3Cstop offset='0%25' stop-color='%231D3A6D'/%3E%3Cstop offset='100%25' stop-color='%23467994'/%3E%3C/linearGradient%3E%3ClinearGradient id='d' x1='54.81%25' x2='50%25' y1='-18.48%25' y2='59.98%25'%3E%3Cstop offset='0%25' stop-color='%23FFFFFF'/%3E%3Cstop offset='28.15%25' stop-color='%23F8E6B3'/%3E%3Cstop offset='100%25' stop-color='%23D5812F'/%3E%3C/linearGradient%3E%3ClinearGradient id='e' x1='52.84%25' x2='49.87%25' y1='2.8%25' y2='77.75%25'%3E%3Cstop offset='0%25' stop-color='%23FFFFFF'/%3E%3Cstop offset='22.15%25' stop-color='%23F8E6B3'/%3E%3Cstop offset='100%25' stop-color='%23F9D989'/%3E%3C/linearGradient%3E%3ClinearGradient id='f' x1='91.59%25' x2='66.97%25' y1='5.89%25' y2='100%25'%3E%3Cstop offset='0%25' stop-color='%23CE4014'/%3E%3Cstop offset='100%25' stop-color='%23FFD56E'/%3E%3C/linearGradient%3E%3ClinearGradient id='g' x1='40.28%25' x2='66.37%25' y1='30.88%25' y2='108.51%25'%3E%3Cstop offset='0%25' stop-color='%23A2491E'/%3E%3Cstop offset='100%25' stop-color='%23F4B35A'/%3E%3C/linearGradient%3E%3Ccircle id='i' cx='825' cy='235' r='70'/%3E%3Cfilter id='h' width='237.1%25' height='237.1%25' x='-68.6%25' y='-68.6%25' filterUnits='objectBoundingBox'%3E%3CfeOffset in='SourceAlpha' result='shadowOffsetOuter1'/%3E%3CfeGaussianBlur in='shadowOffsetOuter1' result='shadowBlurOuter1' stdDeviation='32'/%3E%3CfeColorMatrix in='shadowBlurOuter1' values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 1 0'/%3E%3C/filter%3E%3ClinearGradient id='j' x1='50%25' x2='50%25' y1='0%25' y2='100%25'%3E%3Cstop offset='0%25' stop-color='%23B29959'/%3E%3Cstop offset='100%25' stop-color='%23CEAD5B'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Crect width='1024' height='1024' fill='url(%23a)'/%3E%3Cpath fill='%23FFFFFF' d='M1024 378.13v39.37H790a71.59 71.59 0 0 1 21.14-50.8l1.36-1.34a31.93 31.93 0 0 1 45 0 31.93 31.93 0 0 0 45 0l15-14.9a53.21 53.21 0 0 1 75 0l22.5 22.35a21.2 21.2 0 0 0 9 5.32z' opacity='.15'/%3E%3Cg transform='translate(26 245)'%3E%3Cpath fill='url(%23b)' d='M289.12 450.57C312.22 464.04 263.85 532.52 144 656h649C448.94 514.3 280.98 445.83 289.12 450.57z'/%3E%3Cpath fill='url(%23c)' d='M262.5 402c-48 50 147.33 58.02 36 136.5-40.67 28.67 21.17 67.83 185.5 117.5H0l262.5-254z'/%3E%3Cpath fill='url(%23c)' d='M298.5 538.5C257.83 567.17 319.67 606.33 484 656H120l178.5-117.5z'/%3E%3C/g%3E%3Cpath fill='%23134F4E' d='M783 593.73a29.95 29.95 0 0 1-12-24c0-9.8 4.72-18.52 12-24-5.02 6.69-8 15-8 24 0 9.01 2.98 17.32 8 24z'/%3E%3Cg fill='%23134F4E' transform='matrix(-1 0 0 1 876 532)'%3E%3Cpath d='M24 66.73a29.95 29.95 0 0 1-12-24c0-9.8 4.72-18.52 12-24-5.02 6.69-8 15-8 24 0 9.01 2.98 17.32 8 24z'/%3E%3Cpath d='M36 22.4l-3.96-3.98a5 5 0 0 0-6.5-.5 3 3 0 0 1 3.7-3.55l8.7 2.33a8 8 0 0 1 5.66 9.8l-1-1.73a2 2 0 0 0-1.21-.93L36 22.4zm-5.38-2.56L37 26.2a8 8 0 0 1 0 11.32v-2a2 2 0 0 0-.6-1.42L26.39 24.08a3 3 0 0 1 4.24-4.24zM14.21 9.8l-3.94-3.94a2 2 0 0 0-1.42-.59h-2a8 8 0 0 1 11.32 0l6.36 6.37a3 3 0 0 1-1.22 4.98 5 5 0 0 0-3.68-5.37l-5.42-1.45zm4.9 3.39a3 3 0 1 1-1.55 5.8L3.87 15.31a2 2 0 0 0-1.52.2l-1.73 1a8 8 0 0 1 9.8-5.65l8.7 2.33z'/%3E%3C/g%3E%3Cg transform='translate(0 245)'%3E%3Cpath fill='url(%23d)' d='M1024 423.16V645H58.09c-32.12-75.17-32.12-123.84 0-146 48.17-33.24 127.17-64.25 293.33-64 166.17.25 246.67-105 413.33-105 117.33 0 183.93 55.8 259.25 93.16z'/%3E%3Cpath fill='url(%23e)' d='M1024 778H0V398.62C75.53 363.05 136.43 320 283 320c111.86 0 358.86 69.82 741 209.47V778z'/%3E%3Cpath
|
||
|
|
/* */
|
||
|
|
}
|
||
|
|
|
||
|
|
/* */
|
||
|
|
|
||
|
|
@media (min-width: 768px) {
|
||
|
|
main {
|
||
|
|
flex-direction: row;
|
||
|
|
}
|
||
|
|
|
||
|
|
main .left, main .right {
|
||
|
|
width: 50%;
|
||
|
|
}
|
||
|
|
|
||
|
|
main .left {
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
justify-content: center;
|
||
|
|
}
|
||
|
|
|
||
|
|
main .left .container .code {
|
||
|
|
font-size: 9rem;
|
||
|
|
}
|
||
|
|
|
||
|
|
main .left .container .space {
|
||
|
|
margin-top: 1.5rem;
|
||
|
|
margin-bottom: 1.5rem;
|
||
|
|
}
|
||
|
|
|
||
|
|
main .left .container .description {
|
||
|
|
font-size: 1.875rem;
|
||
|
|
font-weight: 300;
|
||
|
|
line-height: 1.5;
|
||
|
|
}
|
||
|
|
|
||
|
|
main .right {
|
||
|
|
display: flex;
|
||
|
|
padding-bottom: 0;
|
||
|
|
min-height: 100vh;
|
||
|
|
}
|
||
|
|
|
||
|
|
main .right .container {
|
||
|
|
background-position: left;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
@media (min-width: 992px) {
|
||
|
|
main .right .container {
|
||
|
|
background-position: center;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</style>
|
||
|
|
</head>
|
||
|
|
<body>
|
||
|
|
<main>
|
||
|
|
<div class="left">
|
||
|
|
<div class="container">
|
||
|
|
<div class="code">500</div>
|
||
|
|
<div class="space"></div>
|
||
|
|
<p class="description" data-l10n>The server met an unexpected condition</p>
|
||
|
|
<!-- -->
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="right">
|
||
|
|
<div class="container"></div>
|
||
|
|
</div>
|
||
|
|
</main>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
//
|
||
|
|
if (navigator.language.substring(0, 2).toLowerCase() !== 'en') {
|
||
|
|
((s, p) => { // localize the page (details here - https://github.com/tarampampam/error-pages/tree/master/l10n)
|
||
|
|
s.src = 'https://cdn.jsdelivr.net/gh/tarampampam/error-pages@2/l10n/l10n.min.js'; // '../l10n/l10n.js';
|
||
|
|
s.async = s.defer = true;
|
||
|
|
s.addEventListener('load', () => p.removeChild(s));
|
||
|
|
p.appendChild(s);
|
||
|
|
})(document.createElement('script'), document.body);
|
||
|
|
}
|
||
|
|
//
|
||
|
|
</script>
|
||
|
|
</body>
|
||
|
|
<!--
|
||
|
|
Error 500: Internal Server Error
|
||
|
|
Description: The server met an unexpected condition
|
||
|
|
-->
|
||
|
|
</html>
|