mirror of
https://github.com/tarampampam/error-pages.git
synced 2024-08-30 18:22:40 +00:00
187 lines
11 KiB
HTML
187 lines
11 KiB
HTML
|
<!DOCTYPE html>
|
||
|
<!--
|
||
|
Error 403: Forbidden
|
||
|
Description: Access is forbidden to the requested page
|
||
|
-->
|
||
|
<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>Forbidden</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/403.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='%2376c3c3'/%3E%3Cstop offset='100%25' stop-color='%23183468'/%3E%3C/linearGradient%3E%3ClinearGradient id='B' x1='100%25' x2='0%25' y1='50%25' y2='50%25'%3E%3Cstop offset='0%25' stop-color='%23486587'/%3E%3Cstop offset='33.23%25' stop-color='%23183352'/%3E%3Cstop offset='66.67%25' stop-color='%23264a6e'/%3E%3Cstop offset='100%25' stop-color='%23183352'/%3E%3C/linearGradient%3E%3ClinearGradient id='C' x1='49.87%25' x2='48.5%25' y1='3.62%25' y2='100%25'%3E%3Cstop offset='0%25' stop-color='%23e0f2fa'/%3E%3Cstop offset='8.98%25' stop-color='%2389bed6'/%3E%3Cstop offset='32.98%25' stop-color='%231e3c6e'/%3E%3Cstop offset='100%25' stop-color='%231b376b'/%3E%3C/linearGradient%3E%3ClinearGradient id='D' 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='E' x1='91.59%25' x2='66.97%25' y1='5.89%25' y2='100%25'%3E%3Cstop offset='0%25' stop-color='%231d3a6d'/%3E%3Cstop offset='100%25' stop-color='%23467994'/%3E%3C/linearGradient%3E%3ClinearGradient id='F' x1='97.27%25' x2='52.53%25' y1='6.88%25' y2='100%25'%3E%3Cstop offset='0%25' stop-color='%231d3a6d'/%3E%3Cstop offset='100%25' stop-color='%23467994'/%3E%3C/linearGradient%3E%3ClinearGradient id='G' x1='82.73%25' x2='41.46%25' y1='41.06%25' y2='167.23%25'%3E%3Cstop offset='0%25' stop-color='%231d3a6d'/%3E%3Cstop offset='100%25' stop-color='%23467994'/%3E%3C/linearGradient%3E%3ClinearGradient id='H' x1='49.87%25' x2='49.87%25' y1='3.62%25' y2='100.77%25'%3E%3Cstop offset='0%25' stop-color='%23b0ddf1'/%3E%3Cstop offset='100%25' stop-color='%23325c82'/%3E%3C/linearGradient%3E%3ClinearGradient id='I' 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='J' x1='100%25' x2='62.1%25' y1='0%25' y2='68.86%25'%3E%3Cstop offset='0%25' stop-color='%23163055'/%3E%3Cstop offset='100%25' stop-color='%232f587f'/%3E%3C/linearGradient%3E%3Ccircle id='K' cx='180' cy='102' r='40'/%3E%3Cfilter id='L' width='340%25' height='340%25' x='-120%25' y='-120%25'%3E%3CfeOffset in='SourceAlpha'/%3E%3CfeGaussianBlur stdDeviation='32'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.696473053 0'/%3E%3C/filter%3E%3ClinearGradient id='M' x1='0%25' y1='50%25' y2='50%25'%3E%3Cstop offset='0%25' stop-color='%23fff' stop-opacity='0'/%3E%3Cstop offset='100%25' stop-color='%23fff'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cpath fill='url(%23A)' d='M0 0h1024v1024H0z'/%3E%3Cpath d='M857 508l4-1v11h-4zm-20-4l4-1v15h-4z' fill='%238dbcd2'/%3E%3Cg fill='%23183352'%3E%3Cpath d='M801 503l4 1v14h-4zm-20 4l4 1v14h-4z'/%3E%3Cpath opacity='.5' d='M820 481h2v20h-2z'/%3E%3C/g%3E%3Cpath fill='url(%23B)' d='M61 0c3 0 3 2 6 2s3-2 6-2 3 2 6 2v8c-3 0-3-2-6-2s-3 2-6 2-3-2-6-2V0z' transform='translate(761 481)'/%3E%3Cpath fill='%238dbcd2' d='M811 501l10-2v110h-60l10-100 10-2v10.92l10-.98V505l10-2v12.96l10-.98V501z'/%3E%3Cpath fill='%23183352' d='M861 507l10 2 10 100h-60V499l10 2v13.98l10 .98V503l10 2v11.94l10 .98V507z'/%3E%3Cg transform='translate(0 565)'%3E%3Cpath fill='url(%23C)' d='M1024 385H0V106.86c118.4 21.09 185.14 57.03 327.4 48.14 198.54-12.4 250-125 500-125 90.18 0 147.92 16.3 196.6 37.12V385z'/%3E%3Cg fill='url(%23D)'%3E%3Cpath d='M1024 355H0V79.56C76.46 43.81 137.14 0 285 0c250 0 301.46 112.6 500 125 103.24 6.45 166.7-10.7 239-28.66V355z'/%3E%3Cpath d='M344.12 130.57C367.22 144.04 318.85 212.52 199 336h649L344.12 130.57z'/%3E%3C/g%3E%3Cpath fill='url(%23E)' d='M0 336V79.56C76.46 43.81 137.14 0 285 0c71.14 0 86.22 26.04 32.5 82-48 50 147.33 58.02 36 136.5-40.67 28.67 21.17 67.83 185.5 117.5H0z'/%3E%3Cpath fill='url(%23F)' d='M317.5
|
||
|
/* */
|
||
|
}
|
||
|
|
||
|
/* */
|
||
|
|
||
|
@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">403</div>
|
||
|
<div class="space"></div>
|
||
|
<p class="description" data-l10n>Access is forbidden to the requested page</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 403: Forbidden
|
||
|
Description: Access is forbidden to the requested page
|
||
|
-->
|
||
|
</html>
|