react_App.js
import React from 'react';
import './App.css';
import './style.css';
import './fonts/icomoon/style.css';
import $ from 'jquery';
import Home from './home';
import Users from './users';
import Contact from './contact';
import { BrowserRouter as Router, Switch, Route } from 'react-router-dom';
class App extends React.Component {
constructor(){
super();
}
componentDidMount() {
}
slideMenu(e) {
$('body').addClass('offcanvas-menu');
};
unSlideMenu(e){
$('body').removeClass('offcanvas-menu');
}
render() {
return (
<Router>
<body data-spy="scroll" data-target=".site-navbar-target" data-offset="300">
<div className="site-wrap">
<div className="site-mobile-menu site-navbar-target">
<div className="site-mobile-menu-header">
<div className="site-mobile-menu-close mt-3">
<span className="icon-close2 js-menu-toggle" onClick={this.unSlideMenu}></span>
</div>
</div>
<div className="site-mobile-menu-body">
<nav className="site-navigation position-relative text-right" role="navigation">
<a href="/" className="nav-link">Home</a>
<a href="/users" className="nav-link">Create Ticket</a>
<a href="/contact" className="nav-link">Our Contacts</a>
</nav>
</div>
</div>
<header className="site-navbar py-4 bg-white js-sticky-header site-navbar-target" role="banner">
<div className="container-fluid">
<div className="row align-items-center">
<div className="col-12 col-md-12 d-none d-xl-block">
<nav className="site-navigation position-relative text-right" role="navigation">
<ul className="site-menu main-menu js-clone-nav mr-auto d-none d-lg-block">
<li><a href="/" className="nav-link">Home</a></li>
<li><a href="/users" className="nav-link">Create Ticket</a></li>
<li><a href="/contact" className="nav-link">Our Contacts</a></li>
</ul>
</nav>
<hr />
</div>
<div className="col-12 d-inline-block d-xl-none ml-md-0 py-3">
<a href="#" className="site-menu-toggle js-menu-toggle text-black float-right" onClick={this.slideMenu}>
<span className="icon-menu h3"></span>
</a>
</div>
</div>
</div>
</header>
<Switch>
<Route exact path='/' component={Home} />
<Route path='/users' component={Users} />
<Route path='/contact' component={Contact} />
</Switch>
</div>
</body>
</Router>
)
}
}
export default App;
Comments
Post a Comment