add end of life component

js/components/eol.js

@@ -0,0 +1,21 @@
+'use strict';
+
+import React from 'react';
+
+import { getLangText } from '../utils/lang_utils';
+import { setDocumentTitle } from '../utils/dom_utils';
+
+
+const EndOfLife = () =>{
+    setDocumentTitle(getLangText('EOL Title'));
+
+    return (
+        <div className="ascribe-eol-wrapper">
+            <h3>{getLangText('EOL Title')}</h3>
+            <p>{getLangText('EOL Text')} <a href="https://www.ascribe.io">{getLangText('EOL Action')}</a></p>
+        </div>
+    );
+};
+
+
+export default EndOfLife;

js/constants/languages.js

@@ -2,6 +2,9 @@
 
 const languages = {
     'en-US': {
+        'EOL Title': 'End Of Life',
+        'EOL Text': 'As of September 8 2018, ascribe has been shut down.',
+        'EOL Action': 'Learn more',
         'ID': 'ID',
         'Actions': 'Actions',
         'Hide': 'Hide',

js/routes.js

@@ -25,6 +25,7 @@ import ErrorNotFoundPage from './components/error_not_found_page';
 import RegisterPiece from './components/register_piece';
 
 import Footer from './components/footer';
+import Eol from './components/eol';
 
 import { ProxyHandler, AuthRedirect } from './components/ascribe_routes/proxy_handler';
 
@@ -33,6 +34,10 @@ import { getLangText } from './utils/lang_utils';
 
 const COMMON_ROUTES = (
     <Route path='/' component={AscribeApp}>
+        <Route
+            path='eol'
+            component={Eol}
+            footer={Footer} />
         <Route
             path='login'
             component={ProxyHandler(AuthRedirect({to: '/collection', when: 'loggedIn'}))(LoginContainer)}

sass/ascribe_eol.scss

@@ -0,0 +1,13 @@
+$break-small: 764px;
+
+.ascribe-eol-wrapper {
+    margin: 0 auto;
+    max-width: 600px;
+    width: 80%;
+    padding-top: 10rem;
+    padding-bottom: 10rem;
+
+    @media screen and (max-width: $break-small) {
+        width: 100%;
+    }
+}

sass/main.scss

@@ -14,6 +14,7 @@ $BASE_URL: '<%= BASE_URL %>';
 @import './ascribe-fonts/ascribe-fonts';
 @import 'ascribe_navbar';
 @import 'ascribe_login';
+@import 'ascribe_eol';
 @import 'ascribe_table';
 @import 'ascribe_accordion_list';
 @import 'ascribe_piece_list_bulk_modal';