mirror of
https://codeberg.org/ashley/poke.git
synced 2024-11-25 11:48:56 +01:00
Merge pull request 'Update Error Page Design' (#66) from Korbs/poketube:main into main
Reviewed-on: https://codeberg.org/ashley/poke/pulls/66
This commit is contained in:
commit
e18f227999
4 changed files with 106 additions and 78 deletions
82
html/404.ejs
82
html/404.ejs
|
@ -1,78 +1,4 @@
|
|||
<!--
|
||||
This Source Code Form is subject to the terms of the GNU General Public License:
|
||||
|
||||
Copyright (C) 2021-2022 POKETUBE (https://codeberg.org/Ashley/poketube)
|
||||
|
||||
This program is free software: you can redistribute it and/or modify
|
||||
it under the terms of the GNU General Public License as published by
|
||||
the Free Software Foundation, either version 3 of the License, or
|
||||
(at your option) any later version.
|
||||
|
||||
This program is distributed in the hope that it will be useful,
|
||||
but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||||
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
||||
GNU General Public License for more details.
|
||||
|
||||
You should have received a copy of the GNU General Public License
|
||||
along with this program. If not, see https://www.gnu.org/licenses/.
|
||||
-->
|
||||
<!DOCTYPE html><html>
|
||||
<head>
|
||||
<title>1984!!1 - PokeTube</title>
|
||||
<link href=/css/app-cdn.min.css rel=stylesheet>
|
||||
<link href=/css/app.main.css rel=stylesheet>
|
||||
<link href="/css/watch.main.css?v=56" rel=stylesheet>
|
||||
<link href="/css/watch-util.css" rel=stylesheet>
|
||||
<link href="https://fonts.poketube.fun/css/fonts.css" rel=stylesheet>
|
||||
<link href="/css/watch-navbar.css?v=56" rel=stylesheet>
|
||||
<link href=https://p.poketube.fun/https://site-assets.fontawesome.com/releases/v6.1.1/css/all.css rel=stylesheet>
|
||||
<base target="_top">
|
||||
<link href=https://poketube.fun/css/yt-ukraine.svg rel=icon>
|
||||
<style>
|
||||
body{
|
||||
background:#111;
|
||||
margin: auto;
|
||||
transform: translateY(13em)
|
||||
}
|
||||
p,a,h1{
|
||||
text-align:center;
|
||||
color:#fff;
|
||||
}
|
||||
nav,error-page,div{
|
||||
justify-content: center;
|
||||
background: #111
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="error-page">
|
||||
|
||||
|
||||
<div id="error-page-content" align="center">
|
||||
|
||||
|
||||
<h1 style="color:#fff;font-family:'PokeTube Flex',sans-serif;font-weight:900;white-space:yes;font-style: italic;font-size: 45px;" align="center">
|
||||
404!!1
|
||||
</h1>
|
||||
<h3>
|
||||
Very <a href="https://poketube.fun/watch?v=Yw8mcm3k1AQ" style="color:#fff">1984</a> Innit? I dont think that this webpage exist :p u can search for something else~
|
||||
</h3>
|
||||
</div>
|
||||
|
||||
<nav>
|
||||
|
||||
<div class="middle">
|
||||
|
||||
|
||||
<form action=/search><input class=search-bar placeholder="Search owo " autocomplete="on" id=fname name=query style="color:#fff;font-family:Inter,sans-serif;border-radius: 8px;">
|
||||
<button class="btn btn-success" type=submit><i class="fa-light fa-search"></i></button>
|
||||
|
||||
</form>
|
||||
</div></nav>
|
||||
|
||||
</div>
|
||||
|
||||
<img src="https://t.poketube.fun/t/rep.gif?from=param" style="width: 0;visibility: hidden;" id="404_page">
|
||||
|
||||
</body>
|
||||
</html>
|
||||
<%- include('error.ejs', {
|
||||
error: "404",
|
||||
description: "Very 1984 Innit? I dont think this webpage exist :p u can search for something else~ "
|
||||
}) %>
|
4
html/502.ejs
Normal file
4
html/502.ejs
Normal file
|
@ -0,0 +1,4 @@
|
|||
<%- include('error.ejs', {
|
||||
error: "502",
|
||||
description: "An error has occurred. Try again or come back later."
|
||||
}) %>
|
94
html/error.ejs
Normal file
94
html/error.ejs
Normal file
|
@ -0,0 +1,94 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<title>PokeTube</title>
|
||||
<meta content="#111111" name="theme-color">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no, viewport-fit=cover">
|
||||
<meta name="darkreader-lock">
|
||||
<link href="/css/yt-ukraine.svg?v=3" rel=icon>
|
||||
<link rel="manifest" href="/manifest.json">
|
||||
</head>
|
||||
<body>
|
||||
<p id="abstract"><%=error%></p>
|
||||
<div class="error">
|
||||
<h2><%=error%></h2>
|
||||
<p><%=description%></p>
|
||||
</div>
|
||||
<div class="error-footer">
|
||||
<a href="https://poketube.fun/game-hub">Games</a>
|
||||
<a href="https://codeberg.org/ashley/poke/">Source Code</a>
|
||||
<a href="https://status.poketube.fun/">Status</a>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
<style>
|
||||
body {
|
||||
margin: auto;
|
||||
background: #111111;
|
||||
color: white;
|
||||
font-family: arial;
|
||||
max-width: 600px;
|
||||
}
|
||||
body::before {
|
||||
background: linear-gradient(0deg, rgba(115, 32, 67, 1.0), rgba(17, 17, 17, 1.0));
|
||||
background-repeat: no-repeat;
|
||||
content: "";
|
||||
position: fixed;
|
||||
bottom: 0px;
|
||||
left: 0px;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
z-index: -1;
|
||||
pointer-events: none;
|
||||
transition: 1s height;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-size: 42px;
|
||||
}
|
||||
|
||||
p#abstract {
|
||||
position: fixed;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
font-size: 500px;
|
||||
margin: 0px;
|
||||
font-weight: bold;
|
||||
opacity: 0.005;
|
||||
pointer-events: none;
|
||||
transition: 1s transform;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 790px) {
|
||||
p#abstract {transform: translate(-50%, -50%) rotate(90deg) !important}
|
||||
}
|
||||
|
||||
.error {
|
||||
position: fixed;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
text-align: center;
|
||||
cursor: default;
|
||||
max-width: 600px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.error-footer {
|
||||
position: fixed;
|
||||
bottom: 24px;
|
||||
width: 100%;
|
||||
max-width: 600px;
|
||||
text-align: center;
|
||||
}
|
||||
.error-footer a {
|
||||
color: #AC8FA5;
|
||||
text-decoration: none;
|
||||
margin: 0px 12px;
|
||||
}
|
||||
.error-footer a:hover {
|
||||
color: #d69cc8;
|
||||
}
|
||||
</style>
|
|
@ -48,6 +48,10 @@ module.exports = function (app, config, renderTemplate) {
|
|||
}
|
||||
});
|
||||
|
||||
app.get("/502", function (req, res) {
|
||||
renderTemplate(res, req, "502.ejs");
|
||||
});
|
||||
|
||||
app.get("/143", function (req, res) {
|
||||
var number_easteregg = getRandomArbitrary(0, 143);
|
||||
|
||||
|
|
Loading…
Reference in a new issue