|
1 | | -<!DOCTYPE html> |
| 1 | +<!doctype html> |
2 | 2 | <html lang="en"> |
3 | | -<head> |
4 | | -<meta charset="UTF-8" /> |
5 | | -<title>403 Forbidden — No Entry</title> |
6 | | -<style> |
7 | | - :root { |
8 | | - --bg-color: #b8b8b8; |
9 | | - --main-font: arial, sans-serif; |
10 | | - --main-text-color: black; |
11 | | - --button-bg-color: #e0e0e0; |
12 | | - --button-text-color: #696969; |
13 | | - --button-hover-bg-color: #f2f2f2; |
14 | | - --border-radius: 3px; |
15 | | - --connection-status-error-color: #9e0000; |
16 | | - } |
| 3 | + <head> |
| 4 | + <title>403 Forbidden - No Entry</title> |
| 5 | + </head> |
| 6 | + <body> |
| 7 | + <style> |
| 8 | + body { |
| 9 | + background: #b8b8b8; |
| 10 | + color: black; |
| 11 | + font-family: arial; |
| 12 | + } |
17 | 13 |
|
18 | | - body { |
19 | | - background-color: var(--bg-color); |
20 | | - font-family: var(--main-font); |
21 | | - color: var(--main-text-color); |
22 | | - margin: 0; |
23 | | - height: 100vh; |
24 | | - display: flex; |
25 | | - justify-content: center; |
26 | | - align-items: center; |
27 | | - user-select: none; |
28 | | - } |
| 14 | + .centeredDialog { |
| 15 | + position: fixed; |
| 16 | + top: 50%; |
| 17 | + left: 50%; |
| 18 | + transform: translate(-50%, -50%); |
| 19 | + background: #ffffff; |
| 20 | + border-radius: 10px; |
| 21 | + box-shadow: 0 0px 30px black; |
| 22 | + padding: 15px 15px; |
| 23 | + } |
29 | 24 |
|
30 | | - .container { |
31 | | - background: var(--button-bg-color); |
32 | | - border-radius: var(--border-radius); |
33 | | - padding: 30px 40px; |
34 | | - max-width: 420px; |
35 | | - box-shadow: 0 0 15px rgba(0,0,0,0.1); |
36 | | - text-align: center; |
37 | | - } |
| 25 | + .sep1 { |
| 26 | + border-top: 3px dashed #696969; |
| 27 | + padding: 5px 20px; |
| 28 | + outline: none; |
| 29 | + } |
38 | 30 |
|
39 | | - h1 { |
40 | | - margin: 0 0 12px 0; |
41 | | - font-size: 36px; |
42 | | - font-weight: 700; |
43 | | - color: var(--connection-status-error-color); |
44 | | - letter-spacing: 1px; |
45 | | - } |
| 31 | + .header { |
| 32 | + font-weight: bold; |
| 33 | + font-size: 35px; |
| 34 | + padding: 3px 3px; |
| 35 | + } |
46 | 36 |
|
47 | | - p { |
48 | | - margin: 0 0 16px 0; |
49 | | - font-size: 17px; |
50 | | - line-height: 1.4; |
51 | | - color: #4a4a4a; |
52 | | - } |
| 37 | + .small { |
| 38 | + font-size: 10px; |
| 39 | + } |
53 | 40 |
|
54 | | - .hint { |
55 | | - font-style: italic; |
56 | | - font-size: 14px; |
57 | | - color: #696969; |
58 | | - } |
59 | | -</style> |
60 | | -</head> |
61 | | -<body> |
62 | | - <div class="container"> |
63 | | - <h1>403 Forbidden</h1> |
64 | | - <p>Uh-oh, you don’t have permission to see this.<br>Maybe try logging in, or just chill somewhere else for now.</p> |
65 | | - <div class="hint">Access denied, no ranting here yet.</div> |
66 | | - </div> |
67 | | -</body> |
| 41 | + a { |
| 42 | + font-family: arial; |
| 43 | + color: #4287f5; |
| 44 | + } |
| 45 | + </style> |
| 46 | + |
| 47 | + <div class="centeredDialog"> |
| 48 | + <span class="header">403 Forbidden</span><br /> |
| 49 | + <span class="small">(No entry)</span> |
| 50 | + <div class="sep1"></div> |
| 51 | + The server says "you aren't allowed here!"<br /> |
| 52 | + Must mean you're trying to do something that isn't allowed, or you don't |
| 53 | + have permission to do that action. <br /> |
| 54 | + <a href="./">Click here to go back to something that works</a> |
| 55 | + </div> |
| 56 | + </body> |
68 | 57 | </html> |
0 commit comments