Files
Werewolf/client/views/404.html
2021-11-16 22:42:44 -05:00

80 lines
2.4 KiB
HTML

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Create A Game</title>
<meta name="description" content="Create a game of Werewolf using your custom set of roles.">
<meta property="og:title" content="Not Found">
<meta property="og:type" content="website">
<meta property="og:url" content="https://play-werewolf.herokuapp.com/not-found">
<meta property="og:description" content="The page you are looking for could not be found.">
<meta property="og:image" content="image.png">
<link rel="icon" href="/favicon.ico">
<link rel="icon" href="/favicon.svg" type="image/svg+xml">
<link rel="apple-touch-icon" href="/apple-touch-icon.png">
<link rel="stylesheet" href="../styles/GLOBAL.css">
<link rel="stylesheet" href="../styles/create.css">
<link rel="stylesheet" href="../styles/modal.css">
<link rel="stylesheet" href="../styles/third_party/dropdown.min.css">
<link rel="stylesheet" href="../styles/third_party/transition.min.css">
<link rel="stylesheet" href="../styles/third_party/search.min.css">
<script src="../modules/third_party/jQuery/jquery-3.6.0.min.js"></script>
<script src="../modules/third_party/semantic-ui/transition.min.js"></script>
<script src="../modules/third_party/semantic-ui/dropdown.min.js"></script>
<script src="../modules/third_party/semantic-ui/search.min.js"></script>
</head>
<body>
<div id="navbar">
<img src="../images/Werewolf_Small.png"/>
<a href="/">Home</a>
</div>
<span>
<h1>404</h1>
<h3>The game or other resource that you are looking for could not be found, or you don't have permission to access it.
If this error is unexpected, the application may have restarted.</h3>
</span>
<style>
#navbar {
position: absolute;
}
h1 {
margin: 0 auto;
}
h3 {
max-width: 40em;
font-size: 20px;
padding: 1em;
margin: 0 auto;
}
html, body {
height: 100%;
}
span {
height: 100%;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
margin: 0 auto;
}
@media(min-width: 700px) {
h1 {
font-size: 200px;
}
}
@media(max-width: 700px) {
h1 {
font-size: 44vw;
}
}
</style>
</body>
</html>