From c66ed7eea675299763ca245693d63d881a067a61 Mon Sep 17 00:00:00 2001 From: adilrza0 Date: Sun, 1 Oct 2023 16:47:12 +0530 Subject: [PATCH] changesInLandingPage --- src/AllRoutes/MainRouter.jsx | 5 +- src/AllRoutes/{Navbar.jsx => Notusable.jsx} | 192 ++--- src/App.js | 5 +- src/Components/Footer.jsx | 8 +- src/LandingComponents/Home.css | 6 +- src/LandingComponents/Home.jsx | 773 +++++++++++--------- src/LandingComponents/Navbar.jsx | 13 +- 7 files changed, 532 insertions(+), 470 deletions(-) rename src/AllRoutes/{Navbar.jsx => Notusable.jsx} (93%) diff --git a/src/AllRoutes/MainRouter.jsx b/src/AllRoutes/MainRouter.jsx index 083a827..f57377d 100644 --- a/src/AllRoutes/MainRouter.jsx +++ b/src/AllRoutes/MainRouter.jsx @@ -1,16 +1,17 @@ import React from 'react' import { Route, Routes } from 'react-router-dom' -import HomePage from '../Pages/HomePage' + import Login from '../Pages/Login' import HotelPage from '../Pages/HotelPage' import { Cart } from '../Pages/Cart' import Signup from '../Pages/Signup' import FlightPage from '../Pages/FlightPage' +import Home from '../LandingComponents/Home' export default function MainRouter() { return ( - }/> + }/> }/> }/> }/> diff --git a/src/AllRoutes/Navbar.jsx b/src/AllRoutes/Notusable.jsx similarity index 93% rename from src/AllRoutes/Navbar.jsx rename to src/AllRoutes/Notusable.jsx index 495c52b..a65e511 100644 --- a/src/AllRoutes/Navbar.jsx +++ b/src/AllRoutes/Notusable.jsx @@ -1,96 +1,96 @@ -import { NavLink } from "react-router-dom"; -import trip_wiz from "../images/trip_wiz.png" -import { Image } from "@chakra-ui/react"; - -const Navbar = () => { - - const links = [ - { - id: 1, - title: "Home", - path: "/" - }, - - { - id: 2, - title: "Hotel", - path: "/hotels" - }, - { - id: 3, - title: "Blogs", - path: "/blogs" - }, - { - id: 4, - title: "Abouts", - path: "/about" - }, - { - id: 5, - title: "Contact", - path: "/contact" - }, - { - id: 6, - title: "Login", - path: "/login" - }, - { - id: 7, - title: "Cart", - path: "/cart" - }, - ]; - - const activeStyle = { - textDecoration: 'none', - color: 'orange', - fontSize:"20px", - fontVariant: "small-caps" - }; - - const defaultStyle = { - textDecoration: 'none', - fontSize:"20px", - fontVariant: "small-caps", - backgroundColor: "#4c4177", - color:"whitesmoke", - - - - }; - const navbarStyle = { - backgroundColor: "#4c4177", - backgroundImage: "linear-gradient(315deg, #4c4177 0%, #2a5470 74%)" - } - - return ( -
- - travel - - -
- {links.map((link) => ( -
- - isActive ? activeStyle : defaultStyle - } - > - {link.title} - - -
- ))} - -
-
- ); - }; - - export { Navbar }; - +import { NavLink } from "react-router-dom"; +import trip_wiz from "../images/trip_wiz.png" +import { Image } from "@chakra-ui/react"; + +const Navbardemo = () => { + + const links = [ + { + id: 1, + title: "Home", + path: "/" + }, + + { + id: 2, + title: "Hotel", + path: "/hotels" + }, + { + id: 3, + title: "Blogs", + path: "/blogs" + }, + { + id: 4, + title: "Abouts", + path: "/about" + }, + { + id: 5, + title: "Contact", + path: "/contact" + }, + { + id: 6, + title: "Login", + path: "/login" + }, + { + id: 7, + title: "Cart", + path: "/cart" + }, + ]; + + const activeStyle = { + textDecoration: 'none', + color: 'orange', + fontSize:"20px", + fontVariant: "small-caps" + }; + + const defaultStyle = { + textDecoration: 'none', + fontSize:"20px", + fontVariant: "small-caps", + backgroundColor: "#4c4177", + color:"whitesmoke", + + + + }; + const navbarStyle = { + backgroundColor: "#4c4177", + backgroundImage: "linear-gradient(315deg, #4c4177 0%, #2a5470 74%)" + } + + return ( +
+ + travel + + +
+ {links.map((link) => ( +
+ + isActive ? activeStyle : defaultStyle + } + > + {link.title} + + +
+ ))} + +
+
+ ); + }; + + export { Navbardemo }; + diff --git a/src/App.js b/src/App.js index 2105916..7fc9c18 100644 --- a/src/App.js +++ b/src/App.js @@ -1,14 +1,15 @@ import './App.css'; import MainRouter from './AllRoutes/MainRouter'; -import { Navbar } from './AllRoutes/Navbar'; + import { ChakraProvider } from '@chakra-ui/react'; import { Footer } from './Components/Footer'; +import Navbar from './LandingComponents/Navbar'; function App() { return (
- +