raggedstaff/openfoodnetwork
1
0
Fork 0
mirror of https://github.com/openfoodfoundation/openfoodnetwork synced 2026-01-11 18:26:50 +00:00
Code Issues Packages Projects Releases Wiki Activity

Improved layout and image for 404 and 500 error pages

Browse Source
This commit is contained in:
Paul Mackay
2016-05-05 14:21:16 +01:00
parent 2367b73d3a
commit 22a6661b51
3 changed files with 48 additions and 44 deletions
Download Patch File Download Diff File Expand all files Collapse all files

43
public/404.html
View File

@@ -3,35 +3,40 @@
<head>
<title>The page you were looking for doesn't exist (404)</title>
<style type="text/css">
body { background-color: #fff; color: #666; text-align: center; font-family: arial, sans-serif; }
body {
background-color: #fff;
color: #666;
font-family: arial, sans-serif;
}
div.dialog {
width: 25em;
padding: 0 4em;
width: 600px;
margin: 2em auto 0 auto;
margin: auto;
}
a.go_home {
font-size: 100%;
color: black;
line-height: 1.5em;
text-decoration: none;
border-bottom: 1px dotted black;
padding: 0 0.2rem;
@media only screen
and (min-width: 320px)
and (max-width: 568px) {
div.dialog, div.dialog img {
width: 95%;
}
}
a.go_home:hover, a.go_home:focus, a.go_home:active{
background: #8f301d;
color: white;
border-bottom: none;
div.dialog h1 {
font-size: 1.8em;
}
</style>
</head>
<body>
<!-- This file lives in public/404.html -->
<!-- This file lives in public/500.html -->
<div class="dialog">
<a href="/" ><img src="/404.jpg" /></a>
<p>It seems the page you're looking for is in a grump.
<br><h3><a class="go_home" href="/" >Return home</a></h3>
</p>
<a href="/" ><img src="/500.jpg" /></a>
<h1>Oops! Page not found.</h1>
<b>Please try again</b>
<p>This might be a temporary problem. Please click the back button to return to the previous screen or go back to <a class="go_home" href="/">Home</a> and try again.</p>
<b>Contact support</b>
<p>If the problem persists or is urgent, please tell us about it. Find our contact details from the global <a href="https://openfoodnetwork.org/ofn-local/" target="blank">Open Food Network Local page</a>.</p>
<p>It really helps us if you can give as much detail as possible about what the missing page is about.</p>
</div>
</body>
</html>

49
public/500.html
View File

@@ -3,24 +3,26 @@
<head>
<title>We're sorry, but something went wrong (500)</title>
<style type="text/css">
body { background-color: #fff; color: #666; text-align: center; font-family: arial, sans-serif; }
body {
background-color: #fff;
color: #666;
font-family: arial, sans-serif;
}
div.dialog {
width: 25em;
padding: 0 4em;
width: 600px;
margin: 2em auto 0 auto;
margin: auto;
}
a.go_home {
font-size: 100%;
color: black;
line-height: 1.5em;
text-decoration: none;
border-bottom: 1px dotted black;
padding: 0 0.2rem;
@media only screen
and (min-width: 320px)
and (max-width: 568px) {
div.dialog, div.dialog img {
width: 95%;
}
}
a.go_home:hover, a.go_home:focus, a.go_home:active{
background: #8f301d;
color: white;
border-bottom: none;
div.dialog h1 {
font-size: 1.8em;
}
</style>
</head>
@@ -29,17 +31,14 @@
<!-- This file lives in public/500.html -->
<div class="dialog">
<a href="/" ><img src="/500.jpg" /></a>
<p>We're sorry, but something went wrong.
<br>Try refreshing the page, or
<br><h3><a class="go_home" href="/" >Return home</a></h3>
<br>Want to let us know what went wrong? Email us at:
<h3>
<!-- Can we do .reverse ??
<a class="go_home" href="mailto:hello@openfoodnetwork.org" target="_blank"></a>
-->
hello [at] openfoodnetwork.org
</h3>
</p>
<h1>We're sorry, but something went wrong.</h1>
<b>Please try again</b>
<p>This might be a temporary problem. Please click the back button to return to the previous screen or go back to <a class="go_home" href="/">Home</a> and try again.</p>
<b>We're on it</b>
<p>If you have seen this problem before, we probably already know about it and are working on a fix. We record all the errors that come up.</p>
<b>Contact support</b>
<p>If the problem persists or is urgent, please tell us about it. Find our contact details from the global <a href="https://openfoodnetwork.org/ofn-local/" target="blank">Open Food Network Local page</a>.</p>
<p>It really helps us if you can give as much detail as possible about what you were doing when this error occurred.</p>
</div>
</body>
</html>

BIN
public/500.jpg
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 40 KiB

After

Width:  |  Height:  |  Size: 36 KiB