better 404 page. with kittens.
This commit is contained in:
parent
c9d0879d3d
commit
e55b305bca
3 changed files with 64 additions and 15 deletions
Binary file not shown.
|
Before Width: | Height: | Size: 3.5 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 3.3 KiB |
|
|
@ -3,27 +3,76 @@
|
||||||
<head>
|
<head>
|
||||||
<title>The page you were looking for doesn't exist (404)</title>
|
<title>The page you were looking for doesn't exist (404)</title>
|
||||||
<style type="text/css">
|
<style type="text/css">
|
||||||
body { background-color: #fff; color: #666; text-align: center; font-family: arial, sans-serif; }
|
@font-face{font-family:Roboto;src:url(https://s3.amazonaws.com/joindiaspora/fonts/Roboto-Regular.ttf)}
|
||||||
div.dialog {
|
@font-face{font-family:Roboto-BoldCondensed;src:url(https://s3.amazonaws.com/joindiaspora/fonts/Roboto-BoldCondensed.ttf)}
|
||||||
width: 25em;
|
|
||||||
padding: 0 4em;
|
body,
|
||||||
margin: 4em auto 0 auto;
|
html {
|
||||||
border: 1px solid #ccc;
|
height: 100%;
|
||||||
border-right-color: #999;
|
|
||||||
border-bottom-color: #999;
|
|
||||||
}
|
}
|
||||||
h1 { font-size: 100%; color: #f00; line-height: 1.5em; text-align:center; }
|
|
||||||
|
body {
|
||||||
|
margin-bottom: 0;
|
||||||
|
padding-bottom: 0;
|
||||||
|
margin-top: 10%;
|
||||||
|
background-color: #fff;
|
||||||
|
color: #666;
|
||||||
|
text-align: center;
|
||||||
|
font-family: Roboto, Helvetica, Arial, sans-serif;
|
||||||
|
background-image: url(https://joindiaspora.s3.amazonaws.com/assets/pattern-4deadcd0b3ee298c791c9055bdef3377.png);
|
||||||
|
text-shadow: 0 1px 0 #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
#big-number {
|
||||||
|
font-family: Roboto-BoldCondensed, Helvetica, Arial, sans-serif;
|
||||||
|
font-size: 250px;
|
||||||
|
text-shadow: 0 2px 0 #fff, 0 -1px 0 #999;
|
||||||
|
color: #ddd;
|
||||||
|
}
|
||||||
|
|
||||||
|
a {
|
||||||
|
text-decoration : none;
|
||||||
|
color : rgb(42,156,235);
|
||||||
|
}
|
||||||
|
|
||||||
|
a:hover {
|
||||||
|
text-decoration : underline;
|
||||||
|
}
|
||||||
|
|
||||||
|
.transparent {
|
||||||
|
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
|
||||||
|
filter: alpha(opacity=80);
|
||||||
|
-moz-opacity: 0.8;
|
||||||
|
-khtml-opacity: 0.8;
|
||||||
|
opacity: 0.8;
|
||||||
|
}
|
||||||
|
|
||||||
|
#cat-footer {
|
||||||
|
width: 100%;
|
||||||
|
position: fixed;
|
||||||
|
text-align: center;
|
||||||
|
bottom : -8px;
|
||||||
|
left : 0;
|
||||||
|
}
|
||||||
|
|
||||||
</style>
|
</style>
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
<!-- This file lives in public/404.html -->
|
<!-- This file lives in public/404.html -->
|
||||||
<h1> 404: Not Found </h1>
|
<div id="big-number" class="transparent">
|
||||||
<a href="javascript:history.go(-1)">
|
404
|
||||||
<img src="/assets/404.png"/>
|
</div>
|
||||||
|
|
||||||
|
These are not the kittens you're looking for. Move along.
|
||||||
|
<br/>
|
||||||
|
<br/>
|
||||||
|
<a href="/">
|
||||||
|
Go Back?
|
||||||
</a>
|
</a>
|
||||||
<h1>
|
|
||||||
<a href="/"> Go Back </a>
|
<div id="cat-footer" class="transparent">
|
||||||
</h1>
|
<img src="https://s3.amazonaws.com/joindiaspora/peeping-tom.png">
|
||||||
|
</div>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue