diff --git a/src/features/home/DefaultPage.js b/src/features/home/DefaultPage.js deleted file mode 100644 index 509a3e7..0000000 --- a/src/features/home/DefaultPage.js +++ /dev/null @@ -1,80 +0,0 @@ -import React, { Component } from 'react'; -import PropTypes from 'prop-types'; -import { bindActionCreators } from 'redux'; -import { connect } from 'react-redux'; -import { Link } from 'react-router-dom'; -import reactLogo from '../../images/react-logo.svg'; -import rekitLogo from '../../images/rekit-logo.svg'; -import * as actions from './redux/actions'; - -export class DefaultPage extends Component { - static propTypes = { - home: PropTypes.object.isRequired, - actions: PropTypes.object.isRequired, - }; - - render() { - return ( -
-
- logo - logo -

Welcome to React

-
-
-

To get started:

- -
-
- ); - } -} - -/* istanbul ignore next */ -function mapStateToProps(state) { - return { - home: state.home, - }; -} - -/* istanbul ignore next */ -function mapDispatchToProps(dispatch) { - return { - actions: bindActionCreators({ ...actions }, dispatch), - }; -} - -export default connect(mapStateToProps, mapDispatchToProps)(DefaultPage); diff --git a/src/features/home/DefaultPage.scss b/src/features/home/DefaultPage.scss deleted file mode 100644 index 764d598..0000000 --- a/src/features/home/DefaultPage.scss +++ /dev/null @@ -1,77 +0,0 @@ -@import '../../styles/mixins'; - -.home-default-page { - text-align: center; - .app { - text-align: center; - } - - .app-logo { - animation: app-logo-spin infinite 10s linear; - height: 80px; - } - - .rekit-logo { - position: absolute; - left: 0px; - top: 0px; - opacity: 0.08; - height: 190px; - } - - .app-header { - background-color: #222; - height: 150px; - padding: 20px; - color: white; - overflow: hidden; - position: relative; - } - - .app-title { - font-size: 1.5em; - } - - .app-intro { - font-size: large; - } - - ul, - li { - list-style: none; - margin: 0; - padding: 0; - } - - ul { - margin-top: 20px; - } - li { - margin-top: 10px; - } - - a { - color: #0288d1; - text-decoration: none; - &:hover { - text-decoration: underline; - } - } - - p.memo { - width: 500px; - color: #999; - font-size: 12px; - line-height: 150%; - margin: auto; - } - - @keyframes app-logo-spin { - from { - transform: rotate(0deg); - } - to { - transform: rotate(360deg); - } - } -} diff --git a/src/features/home/Login.js b/src/features/home/Login.js new file mode 100644 index 0000000..61923c7 --- /dev/null +++ b/src/features/home/Login.js @@ -0,0 +1,54 @@ +import React, { Component } from 'react'; +import PropTypes from 'prop-types'; +import { bindActionCreators } from 'redux'; +import { connect } from 'react-redux'; +import { Link } from 'react-router-dom'; +import matrixLogo from '../../images/matrix-logo.svg'; +import * as actions from './redux/actions'; + +export class Login extends Component { + static propTypes = { + home: PropTypes.object.isRequired, + actions: PropTypes.object.isRequired, + }; + + render() { + return ( +
+
+ logo +

Welcome to Synapse Admin

+
+
+ + + + + + + + + +
Username:
Password:
+ Login +
+
+ ); + } +} + +/* istanbul ignore next */ +function mapStateToProps(state) { + return { + home: state.home, + }; +} + +/* istanbul ignore next */ +function mapDispatchToProps(dispatch) { + return { + actions: bindActionCreators({ ...actions }, dispatch), + }; +} + +export default connect(mapStateToProps, mapDispatchToProps)(Login); diff --git a/src/features/home/Login.scss b/src/features/home/Login.scss new file mode 100644 index 0000000..3c95800 --- /dev/null +++ b/src/features/home/Login.scss @@ -0,0 +1,31 @@ +@import '../../styles/mixins'; + +.home-login { + text-align: center; + .app { + text-align: center; + } + + .app-logo { + animation: app-logo-spin infinite 10s linear; + height: 80px; + } + + .app-header { + background-color: #EEE; + height: 150px; + padding: 20px; + color: black; + overflow: hidden; + position: relative; + } + + .app-title { + font-size: 1.5em; + } + + .app-login { + display: inline-block; + padding: 16px; + } +} diff --git a/src/features/home/index.js b/src/features/home/index.js index 89b6c5b..dc634ac 100644 --- a/src/features/home/index.js +++ b/src/features/home/index.js @@ -1,2 +1,2 @@ export { default as App } from './App'; -export { default as DefaultPage } from './DefaultPage'; +export { default as Login } from './Login'; diff --git a/src/features/home/route.js b/src/features/home/route.js index 35d8c53..68f92ab 100644 --- a/src/features/home/route.js +++ b/src/features/home/route.js @@ -1,14 +1,14 @@ import { - DefaultPage, + Login, } from './'; export default { path: '/', name: 'Home', childRoutes: [ - { path: 'default-page', - name: 'Default page', - component: DefaultPage, + { path: 'login', + name: 'Login', + component: Login, isIndex: true, }, ], diff --git a/src/features/home/style.scss b/src/features/home/style.scss index 7b7c243..10041f1 100644 --- a/src/features/home/style.scss +++ b/src/features/home/style.scss @@ -1,3 +1,3 @@ @import '../../styles/mixins'; @import './App'; -@import './DefaultPage'; +@import './Login'; diff --git a/src/images/matrix-logo.svg b/src/images/matrix-logo.svg new file mode 100644 index 0000000..5c7dfbb --- /dev/null +++ b/src/images/matrix-logo.svg @@ -0,0 +1,153 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/tests/features/home/DefaultPage.test.js b/tests/features/home/DefaultPage.test.js deleted file mode 100644 index 618b781..0000000 --- a/tests/features/home/DefaultPage.test.js +++ /dev/null @@ -1,15 +0,0 @@ -import React from 'react'; -import { shallow } from 'enzyme'; -import { DefaultPage } from '../../../src/features/home/DefaultPage'; - -describe('home/DefaultPage', () => { - it('renders node with correct class name', () => { - const props = { - home: {}, - actions: {}, - }; - const renderedComponent = shallow(); - - expect(renderedComponent.find('.home-default-page').length).toBe(1); - }); -}); diff --git a/tests/features/home/Login.test.js b/tests/features/home/Login.test.js new file mode 100644 index 0000000..fa1d370 --- /dev/null +++ b/tests/features/home/Login.test.js @@ -0,0 +1,15 @@ +import React from 'react'; +import { shallow } from 'enzyme'; +import { Login } from '../../../src/features/home/Login'; + +describe('home/Login', () => { + it('renders node with correct class name', () => { + const props = { + home: {}, + actions: {}, + }; + const renderedComponent = shallow(); + + expect(renderedComponent.find('.home-login').length).toBe(1); + }); +});