header controller, forgot password, confirm refgistration, new navabr
This commit is contained in:
parent
566f00984e
commit
b6a8d9bf96
8 changed files with 538 additions and 24 deletions
BIN
smart-hut/public/avatar3.png
Normal file
BIN
smart-hut/public/avatar3.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 9.9 KiB |
BIN
smart-hut/public/title2.png
Normal file
BIN
smart-hut/public/title2.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 9.4 KiB |
BIN
smart-hut/public/title5.png
Normal file
BIN
smart-hut/public/title5.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 11 KiB |
191
smart-hut/src/components/HeaderController.js
Normal file
191
smart-hut/src/components/HeaderController.js
Normal file
|
@ -0,0 +1,191 @@
|
||||||
|
import React, { Component } from "react";
|
||||||
|
import { render } from "react-dom";
|
||||||
|
import { Button, Menu, Header, Dropdown, Icon, Grid, Divider} from 'semantic-ui-react'
|
||||||
|
import { Segment, Image } from 'semantic-ui-react'
|
||||||
|
|
||||||
|
const ImageExampleWrapped = () => (
|
||||||
|
<Image src='avatar3.png' size='tiny' centered
|
||||||
|
|
||||||
|
/>
|
||||||
|
)
|
||||||
|
|
||||||
|
const ImageExampleWrapped2 = () => (
|
||||||
|
<Image
|
||||||
|
src='smart-home.png'
|
||||||
|
size='tiny'
|
||||||
|
centered
|
||||||
|
as='a'
|
||||||
|
href='/'
|
||||||
|
/>
|
||||||
|
)
|
||||||
|
|
||||||
|
const ImageExampleWrapped3 = () => (
|
||||||
|
<Image src='title2.png' size='medium' centered/>
|
||||||
|
)
|
||||||
|
|
||||||
|
const HeaderExampleIconProp = () => (
|
||||||
|
<Header as='h2' icon='plug' color="white" content='Smart Hut' />
|
||||||
|
)
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
const GridExampleInverted = () => (
|
||||||
|
<Grid columns='equal' divided inverted padded >
|
||||||
|
<Grid.Row color='black' textAlign='center'>
|
||||||
|
<Grid.Column width={2}>
|
||||||
|
<Segment color='black' inverted>
|
||||||
|
<ImageExampleWrapped2 />
|
||||||
|
</Segment>
|
||||||
|
</Grid.Column>
|
||||||
|
<Grid.Column>
|
||||||
|
<Segment color='black' inverted>
|
||||||
|
<ImageExampleWrapped3 />
|
||||||
|
</Segment>
|
||||||
|
</Grid.Column>
|
||||||
|
<Grid.Column width={3}>
|
||||||
|
<ImageExampleWrapped />
|
||||||
|
<Divider />
|
||||||
|
<Dropdown item icon='setting' size='huge'>
|
||||||
|
<Dropdown.Menu>
|
||||||
|
<Dropdown.Item>
|
||||||
|
<Icon name='dropdown' />
|
||||||
|
<span className='text'>Settings</span>
|
||||||
|
<Dropdown.Menu>
|
||||||
|
<Dropdown.Item>Document</Dropdown.Item>
|
||||||
|
<Dropdown.Item>Image</Dropdown.Item>
|
||||||
|
</Dropdown.Menu>
|
||||||
|
</Dropdown.Item>
|
||||||
|
<Dropdown.Item>See profile...</Dropdown.Item>
|
||||||
|
<Dropdown.Divider />
|
||||||
|
<Dropdown.Item>Logout</Dropdown.Item>
|
||||||
|
</Dropdown.Menu>
|
||||||
|
</Dropdown>
|
||||||
|
</Grid.Column>
|
||||||
|
</Grid.Row>
|
||||||
|
</Grid>
|
||||||
|
)
|
||||||
|
|
||||||
|
export default class MyHeader extends React.Component {
|
||||||
|
render() {
|
||||||
|
return (
|
||||||
|
<div>
|
||||||
|
<GridExampleInverted />
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
// const navbar = {
|
||||||
|
// backgroundColor: "#20222b",
|
||||||
|
// color: "white",
|
||||||
|
// marginBottom: "4.6rem",
|
||||||
|
// padding: "3.2rem 0"
|
||||||
|
// };
|
||||||
|
// const navbar__buttons = {
|
||||||
|
// borderBottom: "1px solid lighten($light-blue, 10%)",
|
||||||
|
// display: "flex",
|
||||||
|
// justifyContent: "space-between",
|
||||||
|
// padding: "3.2rem 1.6rem"
|
||||||
|
// }
|
||||||
|
// const button = {
|
||||||
|
// background: "#8357c5",
|
||||||
|
// border: "none",
|
||||||
|
// borderBottom: "1px solid purple",
|
||||||
|
// color: "white",
|
||||||
|
// fontWeight: "500",
|
||||||
|
// padding: "1.2rem"
|
||||||
|
// }
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
// const MenuExampleButtons = () => (
|
||||||
|
// <Menu>
|
||||||
|
// <Menu.Item>
|
||||||
|
// <Button primary>Sign up</Button>
|
||||||
|
// </Menu.Item>
|
||||||
|
|
||||||
|
// <Menu.Item>
|
||||||
|
// <Button>Log-in</Button>
|
||||||
|
// </Menu.Item>
|
||||||
|
// <Menu.Item>
|
||||||
|
// <Button>Log-in</Button>
|
||||||
|
// </Menu.Item>
|
||||||
|
// <Menu.Item>
|
||||||
|
// <Button>Log-in</Button>
|
||||||
|
// </Menu.Item>
|
||||||
|
// </Menu>
|
||||||
|
// )
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
// class MenuExampleInvertedSegment extends Component {
|
||||||
|
// state = { activeItem: 'home' }
|
||||||
|
|
||||||
|
// handleItemClick = (e, { name }) => this.setState({ activeItem: name })
|
||||||
|
|
||||||
|
// render() {
|
||||||
|
// const { activeItem } = this.state
|
||||||
|
|
||||||
|
// return (
|
||||||
|
// <Segment inverted>
|
||||||
|
// <Menu inverted secondary>
|
||||||
|
// <Menu.Item
|
||||||
|
// name='home'
|
||||||
|
// active={activeItem === 'home'}
|
||||||
|
// onClick={this.handleItemClick}
|
||||||
|
// />
|
||||||
|
// <Menu.Item
|
||||||
|
// name='messages'
|
||||||
|
// active={activeItem === 'messages'}
|
||||||
|
// onClick={this.handleItemClick}
|
||||||
|
// />
|
||||||
|
// <Menu.Item />
|
||||||
|
// <Menu.Item />
|
||||||
|
// <Menu.Item />
|
||||||
|
// <Menu.Item />
|
||||||
|
// <Menu.Item />
|
||||||
|
// <Menu.Item />
|
||||||
|
// <HeaderExampleIconProp />
|
||||||
|
// <Menu.Item />
|
||||||
|
// <Menu.Item />
|
||||||
|
// <Menu.Item />
|
||||||
|
// <Menu.Item />
|
||||||
|
// <Menu.Item />
|
||||||
|
// <Menu.Item
|
||||||
|
// name='messages'
|
||||||
|
// active={activeItem === 'messages'}
|
||||||
|
// onClick={this.handleItemClick}
|
||||||
|
// />
|
||||||
|
// <Dropdown item icon='wrench' simple>
|
||||||
|
// <Dropdown.Menu>
|
||||||
|
// <Dropdown.Item>
|
||||||
|
// <Icon name='dropdown' />
|
||||||
|
// <span className='text'>New</span>
|
||||||
|
|
||||||
|
// <Dropdown.Menu>
|
||||||
|
// <Dropdown.Item>Document</Dropdown.Item>
|
||||||
|
// <Dropdown.Item>Image</Dropdown.Item>
|
||||||
|
// </Dropdown.Menu>
|
||||||
|
// </Dropdown.Item>
|
||||||
|
// <Dropdown.Item>Open</Dropdown.Item>
|
||||||
|
// <Dropdown.Item>Save...</Dropdown.Item>
|
||||||
|
// <Dropdown.Item>Edit Permissions</Dropdown.Item>
|
||||||
|
// <Dropdown.Divider />
|
||||||
|
// <Dropdown.Header>Export</Dropdown.Header>
|
||||||
|
// <Dropdown.Item>Share</Dropdown.Item>
|
||||||
|
// </Dropdown.Menu>
|
||||||
|
// </Dropdown>
|
||||||
|
// <ImageExampleWrapped />
|
||||||
|
// <Menu.Item />
|
||||||
|
// </Menu>
|
||||||
|
// </Segment>
|
||||||
|
// )
|
||||||
|
// }
|
||||||
|
// }
|
130
smart-hut/src/components/HomeNavbar.js
Normal file
130
smart-hut/src/components/HomeNavbar.js
Normal file
|
@ -0,0 +1,130 @@
|
||||||
|
import _ from "lodash";
|
||||||
|
import React, { Component } from "react";
|
||||||
|
import { render } from "react-dom";
|
||||||
|
import {
|
||||||
|
Container,
|
||||||
|
Icon,
|
||||||
|
Image,
|
||||||
|
Menu,
|
||||||
|
Sidebar,
|
||||||
|
Responsive
|
||||||
|
} from "semantic-ui-react";
|
||||||
|
|
||||||
|
|
||||||
|
const NavBarMobile = ({
|
||||||
|
children,
|
||||||
|
leftItems,
|
||||||
|
onPusherClick,
|
||||||
|
onToggle,
|
||||||
|
rightItems,
|
||||||
|
visible
|
||||||
|
}) => (
|
||||||
|
<Sidebar.Pushable>
|
||||||
|
<Sidebar
|
||||||
|
as={Menu}
|
||||||
|
animation="overlay"
|
||||||
|
icon="labeled"
|
||||||
|
inverted
|
||||||
|
items={leftItems}
|
||||||
|
vertical
|
||||||
|
visible={visible}
|
||||||
|
/>
|
||||||
|
<Sidebar.Pusher
|
||||||
|
dimmed={visible}
|
||||||
|
onClick={onPusherClick}
|
||||||
|
style={{ minHeight: "100vh" }}
|
||||||
|
>
|
||||||
|
<Menu fixed="top" inverted>
|
||||||
|
<Menu.Item>
|
||||||
|
<Image size="mini" src="smart-home_index.png" />
|
||||||
|
</Menu.Item>
|
||||||
|
<Menu.Item onClick={onToggle}>
|
||||||
|
<Icon name="sidebar" />
|
||||||
|
</Menu.Item>
|
||||||
|
<Menu.Menu position="right">
|
||||||
|
{_.map(rightItems, item => <Menu.Item {...item} />)}
|
||||||
|
</Menu.Menu>
|
||||||
|
</Menu>
|
||||||
|
{children}
|
||||||
|
</Sidebar.Pusher>
|
||||||
|
</Sidebar.Pushable>
|
||||||
|
);
|
||||||
|
|
||||||
|
const NavBarDesktop = ({ leftItems, rightItems }) => (
|
||||||
|
<Menu fixed="top" inverted>
|
||||||
|
<Menu.Item>
|
||||||
|
<Image size="mini" src="smart-home_index.png" />
|
||||||
|
</Menu.Item>
|
||||||
|
{_.map(leftItems, item => <Menu.Item {...item} />)}
|
||||||
|
<Menu.Menu position="right">
|
||||||
|
{_.map(rightItems, item => <Menu.Item {...item} />)}
|
||||||
|
</Menu.Menu>
|
||||||
|
</Menu>
|
||||||
|
);
|
||||||
|
|
||||||
|
const NavBarChildren = ({ children }) => (
|
||||||
|
<Container style={{ marginTop: "5em" }}>{children}</Container>
|
||||||
|
);
|
||||||
|
|
||||||
|
|
||||||
|
class HomeNavabarApp extends Component {
|
||||||
|
constructor(props) {
|
||||||
|
super(props);
|
||||||
|
this.state = {
|
||||||
|
logged : true,
|
||||||
|
email: "",
|
||||||
|
password : ""
|
||||||
|
};
|
||||||
|
}
|
||||||
|
state = {
|
||||||
|
visible: false
|
||||||
|
};
|
||||||
|
|
||||||
|
handlePusher = () => {
|
||||||
|
const { visible } = this.state;
|
||||||
|
|
||||||
|
if (visible) this.setState({ visible: false });
|
||||||
|
};
|
||||||
|
|
||||||
|
handleToggle = () => this.setState({ visible: !this.state.visible });
|
||||||
|
|
||||||
|
render() {
|
||||||
|
const { children, leftItems, rightItems } = this.props;
|
||||||
|
const { visible } = this.state;
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div>
|
||||||
|
<Responsive {...Responsive.onlyMobile}>
|
||||||
|
<NavBarMobile
|
||||||
|
leftItems={leftItems}
|
||||||
|
onPusherClick={this.handlePusher}
|
||||||
|
onToggle={this.handleToggle}
|
||||||
|
rightItems={rightItems}
|
||||||
|
visible={visible}
|
||||||
|
>
|
||||||
|
<NavBarChildren>{children}</NavBarChildren>
|
||||||
|
</NavBarMobile>
|
||||||
|
</Responsive>
|
||||||
|
<Responsive minWidth={Responsive.onlyTablet.minWidth}>
|
||||||
|
<NavBarDesktop leftItems={leftItems} rightItems={rightItems} />
|
||||||
|
<NavBarChildren>{children}</NavBarChildren>
|
||||||
|
</Responsive>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
const leftItems = [
|
||||||
|
{ as: "a", content: "Home", key: "home", href:"/" },
|
||||||
|
];
|
||||||
|
const rightItems = [
|
||||||
|
{ as: "a", content: "Login", key: "login", href:"/login" },
|
||||||
|
{ as: "a", content: "Sign up", key: "register", href:"/signup" }
|
||||||
|
];
|
||||||
|
|
||||||
|
const HomeNavbarApp = () => (
|
||||||
|
<HomeNavabarApp leftItems={leftItems} rightItems={rightItems}>
|
||||||
|
</HomeNavabarApp>
|
||||||
|
);
|
||||||
|
|
||||||
|
export default HomeNavbarApp;
|
107
smart-hut/src/views/ConfirmForgotPassword.js
Normal file
107
smart-hut/src/views/ConfirmForgotPassword.js
Normal file
|
@ -0,0 +1,107 @@
|
||||||
|
import React, { Component } from "react";
|
||||||
|
import { render } from "react-dom";
|
||||||
|
import HomeNavbar from "./../components/HomeNavbar";
|
||||||
|
import {
|
||||||
|
Container,
|
||||||
|
Icon,
|
||||||
|
Image,
|
||||||
|
Menu,
|
||||||
|
Sidebar,
|
||||||
|
Responsive,
|
||||||
|
Header,
|
||||||
|
Divider,
|
||||||
|
Message,
|
||||||
|
Grid
|
||||||
|
} from "semantic-ui-react";
|
||||||
|
|
||||||
|
class Paragraph extends Component {
|
||||||
|
state = { visible: true }
|
||||||
|
|
||||||
|
handleDismiss = () => {
|
||||||
|
this.setState({ visible: false })
|
||||||
|
|
||||||
|
setTimeout(() => {
|
||||||
|
this.setState({ visible: true })
|
||||||
|
}, 2000)
|
||||||
|
}
|
||||||
|
|
||||||
|
render() {
|
||||||
|
if (this.state.visible) {
|
||||||
|
return (
|
||||||
|
<Message
|
||||||
|
onDismiss={this.handleDismiss}
|
||||||
|
header='Link has been sent!'
|
||||||
|
content='An e-mail has been sent your address, please follow the
|
||||||
|
instruction to create a new password'
|
||||||
|
/>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
return (
|
||||||
|
<p>
|
||||||
|
<br />
|
||||||
|
<i>The message will return in 2s</i>
|
||||||
|
<br />
|
||||||
|
<br />
|
||||||
|
</p>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
const MessageReg = () => (
|
||||||
|
<Grid>
|
||||||
|
<HomeNavbar />
|
||||||
|
<Divider />
|
||||||
|
<Grid.Row height={3}>
|
||||||
|
</Grid.Row>
|
||||||
|
<Grid.Row height={3}>
|
||||||
|
</Grid.Row>
|
||||||
|
<Grid.Row height={3}>
|
||||||
|
</Grid.Row>
|
||||||
|
<Grid.Row height={3}>
|
||||||
|
<Grid.Column width={6}>
|
||||||
|
</Grid.Column>
|
||||||
|
<Grid.Column width={10}>
|
||||||
|
<Image src='title5.png' />
|
||||||
|
</Grid.Column>
|
||||||
|
<Grid.Column width={3}>
|
||||||
|
</Grid.Column>
|
||||||
|
</Grid.Row>
|
||||||
|
<Grid.Row height={3}>
|
||||||
|
</Grid.Row>
|
||||||
|
<Grid.Row height={3}>
|
||||||
|
</Grid.Row>
|
||||||
|
<Grid.Column width={3}>
|
||||||
|
</Grid.Column>
|
||||||
|
<Grid.Column width={4}>
|
||||||
|
<Image src='./img/logo.png' />
|
||||||
|
</Grid.Column>
|
||||||
|
<Grid.Column width={6}>
|
||||||
|
<Paragraph />
|
||||||
|
</Grid.Column>
|
||||||
|
<Grid.Column width={4}>
|
||||||
|
</Grid.Column>
|
||||||
|
<Grid.Row height={3}>
|
||||||
|
</Grid.Row>
|
||||||
|
<Grid.Row height={3}>
|
||||||
|
</Grid.Row>
|
||||||
|
<Grid.Row height={3}>
|
||||||
|
<Grid.Column width={3}>
|
||||||
|
</Grid.Column>
|
||||||
|
<Grid.Column width={10}>
|
||||||
|
<Divider />
|
||||||
|
</Grid.Column>
|
||||||
|
<Grid.Column width={3}>
|
||||||
|
</Grid.Column>
|
||||||
|
</Grid.Row>
|
||||||
|
</Grid>
|
||||||
|
)
|
||||||
|
|
||||||
|
export default class ConfirmForgotPasswrod extends React.Component {
|
||||||
|
render () {
|
||||||
|
return (
|
||||||
|
<MessageReg />
|
||||||
|
)
|
||||||
|
}
|
||||||
|
}
|
107
smart-hut/src/views/ConfirmRegistration.js
Normal file
107
smart-hut/src/views/ConfirmRegistration.js
Normal file
|
@ -0,0 +1,107 @@
|
||||||
|
import React, { Component } from "react";
|
||||||
|
import { render } from "react-dom";
|
||||||
|
import HomeNavbar from "./../components/HomeNavbar";
|
||||||
|
import {
|
||||||
|
Container,
|
||||||
|
Icon,
|
||||||
|
Image,
|
||||||
|
Menu,
|
||||||
|
Sidebar,
|
||||||
|
Responsive,
|
||||||
|
Header,
|
||||||
|
Divider,
|
||||||
|
Message,
|
||||||
|
Grid
|
||||||
|
} from "semantic-ui-react";
|
||||||
|
|
||||||
|
class Paragraph extends Component {
|
||||||
|
state = { visible: true }
|
||||||
|
|
||||||
|
handleDismiss = () => {
|
||||||
|
this.setState({ visible: false })
|
||||||
|
|
||||||
|
setTimeout(() => {
|
||||||
|
this.setState({ visible: true })
|
||||||
|
}, 2000)
|
||||||
|
}
|
||||||
|
|
||||||
|
render() {
|
||||||
|
if (this.state.visible) {
|
||||||
|
return (
|
||||||
|
<Message
|
||||||
|
onDismiss={this.handleDismiss}
|
||||||
|
header='Congratulation!'
|
||||||
|
content='An e-mail has been sent your address, please confirm
|
||||||
|
your registration by following the enclosed link'
|
||||||
|
/>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
return (
|
||||||
|
<p>
|
||||||
|
<br />
|
||||||
|
<i>The message will return in 2s</i>
|
||||||
|
<br />
|
||||||
|
<br />
|
||||||
|
</p>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
const MessageReg = () => (
|
||||||
|
<Grid>
|
||||||
|
<HomeNavbar />
|
||||||
|
<Divider />
|
||||||
|
<Grid.Row height={3}>
|
||||||
|
</Grid.Row>
|
||||||
|
<Grid.Row height={3}>
|
||||||
|
</Grid.Row>
|
||||||
|
<Grid.Row height={3}>
|
||||||
|
</Grid.Row>
|
||||||
|
<Grid.Row height={3}>
|
||||||
|
<Grid.Column width={6}>
|
||||||
|
</Grid.Column>
|
||||||
|
<Grid.Column width={10}>
|
||||||
|
<Image src='title5.png' />
|
||||||
|
</Grid.Column>
|
||||||
|
<Grid.Column width={3}>
|
||||||
|
</Grid.Column>
|
||||||
|
</Grid.Row>
|
||||||
|
<Grid.Row height={3}>
|
||||||
|
</Grid.Row>
|
||||||
|
<Grid.Row height={3}>
|
||||||
|
</Grid.Row>
|
||||||
|
<Grid.Column width={3}>
|
||||||
|
</Grid.Column>
|
||||||
|
<Grid.Column width={4}>
|
||||||
|
<Image src='./img/logo.png' />
|
||||||
|
</Grid.Column>
|
||||||
|
<Grid.Column width={6}>
|
||||||
|
<Paragraph />
|
||||||
|
</Grid.Column>
|
||||||
|
<Grid.Column width={4}>
|
||||||
|
</Grid.Column>
|
||||||
|
<Grid.Row height={3}>
|
||||||
|
</Grid.Row>
|
||||||
|
<Grid.Row height={3}>
|
||||||
|
</Grid.Row>
|
||||||
|
<Grid.Row height={3}>
|
||||||
|
<Grid.Column width={3}>
|
||||||
|
</Grid.Column>
|
||||||
|
<Grid.Column width={10}>
|
||||||
|
<Divider />
|
||||||
|
</Grid.Column>
|
||||||
|
<Grid.Column width={3}>
|
||||||
|
</Grid.Column>
|
||||||
|
</Grid.Row>
|
||||||
|
</Grid>
|
||||||
|
)
|
||||||
|
|
||||||
|
export default class ConfirmRegistration extends React.Component {
|
||||||
|
render () {
|
||||||
|
return (
|
||||||
|
<MessageReg />
|
||||||
|
)
|
||||||
|
}
|
||||||
|
}
|
|
@ -1,8 +1,10 @@
|
||||||
import PropTypes from 'prop-types';
|
import PropTypes from 'prop-types';
|
||||||
import React, { Component } from 'react';
|
import React, { Component } from 'react';
|
||||||
|
import HomeNavbar from './../components/HomeNavbar';
|
||||||
import {
|
import {
|
||||||
Button,
|
Button,
|
||||||
Container,
|
Container,
|
||||||
|
Divider,
|
||||||
Grid,
|
Grid,
|
||||||
Header,
|
Header,
|
||||||
Icon,
|
Icon,
|
||||||
|
@ -88,30 +90,7 @@ class DesktopContainer extends Component {
|
||||||
}}
|
}}
|
||||||
vertical
|
vertical
|
||||||
>
|
>
|
||||||
<Menu
|
<HomeNavbar />
|
||||||
fixed="top"
|
|
||||||
inverted={!fixed}
|
|
||||||
pointing={!fixed}
|
|
||||||
primary
|
|
||||||
size='large'
|
|
||||||
borderless
|
|
||||||
|
|
||||||
>
|
|
||||||
<Container>
|
|
||||||
<Menu.Item as='a' active>
|
|
||||||
Home
|
|
||||||
</Menu.Item>
|
|
||||||
|
|
||||||
<Menu.Item position='right'>
|
|
||||||
<Button as='a' href="/login" inverted={!fixed}>
|
|
||||||
Log in
|
|
||||||
</Button>
|
|
||||||
<Button as='a' href="/signup" inverted={!fixed} primary={fixed} style={{ marginLeft: '0.5em' }}>
|
|
||||||
Sign Up
|
|
||||||
</Button>
|
|
||||||
</Menu.Item>
|
|
||||||
</Container>
|
|
||||||
</Menu>
|
|
||||||
<HomepageHeading />
|
<HomepageHeading />
|
||||||
</Segment>
|
</Segment>
|
||||||
</Visibility>
|
</Visibility>
|
||||||
|
|
Loading…
Reference in a new issue