commit c9f7230b5c50b9ece6ab6bc710ecad8be76f2aae
parent f2340bb430c354c89a58f47401d2f316cfb77597
Author: Konstantin Tarkus <hello@tarkus.me>
Date: Wed, 6 Apr 2016 22:21:21 +0300
Merge branch 'manugill-master'
Diffstat:
7 files changed, 27 insertions(+), 116 deletions(-)
diff --git a/src/components/ErrorPage/ErrorPage.js b/src/components/ErrorPage/ErrorPage.js
@@ -11,7 +11,8 @@ import React, { Component, PropTypes } from 'react';
import withStyles from 'isomorphic-style-loader/lib/withStyles';
import s from './ErrorPage.scss';
-const title = 'Error';
+let title = 'Error';
+let content = 'Sorry, a critical error occurred on this page.';
class ErrorPage extends Component {
@@ -20,15 +21,24 @@ class ErrorPage extends Component {
onPageNotFound: PropTypes.func.isRequired,
};
+ static propTypes = {
+ statusCode: PropTypes.number,
+ };
+
componentWillMount() {
this.context.onSetTitle(title);
}
render() {
+ if (this.props.statusCode === 404) {
+ title = 'Page Not Found';
+ content = 'Sorry, the page you were trying to view does not exist.';
+ }
+
return (
<div>
<h1>{title}</h1>
- <p>Sorry, an critical error occurred on this page.</p>
+ <p>{content}</p>
</div>
);
}
diff --git a/src/components/ErrorPage/ErrorPage.scss b/src/components/ErrorPage/ErrorPage.scss
@@ -8,29 +8,29 @@
*/
* {
- margin: 0;
line-height: 1.2;
+ margin: 0;
}
html {
+ color: #888;
display: table;
- width: 100%;
+ font-family: sans-serif;
height: 100%;
- color: #888;
text-align: center;
- font-family: sans-serif;
+ width: 100%;
}
body {
display: table-cell;
- margin: 2em auto;
vertical-align: middle;
+ margin: 2em auto;
}
h1 {
color: #555;
- font-weight: 400;
font-size: 2em;
+ font-weight: 400;
}
p {
@@ -38,17 +38,20 @@ p {
width: 280px;
}
+pre {
+ text-align: left;
+ margin-top: 2rem;
+}
+
@media only screen and (max-width: 280px) {
- body,
- p {
+ body, p {
width: 95%;
}
h1 {
font-size: 1.5em;
margin: 0 0 0.3em;
-
}
}
diff --git a/src/components/NotFoundPage/NotFoundPage.js b/src/components/NotFoundPage/NotFoundPage.js
@@ -1,39 +0,0 @@
-/**
- * React Starter Kit (https://www.reactstarterkit.com/)
- *
- * Copyright © 2014-2016 Kriasoft, LLC. All rights reserved.
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE.txt file in the root directory of this source tree.
- */
-
-import React, { Component, PropTypes } from 'react';
-import withStyles from 'isomorphic-style-loader/lib/withStyles';
-import s from './NotFoundPage.scss';
-
-const title = 'Page Not Found';
-
-class NotFoundPage extends Component {
-
- static contextTypes = {
- onSetTitle: PropTypes.func.isRequired,
- onPageNotFound: PropTypes.func.isRequired,
- };
-
- componentWillMount() {
- this.context.onSetTitle(title);
- this.context.onPageNotFound();
- }
-
- render() {
- return (
- <div>
- <h1>{title}</h1>
- <p>Sorry, but the page you were trying to view does not exist.</p>
- </div>
- );
- }
-
-}
-
-export default withStyles(NotFoundPage, s);
diff --git a/src/components/NotFoundPage/NotFoundPage.scss b/src/components/NotFoundPage/NotFoundPage.scss
@@ -1,53 +0,0 @@
-/**
- * React Starter Kit (https://www.reactstarterkit.com/)
- *
- * Copyright © 2014-2016 Kriasoft, LLC. All rights reserved.
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE.txt file in the root directory of this source tree.
- */
-
-* {
- margin: 0;
- line-height: 1.2;
-}
-
-html {
- display: table;
- width: 100%;
- height: 100%;
- color: #888;
- text-align: center;
- font-family: sans-serif;
-}
-
-body {
- display: table-cell;
- margin: 2em auto;
- vertical-align: middle;
-}
-
-h1 {
- color: #555;
- font-weight: 400;
- font-size: 2em;
-}
-
-p {
- margin: 0 auto;
- width: 280px;
-}
-
-@media only screen and (max-width: 280px) {
-
- body,
- p {
- width: 95%;
- }
-
- h1 {
- font-size: 1.5em;
- margin: 0 0 0.3em;
- }
-
-}
diff --git a/src/components/NotFoundPage/package.json b/src/components/NotFoundPage/package.json
@@ -1,6 +0,0 @@
-{
- "name": "NotFoundPage",
- "version": "0.0.0",
- "private": true,
- "main": "./NotFoundPage.js"
-}
diff --git a/src/routes.js b/src/routes.js
@@ -12,7 +12,6 @@ import Router from 'react-routing/src/Router';
import fetch from './core/fetch';
import App from './components/App';
import ContentPage from './components/ContentPage';
-import NotFoundPage from './components/NotFoundPage';
import ErrorPage from './components/ErrorPage';
const routes = [
@@ -39,9 +38,8 @@ const router = new Router(on => {
return data && data.content && <ContentPage {...data.content} />;
});
- on('error', (state, error) => state.statusCode === 404 ?
- <App context={state.context} error={error}><NotFoundPage /></App> :
- <App context={state.context} error={error}><ErrorPage /></App>
+ on('error', (state, error) =>
+ <App context={state.context} error={error}><ErrorPage statusCode={state.statusCode} /></App>
);
});
diff --git a/src/views/error.jade b/src/views/error.jade
@@ -5,7 +5,6 @@ html(lang="en")
title Internal Server Error
meta(name="viewport", content="width=device-width, initial-scale=1")
style.
-
* {
line-height: 1.2;
margin: 0;
@@ -39,8 +38,7 @@ html(lang="en")
pre {
text-align: left;
- max-width: 1000px;
- margin: 0 auto;
+ margin-top: 2rem;
}
@media only screen and (max-width: 280px) {
