Przeglądaj źródła

[ADD] login page

Gogs 7 lat temu
rodzic
commit
4ff0b4b584
3 zmienionych plików z 31 dodań i 11 usunięć
  1. 0 3
      src/components/App.js
  2. 21 3
      src/components/pages/Login.js
  3. 10 5
      src/routes/index.js

+ 0 - 3
src/components/App.js

@@ -7,9 +7,6 @@ import Routes from '../components/common/Routes'
 class App extends Component {
     render() {
         const theme = createMuiTheme({
-            html: {
-                fontSize: '62.5%'
-            },
             palette: {
                 primary: { 
                     main: '#0288d1'

+ 21 - 3
src/components/pages/Login.js

@@ -1,13 +1,31 @@
 import React, { Component } from 'react'
+import Paper from 'material-ui/Paper'
+import TextField from 'material-ui/TextField'
+import { withStyles } from 'material-ui/styles'
+
+const styles = theme => ({
+    root: {
+        display: 'flex',
+        alignItems: 'center',
+        justifyContent: 'center'
+    }
+})
 
 class Login extends Component {
     render() {
+        const { classes } = this.props
+
         return (
-            <div>
-                <h1>This is a login page</h1>
+            <div className={classes.root}>
+                <Paper className={classes.root} elevation={4}>
+                    <form>
+                        <TextField label='Usuario' autoComplete='off' />
+                        <TextField label='Contraseña' type='password' autoComplete='off' />
+                    </form>
+                </Paper>
             </div>
         )
     }
 }
 
-export default Login
+export default withStyles(styles)(Login)

+ 10 - 5
src/routes/index.js

@@ -1,3 +1,4 @@
+import Login from '../components/pages/Login'
 import Dashboard from '../components/pages/Dashboard'
 import ContainersList from '../components/pages/ContainersList'
 import MyTasksList from '../components/pages/MyTasksList'
@@ -5,7 +6,7 @@ import TasksList from '../components/pages/TasksList'
 import UsersList from '../components/pages/UsersList'
 import PermissionsList from '../components/pages/PermissionsList'
 import About from '../components/pages/About'
-import Page404 from '../components/pages/404'
+// import Page404 from '../components/pages/404'
 
 // import DockerIcon from '../components/icons/DockerIcon'
 // import TaskIcon from '../components/icons/TaskIcon'
@@ -15,6 +16,10 @@ import Page404 from '../components/pages/404'
 // import AboutIcon from '../components/icons/AboutIcon'
 
 const routes = [
+    {
+        path: '/login',
+        component: Login
+    },
     {
         path: '/dashboard',
         component: Dashboard,
@@ -50,10 +55,10 @@ const routes = [
         component: About,
         title: 'Acerca de'
     },
-    {
-        component: Page404,
-        title: 'Recurso no encontrado'
-    }
+    // {
+    //     component: Page404,
+    //     title: 'Recurso no encontrado'
+    // }
 ]
 
 export default routes