john/deighton-ar
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Fix a bunch of layout issues

Browse Source
This commit is contained in:
John Lyon-Smith
2018-02-26 12:05:23 -08:00
parent ab243dc6db
commit f8e930d59e
29 changed files with 279 additions and 301 deletions
Download Patch File Download Diff File Expand all files Collapse all files

35
website/src/App.js
View File

@@ -3,7 +3,7 @@ import { Login, Logout, ResetPassword, ForgotPassword, ConfirmEmail, ProtectedRo
import { Home } from './Home'
import { Profile } from './Profile'
import { Users } from './Users'
import { HolyGrail, Image, Text, Icon } from './ui'
import { Column, Row, Image, Text, Icon, Box } from './ui'
import { BrowserRouter as Router, Route, Switch } from 'react-router-dom'
import logoImage from 'images/logo.png'
import { versionInfo } from './version'
@@ -11,12 +11,21 @@ import { versionInfo } from './version'
export class App extends React.Component {
render() {
return (
<HolyGrail>
<HolyGrail.Header>
<Image source={logoImage} width={50} height={50} margin={5} />
<Icon name='logout' />
</HolyGrail.Header>
<HolyGrail.Body>
<Column minHeight='100vh'>
<Column.Item>
<Box color='#FAFAFA' borderBottom='1px solid #B2B2B2'>
<Row minWidth='100vw'>
<Row.Item>
<Image source={logoImage} width={50} height={50} margin={5} />
</Row.Item>
<Row.Item grow>&nbsp;</Row.Item>
<Row.Item>
<Icon name='logout' />
</Row.Item>
</Row>
</Box>
</Column.Item>
<Column.Item grow>
<Router basename='/'>
<Switch>
<Route path='/login' component={Login} />
@@ -30,11 +39,13 @@ export class App extends React.Component {
<Route component={Home} />{/* No Match Route */}
</Switch>
</Router>
</HolyGrail.Body>
<HolyGrail.Footer>
<Text margin={10}>{versionInfo.fullVersion} &copy; 2018, Kingston Software Solutions.</Text>
</HolyGrail.Footer>
</HolyGrail>
</Column.Item>
<Column.Item>
<Box color='#FAFAFA' borderTop='1px solid #B2B2B2'>
<Text tone='dimmed' margin={10}>{versionInfo.fullVersion} &copy; 2018, Kingston Software Solutions.</Text>
</Box>
</Column.Item>
</Column>
)
}
}