Curtir 0
Bifurcar 0

Última atividade 4 hours ago

Custom Page 404

404 html nginx npm

emanuelegori revisou este gist 4 hours ago. Ir para a revisão

Sem alterações

emanuelegori revisou este gist 5 hours ago. Ir para a revisão

1 file changed, 1 deletion

404.html

@@ -10,7 +10,6 @@
10 10 No external dependencies.
11 11 -->
12 12 <!DOCTYPE html>
13 - <!DOCTYPE html>
14 13 <html lang="it">
15 14 <head>
16 15 <meta name="author" content="Emanuele Gori">

emanuelegori revisou este gist 5 hours ago. Ir para a revisão

1 file changed, 16 insertions

404.html

@@ -1,6 +1,22 @@
1 + <!--
2 + 404 Custom Error Page
3 + Author: Emanuele Gori <emanuelegori.uno>
4 + Version: 1.0.0
5 + Created: 2025-03-22
6 + License: GPL-2.0-or-later
7 + Description: Custom 404 page for NGINX Proxy Manager.
8 + Served for unconfigured or unknown hosts.
9 + Hostname and path populated dynamically via JS.
10 + No external dependencies.
11 + -->
12 + <!DOCTYPE html>
1 13 <!DOCTYPE html>
2 14 <html lang="it">
3 15 <head>
16 + <meta name="author" content="Emanuele Gori">
17 + <meta name="description" content="Pagina di errore 404 personalizzata per NGINX Proxy Manager">
18 + <meta name="version" content="1.0.0">
19 + <meta name="robots" content="noindex, nofollow">
4 20 <meta charset="UTF-8">
5 21 <meta name="viewport" content="width=device-width, initial-scale=1.0">
6 22 <meta name="robots" content="noindex, nofollow">

emanuelegori revisou este gist 5 hours ago. Ir para a revisão

1 file changed, 342 insertions

404.html(arquivo criado)

@@ -0,0 +1,342 @@
1 + <!DOCTYPE html>
2 + <html lang="it">
3 + <head>
4 + <meta charset="UTF-8">
5 + <meta name="viewport" content="width=device-width, initial-scale=1.0">
6 + <meta name="robots" content="noindex, nofollow">
7 + <title>404 - Risorsa non trovata</title>
8 + <style>
9 + *, *::before, *::after {
10 + box-sizing: border-box;
11 + margin: 0;
12 + padding: 0;
13 + }
14 +
15 + :root {
16 + --bg: #0d0f12;
17 + --surface: #141720;
18 + --border: #1f2435;
19 + --border-hi: #2d3350;
20 + --text: #c8cdd8;
21 + --text-dim: #5a6075;
22 + --text-mute: #3a3f52;
23 + --accent: #4a7fbd;
24 + --accent-lo: #1a2d45;
25 + --error: #bd4a4a;
26 + --error-lo: #2d1a1a;
27 + --green: #4abd7a;
28 + --mono: "Courier New", "Lucida Console", monospace;
29 + }
30 +
31 + html, body {
32 + height: 100%;
33 + }
34 +
35 + body {
36 + background-color: var(--bg);
37 + color: var(--text);
38 + font-family: var(--mono);
39 + font-size: 14px;
40 + line-height: 1.6;
41 + display: flex;
42 + flex-direction: column;
43 + align-items: center;
44 + justify-content: center;
45 + min-height: 100vh;
46 + padding: 2rem 1rem;
47 + }
48 +
49 + .terminal {
50 + width: 100%;
51 + max-width: 680px;
52 + background: var(--surface);
53 + border: 1px solid var(--border);
54 + border-radius: 6px;
55 + overflow: hidden;
56 + }
57 +
58 + .terminal-bar {
59 + background: var(--border);
60 + padding: 0.55rem 1rem;
61 + display: flex;
62 + align-items: center;
63 + gap: 0.5rem;
64 + border-bottom: 1px solid var(--border-hi);
65 + }
66 +
67 + .dot {
68 + width: 10px;
69 + height: 10px;
70 + border-radius: 50%;
71 + background: var(--border-hi);
72 + flex-shrink: 0;
73 + }
74 +
75 + .bar-label {
76 + flex: 1;
77 + text-align: center;
78 + font-size: 11px;
79 + color: var(--text-dim);
80 + letter-spacing: 0.05em;
81 + }
82 +
83 + .terminal-body {
84 + padding: 1.75rem 2rem;
85 + }
86 +
87 + .prompt-line {
88 + display: flex;
89 + align-items: baseline;
90 + gap: 0.5rem;
91 + margin-bottom: 1.5rem;
92 + }
93 +
94 + .prompt-sign {
95 + color: var(--green);
96 + font-size: 13px;
97 + flex-shrink: 0;
98 + }
99 +
100 + .prompt-cmd {
101 + color: var(--text-dim);
102 + font-size: 13px;
103 + word-break: break-all;
104 + }
105 +
106 + .error-block {
107 + border-left: 2px solid var(--error);
108 + background: var(--error-lo);
109 + padding: 1rem 1.25rem;
110 + margin-bottom: 1.5rem;
111 + border-radius: 0 4px 4px 0;
112 + }
113 +
114 + .error-code {
115 + font-size: 11px;
116 + color: var(--error);
117 + letter-spacing: 0.1em;
118 + text-transform: uppercase;
119 + margin-bottom: 0.5rem;
120 + }
121 +
122 + .error-title {
123 + font-size: 22px;
124 + font-weight: bold;
125 + color: #e0e4ef;
126 + letter-spacing: -0.01em;
127 + margin-bottom: 0.25rem;
128 + }
129 +
130 + .error-sub {
131 + font-size: 12px;
132 + color: var(--text-dim);
133 + }
134 +
135 + .output-block {
136 + margin-bottom: 1.5rem;
137 + }
138 +
139 + .output-line {
140 + display: flex;
141 + gap: 1rem;
142 + padding: 0.2rem 0;
143 + font-size: 13px;
144 + border-bottom: 1px solid var(--border);
145 + }
146 +
147 + .output-line:last-child {
148 + border-bottom: none;
149 + }
150 +
151 + .output-key {
152 + color: var(--text-dim);
153 + min-width: 120px;
154 + flex-shrink: 0;
155 + }
156 +
157 + .output-val {
158 + color: var(--text);
159 + }
160 +
161 + .output-val.highlight {
162 + color: var(--accent);
163 + }
164 +
165 + .output-val.warn {
166 + color: #bd8a4a;
167 + }
168 +
169 + .divider {
170 + border: none;
171 + border-top: 1px solid var(--border);
172 + margin: 1.5rem 0;
173 + }
174 +
175 + .note-block {
176 + background: var(--accent-lo);
177 + border: 1px solid #1e3050;
178 + border-radius: 4px;
179 + padding: 0.85rem 1.1rem;
180 + margin-bottom: 1.5rem;
181 + }
182 +
183 + .note-block p {
184 + font-size: 12px;
185 + color: var(--text-dim);
186 + line-height: 1.7;
187 + }
188 +
189 + .note-block p + p {
190 + margin-top: 0.4rem;
191 + }
192 +
193 + .note-block strong {
194 + color: var(--text);
195 + font-weight: normal;
196 + }
197 +
198 + .action-line {
199 + display: flex;
200 + align-items: center;
201 + gap: 0.5rem;
202 + font-size: 13px;
203 + }
204 +
205 + .action-line .prompt-sign {
206 + color: var(--green);
207 + }
208 +
209 + .home-link {
210 + color: var(--accent);
211 + text-decoration: none;
212 + border-bottom: 1px solid var(--accent-lo);
213 + transition: border-color 0.15s;
214 + }
215 +
216 + .home-link:hover {
217 + border-color: var(--accent);
218 + }
219 +
220 + .cursor {
221 + display: inline-block;
222 + width: 8px;
223 + height: 14px;
224 + background: var(--text-dim);
225 + vertical-align: middle;
226 + margin-left: 2px;
227 + animation: blink 1.1s step-start infinite;
228 + }
229 +
230 + @keyframes blink {
231 + 0%, 100% { opacity: 1; }
232 + 50% { opacity: 0; }
233 + }
234 +
235 + .footer-note {
236 + margin-top: 1.5rem;
237 + font-size: 11px;
238 + color: var(--text-mute);
239 + text-align: center;
240 + letter-spacing: 0.03em;
241 + }
242 +
243 + @media (max-width: 500px) {
244 + .terminal-body { padding: 1.25rem 1rem; }
245 + .output-key { min-width: 90px; }
246 + .error-title { font-size: 18px; }
247 + }
248 + </style>
249 + </head>
250 + <body>
251 +
252 + <div class="terminal" role="main">
253 +
254 + <div class="terminal-bar" aria-hidden="true">
255 + <span class="dot"></span>
256 + <span class="dot"></span>
257 + <span class="dot"></span>
258 + <span class="bar-label" id="bar-host">http-error-handler</span>
259 + </div>
260 +
261 + <div class="terminal-body">
262 +
263 + <div class="prompt-line">
264 + <span class="prompt-sign">$</span>
265 + <span class="prompt-cmd" id="prompt-path">GET <span id="req-url">...</span> HTTP/1.1</span>
266 + </div>
267 +
268 + <div class="error-block">
269 + <div class="error-code">HTTP 404 &mdash; Not Found</div>
270 + <div class="error-title">Risorsa non trovata</div>
271 + <div class="error-sub">The requested resource could not be located on this server.</div>
272 + </div>
273 +
274 + <div class="output-block">
275 + <div class="output-line">
276 + <span class="output-key">host</span>
277 + <span class="output-val highlight" id="out-host">-</span>
278 + </div>
279 + <div class="output-line">
280 + <span class="output-key">path</span>
281 + <span class="output-val" id="out-path">-</span>
282 + </div>
283 + <div class="output-line">
284 + <span class="output-key">status</span>
285 + <span class="output-val warn">404 Not Found</span>
286 + </div>
287 + <div class="output-line">
288 + <span class="output-key">indexing</span>
289 + <span class="output-val">noindex, nofollow</span>
290 + </div>
291 + </div>
292 +
293 + <hr class="divider">
294 +
295 + <div class="note-block" role="note">
296 + <p>
297 + <strong>La risorsa richiesta non esiste</strong> oppure l'host non e' configurato su questo server.
298 + Se hai seguito un link esterno, potrebbe essere obsoleto o errato.
299 + </p>
300 + <p>
301 + The requested resource does not exist or the host is not configured on this server.
302 + If you followed an external link, it may be outdated or incorrect.
303 + </p>
304 + </div>
305 +
306 + <div class="action-line">
307 + <span class="prompt-sign">$</span>
308 + <span>cd <a href="/" class="home-link" aria-label="Visita la home del sito">home</a></span>
309 + <span class="cursor" aria-hidden="true"></span>
310 + </div>
311 +
312 + </div>
313 +
314 + </div>
315 +
316 + <p class="footer-note" aria-hidden="true">
317 + nginx proxy manager &mdash; custom error page
318 + </p>
319 +
320 + <script>
321 + (function () {
322 + var host = window.location.hostname || '';
323 + var path = window.location.pathname || '/';
324 + var fullUrl = host + path;
325 +
326 + var elHost = document.getElementById('out-host');
327 + var elPath = document.getElementById('out-path');
328 + var elReqUrl = document.getElementById('req-url');
329 + var elBarHost = document.getElementById('bar-host');
330 +
331 + if (host) {
332 + elHost.textContent = host;
333 + elBarHost.textContent = host;
334 + elReqUrl.textContent = fullUrl;
335 + }
336 +
337 + elPath.textContent = path;
338 + })();
339 + </script>
340 +
341 + </body>
342 + </html>
Próximo Anterior

Desenvolvido por Opengist ⋅ Load: 50ms⋅

Português
⋅ Copyright 2024 - 2025 emanuelegori.uno