This commit is contained in:
David 2018-08-06 23:13:22 +04:30
parent 1c9661ce8e
commit faea222f02
No known key found for this signature in database
GPG key ID: D19FF700A6D04B1C
6 changed files with 191 additions and 129 deletions

View file

@ -1,22 +1,9 @@
import React from "react"; import React from "react";
import { import { Footer, Row, Col, Modal, ModalBody, ModalHeader } from "mdbreact";
Navbar,
NavbarNav,
NavbarToggler,
Collapse,
NavItem,
Footer,
NavLink,
Row,
Col,
Container,
Modal,
ModalBody,
ModalHeader
} from "mdbreact";
import { BrowserRouter as Router } from "react-router-dom"; import { BrowserRouter as Router } from "react-router-dom";
import { Link, Events, animateScroll as scroll, scrollSpy } from "react-scroll"; import { Events, animateScroll as scroll, scrollSpy } from "react-scroll";
import HomeNav from "./components/HomeNav";
import MarketingNav from "./components/MarketingNav";
import "./index.css"; import "./index.css";
import "./static/css/palmpay.css"; import "./static/css/palmpay.css";
@ -98,118 +85,7 @@ class App extends React.Component {
return ( return (
<Router> <Router>
<span id="apppage"> <span id="apppage">
{!currentPath.includes("marketing") ? ( {!currentPath.includes("marketing") ? <HomeNav /> : <MarketingNav />}
<Navbar dark expand="md" fixed="top" id="mainNav" scrolling>
<Container hidden={this.state.showmenu}>
<Link
activeClass="active"
className="navbar-brand"
to="home"
href="/"
spy={true}
smooth={true}
offset={0}
duration={500}
onSetActive={this.handleSetActive}>
<img
alt=""
className="logo1"
src="./img/logo.png"
width="100%"
/>
<img
alt=""
className="logo2"
src="./img/logo54.png"
width="100%"
style={{ display: "none" }}
/>
</Link>
<NavbarToggler onClick={this.onClick} />
<Collapse isOpen={this.state.collapse} navbar>
<NavbarNav right>
<NavItem>
<Link
activeClass="active"
className="nav-link"
to="services"
spy={true}
smooth={true}
offset={0}
duration={500}
onSetActive={this.handleSetActive}>
<span id="nav_lang1">Services</span>
</Link>
</NavItem>
<NavItem>
<Link
activeClass="active"
className="nav-link"
to="about"
spy={true}
smooth={true}
offset={0}
duration={500}
onSetActive={this.handleSetActive}>
<span id="nav_lang2">About</span>
</Link>
</NavItem>
<NavItem>
<Link
activeClass="active"
className="nav-link"
href="#testimonies"
to="testimonies"
spy={true}
smooth={true}
offset={0}
duration={500}
onSetActive={this.handleSetActive}>
<span id="nav_lang3">Testimonies</span>
</Link>
</NavItem>
<NavItem>
<NavLink to="#!" onClick={this.toggle2}>
<span id="nav_lang4">Downloads</span>
</NavLink>
</NavItem>
</NavbarNav>
</Collapse>
</Container>
</Navbar>
) : (
<Navbar
dark
expand="md"
fixed="top"
id="mainNav"
scrolling
className="top-nav-collapse">
<Container hidden={this.state.showmenu}>
<a activeClass="active" className="navbar-brand" href="/">
<img
alt=""
className="logo1"
src="./img/logo.png"
width="100%"
/>
<img
alt=""
className="logo2"
src="./img/logo54.png"
width="100%"
style={{ display: "none" }}
/>
</a>
<NavbarToggler onClick={this.onClick} />
<Collapse isOpen={this.state.collapse} navbar>
<NavbarNav right />
</Collapse>
</Container>
</Navbar>
)}
{collapsed && overlay} {collapsed && overlay}
<Routes /> <Routes />

View file

@ -0,0 +1,116 @@
import {
Navbar,
NavbarNav,
NavbarToggler,
Collapse,
NavItem,
NavLink,
Container
} from "mdbreact";
import { Link } from "react-scroll";
import React from "react";
class HomeNav extends React.Component {
constructor(props) {
super(props);
this.state = { showmenu: true };
this.state = {
collapse: false
};
this.onClick = this.onClick.bind(this);
this.handleNavbarClick = this.handleNavbarClick.bind(this);
}
onClick() {
this.setState({
collapse: !this.state.collapse
});
}
handleNavbarClick() {
this.setState({
collapse: false
});
}
render() {
return (
<Navbar dark expand="md" fixed="top" id="mainNav" scrolling>
<Container className="menuc" hidden={this.state.showmenu}>
<Link
activeClass="active"
className="navbar-brand"
to="home"
href="/"
spy={true}
smooth={true}
offset={0}
duration={500}
onSetActive={this.handleSetActive}>
<img alt="" className="logo1" src="./img/logo.png" width="100%" />
<img
alt=""
className="logo2"
src="./img/logo54.png"
width="100%"
style={{ display: "none" }}
/>
</Link>
<NavbarToggler onClick={this.onClick} />
<Collapse isOpen={this.state.collapse} navbar>
<NavbarNav right>
<NavItem>
<Link
activeClass="active"
className="nav-link"
to="services"
spy={true}
smooth={true}
offset={0}
duration={500}
onSetActive={this.handleSetActive}>
<span id="nav_lang1">Services</span>
</Link>
</NavItem>
<NavItem>
<Link
activeClass="active"
className="nav-link"
to="about"
spy={true}
smooth={true}
offset={0}
duration={500}
onSetActive={this.handleSetActive}>
<span id="nav_lang2">About</span>
</Link>
</NavItem>
<NavItem>
<Link
activeClass="active"
className="nav-link"
href="#testimonies"
to="testimonies"
spy={true}
smooth={true}
offset={0}
duration={500}
onSetActive={this.handleSetActive}>
<span id="nav_lang3">Testimonies</span>
</Link>
</NavItem>
<NavItem>
<NavLink to="#!" onClick={this.toggle2}>
<span id="nav_lang4">Downloads</span>
</NavLink>
</NavItem>
</NavbarNav>
</Collapse>
</Container>
</Navbar>
);
}
}
export default HomeNav;

View file

@ -0,0 +1,65 @@
import {
Navbar,
NavbarNav,
NavbarToggler,
Collapse,
Container
} from "mdbreact";
//import { Link } from "react-scroll";
import React from "react";
class MarketingNav extends React.Component {
constructor(props) {
super(props);
this.state = { showmenu: true };
this.state = {
collapse: false
};
this.onClick = this.onClick.bind(this);
this.handleNavbarClick = this.handleNavbarClick.bind(this);
}
onClick() {
this.setState({
collapse: !this.state.collapse
});
}
handleNavbarClick() {
this.setState({
collapse: false
});
}
render() {
return (
<Navbar
dark
expand="md"
fixed="top"
id="mainNav"
scrolling
className="top-nav-collapse">
<Container hidden={this.state.showmenu}>
<a activeClass="active" className="navbar-brand" href="/">
<img alt="" className="logo1" src="./img/logo.png" width="100%" />
<img
alt=""
className="logo2"
src="./img/logo54.png"
width="100%"
style={{ display: "none" }}
/>
</a>
<NavbarToggler onClick={this.onClick} />
<Collapse isOpen={this.state.collapse} navbar>
<NavbarNav right />
</Collapse>
</Container>
</Navbar>
);
}
}
export default MarketingNav;

View file

@ -95,3 +95,8 @@ strong.important {
#testimonies { #testimonies {
padding: 14rem 0 !important; padding: 14rem 0 !important;
} }
@media (min-width: 1200px) {
.menuc {
max-width: 90% !important;
}
}

BIN
public/img/dtube.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 297 B

BIN
public/img/steemit.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 362 B