├── src
├── Images
│ ├── .dummy
│ ├── Rent.png
│ ├── titleIcon.png
│ ├── Homepage
│ │ ├── star.png
│ │ ├── mobile.png
│ │ ├── nIcon.png
│ │ ├── rental.png
│ │ ├── building.png
│ │ ├── homeLoan.png
│ │ ├── playStore.png
│ │ ├── saleAgree.png
│ │ ├── savings.png
│ │ ├── shortlist.png
│ │ ├── noBrokerNri.png
│ │ ├── avoidBrokers.png
│ │ ├── builderProject.png
│ │ ├── freeLisiting.png
│ │ ├── propertyServices.png
│ │ ├── homeInteriors.svg
│ │ └── iosDownload.svg
│ ├── navbar
│ │ ├── logo.png
│ │ ├── payrent.png
│ │ ├── myBookings.svg
│ │ └── logo.svg
│ ├── Login
│ │ ├── signupHome.png
│ │ └── whatsappIcon.png
│ ├── landing_features_bgr.png
│ └── footer
│ │ ├── youtube.svg
│ │ └── iosDownload.svg
├── Pages
│ ├── .dummy
│ ├── Homepage
│ │ ├── ReviewCard.jsx
│ │ ├── CommercialOption.jsx
│ │ ├── BuyOption.jsx
│ │ ├── RentOption.jsx
│ │ ├── OurCoustomerReview.jsx
│ │ └── Homepage.module.css
│ ├── LoginSignup
│ │ ├── LoginSignup.module.css
│ │ └── Login.jsx
│ └── SearchPage
│ │ └── SearchPage.jsx
├── Redux
│ ├── .dummy
│ ├── LoginSignup
│ │ ├── actionTypes.js
│ │ ├── action.js
│ │ └── reducer.js
│ └── store.js
├── Styles
│ ├── .dummy
│ └── SearchPages
│ │ ├── filter.css
│ │ └── searchpage.css
├── Components
│ ├── .dummy
│ ├── Rent_Page
│ │ ├── components
│ │ │ ├── payment.jsx
│ │ │ ├── forminput.jsx
│ │ │ ├── slider.jsx
│ │ │ ├── testimonoals.jsx
│ │ │ └── question.jsx
│ │ ├── rent.jsx
│ │ ├── userdetail.jsx
│ │ ├── rent.module.css
│ │ └── detailshow.jsx
│ ├── SearchPages
│ │ ├── AdsSection.jsx
│ │ ├── QuickLinksSearchPage.jsx
│ │ ├── SearchBar.jsx
│ │ ├── ResultShower.jsx
│ │ ├── FilterForSearchPage.jsx
│ │ └── DataCard.jsx
│ ├── Footer
│ │ ├── FooterSubOptionsText.jsx
│ │ ├── Footer.jsx
│ │ ├── Footer.module.css
│ │ ├── FooterSubOptions3.jsx
│ │ ├── FooterSubOptions7.jsx
│ │ ├── FooterSubOptions4.jsx
│ │ ├── FooterSubOptions2.jsx
│ │ ├── FooterSubOptions5.jsx
│ │ ├── FooterSubOptions1.jsx
│ │ ├── FooterSubOptions6.jsx
│ │ └── FooterOptions.jsx
│ ├── Payment_Detail
│ │ ├── payment.jsx
│ │ ├── slider.jsx
│ │ ├── newslide.jsx
│ │ ├── PaymentInfo.jsx
│ │ └── payment_detail.jsx
│ ├── Card_Detail_Page
│ │ ├── payment.jsx
│ │ ├── PaymentInfo.jsx
│ │ └── payment_detail.jsx
│ └── Navbar
│ │ ├── NavBar.module.css
│ │ └── Navbar.jsx
├── index.css
├── index.js
├── App.css
└── App.js
├── public
├── robots.txt
├── favicon.ico
├── logo192.png
├── logo512.png
├── manifest.json
└── index.html
├── .gitignore
├── README.md
└── package.json
/src/Images/.dummy:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/src/Pages/.dummy:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/src/Redux/.dummy:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/src/Styles/.dummy:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/src/Components/.dummy:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/src/Components/Rent_Page/components/payment.jsx:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/src/Components/Rent_Page/components/forminput.jsx:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/public/robots.txt:
--------------------------------------------------------------------------------
1 | # https://www.robotstxt.org/robotstxt.html
2 | User-agent: *
3 | Disallow:
4 |
--------------------------------------------------------------------------------
/public/favicon.ico:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/SaurabhSinghRbz/no-broker-clone/HEAD/public/favicon.ico
--------------------------------------------------------------------------------
/public/logo192.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/SaurabhSinghRbz/no-broker-clone/HEAD/public/logo192.png
--------------------------------------------------------------------------------
/public/logo512.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/SaurabhSinghRbz/no-broker-clone/HEAD/public/logo512.png
--------------------------------------------------------------------------------
/src/Images/Rent.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/SaurabhSinghRbz/no-broker-clone/HEAD/src/Images/Rent.png
--------------------------------------------------------------------------------
/src/Images/titleIcon.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/SaurabhSinghRbz/no-broker-clone/HEAD/src/Images/titleIcon.png
--------------------------------------------------------------------------------
/src/Images/Homepage/star.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/SaurabhSinghRbz/no-broker-clone/HEAD/src/Images/Homepage/star.png
--------------------------------------------------------------------------------
/src/Images/navbar/logo.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/SaurabhSinghRbz/no-broker-clone/HEAD/src/Images/navbar/logo.png
--------------------------------------------------------------------------------
/src/Images/Homepage/mobile.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/SaurabhSinghRbz/no-broker-clone/HEAD/src/Images/Homepage/mobile.png
--------------------------------------------------------------------------------
/src/Images/Homepage/nIcon.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/SaurabhSinghRbz/no-broker-clone/HEAD/src/Images/Homepage/nIcon.png
--------------------------------------------------------------------------------
/src/Images/Homepage/rental.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/SaurabhSinghRbz/no-broker-clone/HEAD/src/Images/Homepage/rental.png
--------------------------------------------------------------------------------
/src/Images/navbar/payrent.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/SaurabhSinghRbz/no-broker-clone/HEAD/src/Images/navbar/payrent.png
--------------------------------------------------------------------------------
/src/Images/Homepage/building.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/SaurabhSinghRbz/no-broker-clone/HEAD/src/Images/Homepage/building.png
--------------------------------------------------------------------------------
/src/Images/Homepage/homeLoan.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/SaurabhSinghRbz/no-broker-clone/HEAD/src/Images/Homepage/homeLoan.png
--------------------------------------------------------------------------------
/src/Images/Homepage/playStore.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/SaurabhSinghRbz/no-broker-clone/HEAD/src/Images/Homepage/playStore.png
--------------------------------------------------------------------------------
/src/Images/Homepage/saleAgree.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/SaurabhSinghRbz/no-broker-clone/HEAD/src/Images/Homepage/saleAgree.png
--------------------------------------------------------------------------------
/src/Images/Homepage/savings.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/SaurabhSinghRbz/no-broker-clone/HEAD/src/Images/Homepage/savings.png
--------------------------------------------------------------------------------
/src/Images/Homepage/shortlist.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/SaurabhSinghRbz/no-broker-clone/HEAD/src/Images/Homepage/shortlist.png
--------------------------------------------------------------------------------
/src/Images/Login/signupHome.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/SaurabhSinghRbz/no-broker-clone/HEAD/src/Images/Login/signupHome.png
--------------------------------------------------------------------------------
/src/Images/Login/whatsappIcon.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/SaurabhSinghRbz/no-broker-clone/HEAD/src/Images/Login/whatsappIcon.png
--------------------------------------------------------------------------------
/src/Images/Homepage/noBrokerNri.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/SaurabhSinghRbz/no-broker-clone/HEAD/src/Images/Homepage/noBrokerNri.png
--------------------------------------------------------------------------------
/src/Images/landing_features_bgr.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/SaurabhSinghRbz/no-broker-clone/HEAD/src/Images/landing_features_bgr.png
--------------------------------------------------------------------------------
/src/Images/Homepage/avoidBrokers.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/SaurabhSinghRbz/no-broker-clone/HEAD/src/Images/Homepage/avoidBrokers.png
--------------------------------------------------------------------------------
/src/Images/Homepage/builderProject.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/SaurabhSinghRbz/no-broker-clone/HEAD/src/Images/Homepage/builderProject.png
--------------------------------------------------------------------------------
/src/Images/Homepage/freeLisiting.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/SaurabhSinghRbz/no-broker-clone/HEAD/src/Images/Homepage/freeLisiting.png
--------------------------------------------------------------------------------
/src/Images/Homepage/propertyServices.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/SaurabhSinghRbz/no-broker-clone/HEAD/src/Images/Homepage/propertyServices.png
--------------------------------------------------------------------------------
/src/Redux/LoginSignup/actionTypes.js:
--------------------------------------------------------------------------------
1 | export const LOGINSIGNUPREQ = "LOGINSIGNUPREQ";
2 | export const ADDAUSER = "ADDAUSER";
3 | export const ISUSERLOGGED = "ISUSERLOGGED";
--------------------------------------------------------------------------------
/src/Styles/SearchPages/filter.css:
--------------------------------------------------------------------------------
1 | .apartmentType{
2 | padding: 0.3rem;
3 | padding-left: 0px;
4 | padding-right: 0px;
5 | border: none;
6 | background-color: rgb(240, 240, 240);
7 | }
--------------------------------------------------------------------------------
/src/Components/SearchPages/AdsSection.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react'
2 |
3 | export const AdsSection = (props) => {
4 | const url = props.item;
5 | return (
6 |
7 |
8 |
9 | )
10 | }
11 |
--------------------------------------------------------------------------------
/src/Components/Footer/FooterSubOptionsText.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react'
2 | import { Text } from "@chakra-ui/react"
3 |
4 | function FooterSubOptionsText({ text }) {
5 | return (
6 | <>
7 | {text}
8 | >
9 | )
10 | }
11 |
12 | export default FooterSubOptionsText
--------------------------------------------------------------------------------
/src/Components/Footer/Footer.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react'
2 | import { Box } from "@chakra-ui/react"
3 | import FooterOptions from './FooterOptions'
4 | import "./Footer.module.css"
5 | function Footer() {
6 | return (
7 |
8 |
9 |
10 | )
11 | }
12 |
13 | export default Footer
--------------------------------------------------------------------------------
/src/Redux/store.js:
--------------------------------------------------------------------------------
1 | import { createStore } from "redux"
2 | import {
3 | loginReqReducer
4 | } from "./LoginSignup/reducer";
5 |
6 | export const store = createStore(loginReqReducer, window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__())
7 |
8 | store.subscribe(() => {
9 | console.log(store.getState());
10 | });
11 |
--------------------------------------------------------------------------------
/src/index.css:
--------------------------------------------------------------------------------
1 | body {
2 | margin: 0;
3 | font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
4 | 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
5 | sans-serif;
6 | -webkit-font-smoothing: antialiased;
7 | -moz-osx-font-smoothing: grayscale;
8 | }
9 |
10 | code {
11 | font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
12 | monospace;
13 | }
14 |
--------------------------------------------------------------------------------
/.gitignore:
--------------------------------------------------------------------------------
1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
2 |
3 | # dependencies
4 | /node_modules
5 | /.pnp
6 | .pnp.js
7 |
8 | # testing
9 | /coverage
10 |
11 | # production
12 | /build
13 |
14 | # misc
15 | .DS_Store
16 | .env.local
17 | .env.development.local
18 | .env.test.local
19 | .env.production.local
20 |
21 | npm-debug.log*
22 | yarn-debug.log*
23 | yarn-error.log*
24 |
25 | # Local Netlify folder
26 | .netlify
27 |
--------------------------------------------------------------------------------
/src/Images/navbar/myBookings.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/src/Redux/LoginSignup/action.js:
--------------------------------------------------------------------------------
1 | import { ADDAUSER, ISUSERLOGGED, LOGINSIGNUPREQ } from "./actionTypes"
2 |
3 | export const loginSignupReq = (data) => {
4 | return {
5 | type: LOGINSIGNUPREQ,
6 | payload: data
7 | }
8 | }
9 |
10 |
11 | export const addAUser = (data) => {
12 | return {
13 | type: ADDAUSER,
14 | payload: data
15 | }
16 | }
17 |
18 |
19 | export const isUserLogged = (data) => {
20 | return {
21 | type: ISUSERLOGGED,
22 | payload: data
23 | }
24 | }
--------------------------------------------------------------------------------
/public/manifest.json:
--------------------------------------------------------------------------------
1 | {
2 | "short_name": "React App",
3 | "name": "Create React App Sample",
4 | "icons": [
5 | {
6 | "src": "favicon.ico",
7 | "sizes": "64x64 32x32 24x24 16x16",
8 | "type": "image/x-icon"
9 | },
10 | {
11 | "src": "logo192.png",
12 | "type": "image/png",
13 | "sizes": "192x192"
14 | },
15 | {
16 | "src": "logo512.png",
17 | "type": "image/png",
18 | "sizes": "512x512"
19 | }
20 | ],
21 | "start_url": ".",
22 | "display": "standalone",
23 | "theme_color": "#000000",
24 | "background_color": "#ffffff"
25 | }
26 |
--------------------------------------------------------------------------------
/src/index.js:
--------------------------------------------------------------------------------
1 | import React from "react";
2 | import ReactDOM from "react-dom/client";
3 | import "./index.css";
4 | import App from "./App";
5 | import { BrowserRouter } from "react-router-dom";
6 | import { ChakraProvider } from "@chakra-ui/react"
7 | import { Provider } from "react-redux";
8 | import { store } from "./Redux/store";
9 |
10 |
11 |
12 | const root = ReactDOM.createRoot(document.getElementById("root"));
13 | root.render(
14 |
15 |
16 |
17 |
18 |
19 |
20 |
21 | );
22 |
--------------------------------------------------------------------------------
/src/Redux/LoginSignup/reducer.js:
--------------------------------------------------------------------------------
1 | import { ADDAUSER, ISUSERLOGGED, LOGINSIGNUPREQ } from "./actionTypes";
2 |
3 | const initState = {
4 | loginReq: false,
5 | userData: [],
6 | isUserLoggedIn: false
7 | };
8 |
9 | export const loginReqReducer = (state = initState, action) => {
10 | switch (action.type) {
11 | case LOGINSIGNUPREQ: {
12 | return { ...state, loginReq: action.payload };
13 | }
14 | case ADDAUSER: {
15 | return { ...state, userData: [...state.userData, action.payload] };
16 | }
17 | case ISUSERLOGGED: {
18 | return { ...state, isUserLoggedIn: true };
19 | }
20 | default: {
21 | return { ...state }
22 | }
23 | }
24 | };
25 |
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | # No Broker Clone
2 | 
3 |
4 | ## About
5 | Welcome to NoBroker! NoBroker is a disruptive real-estate platform that makes it possible to buy/sell/rent a house without paying any brokerage NoBroker was started because all of us believed that paying hefty brokerage can not be the only option to find a new home. As tenants, we have been paying these brokerages year on year without seeing any advantage of the broker. The only reason he existed was that there was a huge information asymmetry in the market. NoBroker is a platform that removes this information asymmetry and provides a marketplace for free exchange of this information that used to cost 1-2 months of rent as brokerage.
6 |
7 |
--------------------------------------------------------------------------------
/src/Components/Payment_Detail/payment.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react'
2 | import Testimonoals from '../Rent_Page/components/testimonoals';
3 | import Detail from './payment_detail'
4 | import Question from '../Rent_Page/components/question';
5 | import {Info, Paymentinfo} from '../Rent_Page/components/info';
6 | import style from "../Rent_Page/rent.module.css"
7 | import PaymentInfo from './PaymentInfo';
8 | import { Box, Container } from '@chakra-ui/react';
9 |
10 | export default function Payment() {
11 | return (
12 |
13 |
14 |
15 |
16 |
17 | {/*
*/}
18 |
19 |
20 |
21 |
22 |
23 |
24 | )
25 | }
26 |
--------------------------------------------------------------------------------
/src/Components/Card_Detail_Page/payment.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react'
2 | import Testimonoals from '../Rent_Page/components/testimonoals';
3 | import Detail from './payment_detail'
4 | import Question from '../Rent_Page/components/question';
5 | import {Info, Paymentinfo} from '../Rent_Page/components/info';
6 | import style from "../Rent_Page/rent.module.css"
7 | import PaymentInfo from './PaymentInfo';
8 | import { Box, Container } from '@chakra-ui/react';
9 |
10 | export default function ToPayment() {
11 | return (
12 |
13 |
14 |
15 |
16 |
17 | {/*
*/}
18 |
19 |
20 |
21 |
22 |
23 |
24 | )
25 | }
26 |
--------------------------------------------------------------------------------
/src/Components/SearchPages/QuickLinksSearchPage.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react'
2 |
3 | export const QuickLinksSearchPage = () => {
4 | return (
5 |
6 |
9 |
10 |
11 | People also searched for
12 |
13 |
14 |
15 | Flats in Malka Ganj for rent
16 | Flats in Jhandewalan for rent
17 | Flats in Sadar Bazaar for rent
18 | Flats in Chandni Chowk for rent
19 | Flats in Thaane for rent
20 | Flats in Bengaluru for rent
21 |
22 |
23 |
24 | )
25 | }
26 |
--------------------------------------------------------------------------------
/src/Styles/SearchPages/searchpage.css:
--------------------------------------------------------------------------------
1 | .price-div{
2 | display: grid;
3 | border-top: 1px solid gainsboro;
4 | grid-template-columns: repeat(3,1fr);
5 | border-bottom: 1px solid gainsboro;
6 |
7 | }
8 | .price-span{
9 | padding: 1%;
10 | }
11 | .var-price-tag{
12 | font-weight: 600;
13 | }
14 | .con-price-tag{
15 | font-size: 70%;
16 | font-weight: 400;
17 | }
18 | .data-card-image{
19 | width: 110%;
20 | height: 100%;
21 | padding-right: 1rem;
22 | }
23 | .card-detail-div{
24 | display: grid;
25 | grid-template-columns: repeat(2,1fr);
26 | }
27 | .card-detail-div>div{
28 | border: 0.1px solid gainsboro;
29 | padding: 1%;
30 | }
31 | .nearby{
32 | background-color: rgb(235, 233, 233);
33 | margin-left: 0.5%;
34 | padding: 0.3%;
35 | }
36 | .search-page-head-div{
37 | background-color: rgb(250, 247, 247);
38 | display: grid;
39 | grid-template-columns: 30% 50% 10%;
40 | }
41 | .search-page-card-head{
42 | border-top: 0.1px solid gainsboro;
43 | transition: 0.5s;
44 | box-shadow: none;
45 | width: 100%;
46 | margin-top: 1%;
47 | }
48 | .search-page-card-head:hover{
49 | box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
50 | }
51 | .card-house-name-heading:hover{
52 | transition: 0.2s;
53 | color: red;
54 | }
--------------------------------------------------------------------------------
/src/Components/Rent_Page/rent.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react'
2 | import Detail from './detailshow'
3 | import DetailAdd from './userdetail'
4 | import Question from './components/question';
5 | import { Info, Paymentinfo } from './components/info';
6 |
7 | import {
8 | Flex,
9 | Container,
10 | Box,
11 | } from '@chakra-ui/react';
12 | import style from "./rent.module.css";
13 | import Testimonoals from './components/testimonoals';
14 | import { Route, Routes, Link } from 'react-router-dom';
15 |
16 |
17 | //install this :- npm install react-slick --save
18 | // :- npm install slick-carousel --save
19 |
20 |
21 | // Add In Index.html
22 | //
23 | //
24 |
25 |
26 | export default function Rent() {
27 | return (
28 |
29 |
30 |
31 |
32 |
33 |
34 |
35 |
36 |
37 |
38 |
39 |
40 |
41 |
42 |
43 |
44 | )
45 | }
46 |
--------------------------------------------------------------------------------
/src/Components/SearchPages/SearchBar.jsx:
--------------------------------------------------------------------------------
1 | import { Button } from '@mui/material'
2 | import React from 'react'
3 |
4 | export const SearchBar = (props) => {
5 | const [type,setType] = React.useState('list');
6 | const [input,setInput] = React.useState('');
7 | return (
8 |
9 |
10 |
11 | {setInput(e.target.value)}} style={{padding:'0.7rem',width:'30rem',marginTop:'0.5rem',marginBottom:'0.5rem',marginLeft:'2rem'}}/>
12 | props.func(input.toLowerCase())}>Search
13 |
14 |
15 | setType('list')}>List
16 | setType('map')}>Map
17 |
18 |
19 |
20 | )
21 | }
22 |
--------------------------------------------------------------------------------
/src/Components/SearchPages/ResultShower.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react'
2 | import MenuItem from '@mui/material/MenuItem';
3 | import Select from '@mui/material/Select';
4 |
5 | export const ResultShower = (props) => {
6 |
7 |
8 |
9 | return (
10 |
11 |
12 | Home /
13 |
14 | Sort By:
15 | props.func(e.target.value)}
20 | >
21 | Low to High
22 | High to Low
23 | Clear
24 |
25 |
26 |
27 |
{props.item.length} - Flats, Apartments for Sale in Your Searched Area | Selling Properties in Your Searched Area
28 |
29 | )
30 | }
31 |
--------------------------------------------------------------------------------
/src/Components/Rent_Page/userdetail.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react'
2 | import {
3 | Input ,
4 | FormControl,
5 | FormLabel,
6 | FormErrorMessage,
7 | FormHelperText,
8 | Box,
9 | Container,
10 | Button,
11 | Image,
12 | } from '@chakra-ui/react'
13 | import Sliders from './components/slider'
14 | import { Routes, Route } from 'react-router-dom'
15 | import { Yourinput, Studentinput } from './components/Input'
16 | import style from './rent.module.css'
17 |
18 | export default function DetailAdd() {
19 |
20 | return (
21 |
22 |
23 |
24 |
25 |
26 | {/*
27 | } >
28 | } >
29 | } >
30 | } >
31 | } >
32 | } >
33 | } >
34 | */}
35 |
36 |
37 |
38 | )
39 | }
40 |
--------------------------------------------------------------------------------
/src/Images/Homepage/homeInteriors.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/src/App.css:
--------------------------------------------------------------------------------
1 | * {
2 | box-sizing: border-box !important;
3 | user-select: none;
4 | margin: 0;
5 | padding: 0;
6 | font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
7 | }
8 |
9 |
10 |
11 | .swiper-button-next,
12 | .swiper-button-prev {
13 | height: 25px !important;
14 | width: 25px !important;
15 | padding: 4px !important;
16 | background-color: #fff !important;
17 | border-radius: 50%;
18 | box-shadow: 0 3px 6px #ccc;
19 | background-image: url('https: //cdn-icons-png.flaticon.com/512/109/109618.png') !important;
20 | vertical-align: middle !important;
21 | }
22 |
23 |
24 | .swiper-button-next::after,
25 | .swiper-button-prev::after {
26 | font-size: 15px !important;
27 | color: black !important;
28 | font-weight: bold;
29 | }
30 |
31 | .swiper-slide {
32 | margin: 5%px !important;
33 | width: 85%;
34 | }
35 |
36 | .swiper-container {
37 | margin: 40px 0px !important;
38 | }
39 |
40 |
41 | .css-1ozmk1d {
42 | outline: 2px solid transparent;
43 | outline-offset: 2px;
44 | background: #fff;
45 | /* box-shadow: var(--chakra-shadows-sm); */
46 | min-height: max-content !important;
47 | color: inherit;
48 | /* min-width: var(--chakra-sizes-3xs); */
49 | /* padding-top: var(--chakra-space-2);
50 | padding-bottom: var(--chakra-space-2); */
51 | z-index: 1;
52 | /* border-radius: var(--chakra-radii-md); */
53 | border-width: 1px;
54 | }
--------------------------------------------------------------------------------
/src/App.js:
--------------------------------------------------------------------------------
1 |
2 | import React from 'react';
3 | import { Route, Routes } from 'react-router-dom';
4 | import './App.css';
5 | import Footer from './Components/Footer/Footer';
6 | import Navbar from './Components/Navbar/Navbar';
7 | import Homepage from './Pages/Homepage/Homepage';
8 |
9 |
10 |
11 |
12 | import { Box } from "@chakra-ui/react"
13 | import Login from './Pages/LoginSignup/Login';
14 | import Signup from './Pages/LoginSignup/Signup';
15 | // import { useSelector } from 'react-redux';
16 | import Rent from './Components/Rent_Page/rent';
17 | import { Yourinput } from './Components/Rent_Page/components/Input';
18 | import Payment from './Components/Payment_Detail/payment';
19 | import ToPayment from './Components/Card_Detail_Page/payment';
20 | function App() {
21 | // const { loginReq } = useSelector((state) => state)
22 | return (
23 |
24 |
25 |
26 | } />
27 | {/* } /> */}
28 | } />
29 | }>
30 | }>
31 |
32 |
33 |
34 |
35 | } />
36 | } />
37 |
38 |
39 | );
40 | }
41 |
42 | export default App;
43 |
--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "no-broker-clone",
3 | "version": "0.1.0",
4 | "private": true,
5 | "dependencies": {
6 | "@chakra-ui/icons": "^2.0.9",
7 | "@chakra-ui/react": "^2.3.1",
8 | "@emotion/react": "^11.10.4",
9 | "@emotion/styled": "^11.10.4",
10 | "@mui/material": "^5.10.4",
11 | "@testing-library/jest-dom": "^5.16.5",
12 | "@testing-library/react": "^13.3.0",
13 | "@testing-library/user-event": "^13.5.0",
14 | "framer-motion": "^7.2.1",
15 | "i": "^0.3.7",
16 | "react": "^18.2.0",
17 | "react-dom": "^18.2.0",
18 | "react-icons": "^4.4.0",
19 | "react-redux": "^8.0.2",
20 | "react-router-dom": "^6.3.0",
21 | "react-scripts": "5.0.1",
22 | "react-slick": "^0.29.0",
23 | "redux": "^4.2.0",
24 | "slick-carousel": "^1.8.1",
25 | "styled-components": "^5.3.5",
26 | "swiper": "^8.3.2",
27 | "web-vitals": "^2.1.4"
28 | },
29 | "scripts": {
30 | "start": "react-scripts start",
31 | "build": "react-scripts build",
32 | "test": "react-scripts test",
33 | "eject": "react-scripts eject"
34 | },
35 | "eslintConfig": {
36 | "extends": [
37 | "react-app",
38 | "react-app/jest"
39 | ]
40 | },
41 | "browserslist": {
42 | "production": [
43 | ">0.2%",
44 | "not dead",
45 | "not op_mini all"
46 | ],
47 | "development": [
48 | "last 1 chrome version",
49 | "last 1 firefox version",
50 | "last 1 safari version"
51 | ]
52 | },
53 | "homepage": "."
54 | }
55 |
--------------------------------------------------------------------------------
/public/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 |
8 |
10 |
12 |
13 |
14 |
15 |
16 |
17 | Flats, Houses, Apartments for Rent, Buy, Sale Without Brokerage in India
18 |
19 |
20 |
21 |
22 | You need to enable JavaScript to run this app.
23 |
24 |
34 |
35 |
36 |
--------------------------------------------------------------------------------
/src/Pages/Homepage/ReviewCard.jsx:
--------------------------------------------------------------------------------
1 |
2 | import { Box, Flex, Image, Text } from '@chakra-ui/react';
3 | import React from 'react';
4 | import style from "./Homepage.module.css"
5 |
6 | import star from "../../Images/Homepage/star.png"
7 |
8 | const ReviewCard = ({ data }) => {
9 | return (
10 |
11 |
12 |
13 |
14 |
15 |
16 | {data.name}
17 |
18 |
19 |
20 |
21 |
22 |
23 |
24 |
25 |
26 |
27 |
28 | {data.headLine}
29 | "{data.description}"
30 |
31 |
32 |
33 | );
34 | };
35 |
36 | export default ReviewCard;
--------------------------------------------------------------------------------
/src/Components/Footer/Footer.module.css:
--------------------------------------------------------------------------------
1 | .footerOptions {
2 | justify-content: space-between;
3 | padding: 0px 25px;
4 | border-top: 1px solid grey;
5 |
6 | background-color: hsla(0, 0%, 92.9%, .4);
7 | overflow: auto;
8 | }
9 |
10 | .footerOptions>div {
11 | padding: 12px 15px;
12 | cursor: pointer;
13 | font-size: 16px;
14 | font-weight: 600;
15 | }
16 |
17 | .footerSubOptions {
18 | justify-content: space-between;
19 | padding: 5px 20px 30px 25px;
20 | overflow: auto;
21 | margin-bottom: 30px;
22 | border-bottom: 1px solid grey;
23 | }
24 |
25 |
26 |
27 | .footerSubOptions>div>div {
28 | font-size: 15px;
29 | padding: 15px 10px 0px 10px;
30 | cursor: pointer;
31 | font-weight: 600;
32 |
33 | }
34 |
35 | .footerSubOptions p {
36 | padding: 5px 10px;
37 | color: grey;
38 | font-weight: 500;
39 | }
40 |
41 | .footerSubOptions p:hover {
42 | cursor: pointer;
43 | color: black;
44 | }
45 |
46 | ul>li {
47 | padding: 2px 8px;
48 | background-color: #e8e8e8;
49 | color: #464646;
50 | border-radius: 4px;
51 | cursor: pointer;
52 | font-size: 14px;
53 | }
54 |
55 | .findNow {
56 | margin: 20px 0;
57 | background-color: #ededed;
58 | justify-content: space-around;
59 | padding: 30px 0;
60 | border-top: 1px solid rgba(70, 70, 70, .239216);
61 | border-bottom: 1px solid rgba(70, 70, 70, .239216);
62 | -ms-flex-wrap: wrap;
63 | flex-wrap: wrap;
64 | }
65 |
66 | .findNow>div {
67 | text-align: center;
68 | }
69 |
70 | .findNow>div>:last-child {
71 | padding: 3px 20px;
72 | border-radius: 4px;
73 | background-color: #333333;
74 | text-decoration: none;
75 | color: #fff;
76 | font-weight: 600;
77 | display: inline-block;
78 | margin-top: 15px;
79 | font-size: 14px;
80 | letter-spacing: .5px;
81 | }
82 |
83 | .findNow>div>:last-child:hover {
84 | cursor: pointer;
85 | }
86 |
87 | .aboutUs>p {
88 | margin: 0 20px;
89 | font-size: 18px;
90 | color: #464646;
91 | }
92 |
93 | .aboutUs>p:hover {
94 | cursor: pointer;
95 | color: black;
96 | }
97 |
98 | .socialLinks>a {
99 | background-color: #e8e8e8;
100 | border-radius: 100%;
101 | padding: 7px 9px;
102 | margin: 0 20px;
103 | }
104 |
105 | .socialLinks svg {
106 | height: 20px;
107 | width: 20px;
108 | }
--------------------------------------------------------------------------------
/src/Images/footer/youtube.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/src/Components/Navbar/NavBar.module.css:
--------------------------------------------------------------------------------
1 | .navBarContainer {
2 | box-shadow: rgb(0 0 0 / 11%) 0px 2px 10px;
3 | padding: 5px 20px;
4 | background-color: white;
5 | justify-content: space-between;
6 | height: 61px;
7 | align-items: center;
8 | width: 100%;
9 | position: fixed;
10 | /* top: 0; */
11 | z-index: 30;
12 | }
13 |
14 |
15 | .logo {
16 | height: 33px;
17 | width: auto;
18 | }
19 |
20 | .payRent {
21 | gap: 5px;
22 | align-items: center;
23 | cursor: pointer;
24 | text-transform: capitalize;
25 | color: #555;
26 | font-weight: 300;
27 | border: 1px solid #e6e6e6;
28 | padding: 4px 10px;
29 | border-radius: 2px;
30 | height: 30px;
31 | font-size: 13px;
32 | font-family: Source Sans Pro, sans-serif;
33 | }
34 |
35 | .loginSingUp {
36 | user-select: none;
37 | cursor: pointer;
38 | text-transform: capitalize;
39 | color: #555;
40 | font-weight: 300;
41 | padding: 0 15px;
42 | font-size: 14px;
43 | font-family: Source Sans Pro, sans-serif;
44 | line-height: inherit;
45 | border-right: 1px solid rgba(0, 0, 0, .105882);
46 | }
47 |
48 | .menuBox {
49 | display: flex;
50 | justify-content: center;
51 | align-items: center;
52 | }
53 |
54 | .menuBox a {
55 | width: 100%;
56 | padding: 8px 0;
57 | margin: -2px 20px;
58 | font-size: 14px;
59 | border-bottom: 1px solid #ebebeb;
60 | font-weight: 400;
61 | display: block;
62 | color: #777;
63 | text-align: left;
64 | text-decoration: none;
65 | cursor: pointer;
66 | }
67 |
68 |
69 |
70 | .menuOptionBox {
71 | width: 250px !important;
72 | max-height: 85vh !important;
73 | position: absolute !important;
74 | right: -70px !important;
75 | border-radius: 0px !important;
76 | overflow: auto;
77 | border: 1px solid #ddd !important;
78 | }
79 |
80 | .userDetailBox {
81 | display: flex;
82 | justify-content: center;
83 | align-items: center;
84 | }
85 |
86 | .userDetailBox a {
87 | width: 100%;
88 | padding: 8px 0;
89 | margin: -2px 20px;
90 | font-size: 14px;
91 | border-bottom: 1px solid #ebebeb;
92 | font-weight: 400;
93 | display: block;
94 | color: #777;
95 | text-align: left;
96 | text-decoration: none;
97 | cursor: pointer;
98 | }
99 |
100 | .userDetailOptionBox {
101 | width: 200px !important;
102 | position: absolute !important;
103 | right: -70px !important;
104 | border-radius: 0px !important;
105 | border: 1px solid #ddd !important;
106 | }
--------------------------------------------------------------------------------
/src/Components/Rent_Page/rent.module.css:
--------------------------------------------------------------------------------
1 | .center {
2 | color: black;
3 | }
4 |
5 |
6 |
7 | /* left */
8 | .ConChildOne {
9 | margin-top: 40px;
10 | /* border: 2px solid red; */
11 | }
12 |
13 |
14 |
15 |
16 |
17 | /* right input container One */
18 | .ConChildTwo {
19 | /* border: 2px solid red; */
20 | width: 569px;
21 | padding: 35px;
22 | border-radius: 10px;
23 | position: relative;
24 | top: 70px;
25 | /* left: 500px; */
26 | }
27 |
28 | .inputName {
29 | border-radius: 3px;
30 | border: 1px solid rgb(146, 135, 135);
31 | }
32 |
33 | .Sliderfirst {
34 | border-bottom: 1px solid lightgrey;
35 | color: #000;
36 | }
37 |
38 | .InputCon {
39 | display: flex;
40 | flex-direction: column;
41 | justify-content: center;
42 | /* padding: 1; */
43 | }
44 |
45 | .link {
46 | height: 65px;
47 | display: flex;
48 | flex-direction: column;
49 | align-items: center;
50 | justify-content: center;
51 |
52 | }
53 |
54 | .link>* {
55 | display: flex;
56 | align-items: center;
57 | justify-content: center;
58 | text-align: center;
59 | }
60 |
61 | .InfoContainer {
62 | height: 388px;
63 | width: 100%;
64 | }
65 |
66 | .InfoContainerTwo {
67 | width: 100%;
68 | padding: 30px;
69 | height: 220px;
70 | align-items: center;
71 | justify-content: space-around;
72 | }
73 |
74 |
75 |
76 |
77 |
78 |
79 |
80 |
81 |
82 |
83 | .testimonoals {
84 | /* border: 2px solid red !important; */
85 | width: 80%;
86 | height: 292px;
87 | display: flex;
88 | justify-content: center;
89 | align-items: center;
90 | flex-direction: row;
91 | margin: auto;
92 | }
93 |
94 | .box {
95 | /* border: 1px solid #000; */
96 | margin-bottom: 50px;
97 | }
98 |
99 |
100 |
101 |
102 |
103 |
104 |
105 | .paymentInfoContainerPage>* {
106 | padding: 15px;
107 | /* border: 1px solid; */
108 | }
109 |
110 | .paymentInfoContainerPage {
111 | /* border: 5px solid #000; */
112 | display: flex;
113 | flex-direction: column;
114 | padding: 40px 40px 0 40px;
115 | /* align-items: center; */
116 | width: 100%;
117 | font-size: 14px;
118 | /* border-bottom: 1px solid lightgray; */
119 |
120 | }
121 |
122 |
123 |
124 |
125 | .paymentInfo_DetailName {
126 | height: 64px;
127 | font-size: 14px;
128 | line-height: 21px;
129 | padding: 0px 0px 12px 0px;
130 | }
131 |
132 | .paymentInfo_DetailNameTwo {
133 | height: 65px;
134 | font-size: 14px;
135 | line-height: 21px;
136 | padding: 0px 15px 20px 0px;
137 | }
138 |
139 | .paymentInfo_DetailNameThree {
140 | padding: 15px 15px 15px 0px;
141 |
142 | }
143 |
144 | .paymentInfo_DetailNameFour {
145 | padding: 15px 0px 15px 0px;
146 | /* border: 1px solid; */
147 | }
--------------------------------------------------------------------------------
/src/Pages/Homepage/CommercialOption.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react'
2 | import { Box, Button, Checkbox, Flex, Menu, MenuButton, MenuItem, MenuList, Radio, RadioGroup, Select, Stack } from "@chakra-ui/react"
3 | import style from "./Homepage.module.css"
4 | import { ChevronDownIcon } from '@chakra-ui/icons'
5 |
6 | function CommercialOption() {
7 | const [value, setValue] = React.useState("rent")
8 | return (
9 |
10 |
11 |
12 | Rent
13 | Buy
14 |
15 |
16 |
17 | } border="1px solid #e2e2e2 !important" borderRadius="0" bgColor="#fcfcfc" fontSize="12px !important" fontWeight="400">
18 | Property Type
19 |
20 |
21 |
22 |
23 | Office Space
24 |
25 |
26 |
27 |
28 | Co-Working
29 |
30 |
31 |
32 |
33 | Restaurant/Cafe
34 |
35 |
36 |
37 |
38 | Shop
39 |
40 |
41 |
42 |
43 | Showroom
44 |
45 |
46 |
47 |
48 | Industrial Building
49 |
50 |
51 |
52 |
53 | Industrial Shed
54 |
55 |
56 |
57 |
58 | Gowdown/Warehouse
59 |
60 |
61 |
62 |
63 | Other Business
64 |
65 |
66 |
67 |
68 |
69 |
70 | )
71 | }
72 |
73 | export default CommercialOption
--------------------------------------------------------------------------------
/src/Pages/LoginSignup/LoginSignup.module.css:
--------------------------------------------------------------------------------
1 | .loginSignupContainer {
2 | overflow: hidden;
3 | height: 100vh;
4 | width: 100vw;
5 | z-index: 9999;
6 | position: fixed;
7 | top: 0;
8 | left: 0;
9 | user-select: none;
10 | transition: opacity .3s ease-out;
11 | opacity: 1;
12 | color: #2e2e2e;
13 | }
14 |
15 | .loginSignupContainer>:first-child {
16 | position: fixed;
17 | top: 0;
18 | left: 0;
19 | height: 100vh;
20 | width: 100vw;
21 | z-index: -1;
22 | background-color: #000;
23 | opacity: .5;
24 | }
25 |
26 | .loginSignupContainer>:last-child {
27 | max-height: 550px;
28 | background: #fff;
29 | position: absolute;
30 | top: 0;
31 | bottom: 0;
32 | width: 670px;
33 | margin: auto;
34 | left: 0;
35 | max-width: 670px;
36 | right: 0;
37 | }
38 |
39 | .loginLeftBox {
40 | width: 40%;
41 | min-height: 125px;
42 | background-color: #f8f8f8;
43 | flex-direction: column;
44 | justify-content: center;
45 | align-items: center;
46 | /* overflow: hidden; */
47 | }
48 |
49 |
50 |
51 | .loginRightBox {
52 | padding: 20px;
53 | margin-top: 30px;
54 | width: 60%;
55 | height: calc(100% - 30px);
56 | position: relative;
57 | }
58 |
59 |
60 | .loginFormContainer {
61 | padding: 0 20px;
62 | position: relative;
63 | height: calc(100% - 30px);
64 | overflow-y: auto;
65 | }
66 |
67 | .loginFormContainer>p {
68 | line-height: 23px;
69 | margin-bottom: 20px;
70 | color: #2e2e2e;
71 | font-weight: 600;
72 | font-size: 18px;
73 | }
74 |
75 | .mobileInput {
76 | height: 40px;
77 | border-radius: 4px 4px 0 0;
78 | position: relative;
79 | align-items: center;
80 | border: 1px solid #ddd;
81 | }
82 |
83 | .mobileInput>* {
84 | border: 0px solid !important;
85 | border-radius: 0px !important;
86 | }
87 |
88 | .mobileInput>:first-child {
89 | border-right: 1px solid #ddd !important;
90 | }
91 |
92 | .whatsappAlert {
93 | background: #f8f8f8;
94 | height: 40px;
95 | border-radius: 0 0 4px 4px;
96 | position: relative;
97 | align-items: center;
98 | padding: 0 12px;
99 | border: 1px solid #ddd;
100 | border-top: 0;
101 | width: 100%;
102 | justify-content: space-between;
103 | }
104 |
105 | .whatsappAlert>:last-child>label>span {
106 | height: 16px !important;
107 | width: 28px !important;
108 | /* background: #009587; */
109 | }
110 |
111 | .whatsappAlert>:last-child>label>span>span {
112 | width: 12px;
113 | height: 12px;
114 | top: 2px;
115 | }
116 |
117 |
118 | .nameAndEmail {
119 | border-radius: 2px !important;
120 | border: 1px solid #ccc !important;
121 | height: 40px !important;
122 | padding: 8px !important;
123 | box-shadow: none;
124 | word-break: normal;
125 | font-size: 14px !important;
126 | }
127 |
128 |
129 | .loginButton {
130 | margin-top: 50px;
131 | width: 100%;
132 | transition: top .3s ease-out;
133 | height: 40px;
134 | border-radius: 4px;
135 | background-color: #fd3752 !important;
136 | color: white;
137 | }
138 |
139 |
140 |
141 |
142 | .loginFooter {
143 | position: absolute;
144 | bottom: 30px;
145 | height: 30px;
146 | left: 0;
147 | right: 0;
148 | text-align: center;
149 | font-size: 12px;
150 | }
151 |
152 | .loginFooter>a {
153 | font-weight: bold;
154 | text-decoration: underline;
155 | }
--------------------------------------------------------------------------------
/src/Pages/Homepage/BuyOption.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react'
2 | import { Box, Button, Checkbox, Flex, Menu, MenuButton, MenuItem, MenuList, Radio, RadioGroup, Select, Stack } from "@chakra-ui/react"
3 | import style from "./Homepage.module.css"
4 | import { ChevronDownIcon } from '@chakra-ui/icons'
5 |
6 | function BuyOption() {
7 | const [value, setValue] = React.useState("fullHouse")
8 | return (
9 |
10 |
11 |
12 | Full House
13 | Land/Plot
14 |
15 |
16 |
17 | {value === 'fullHouse' &&
18 |
19 | } border="1px solid #e2e2e2 !important" borderRadius="0" bgColor="#fcfcfc" fontSize="12px !important" fontWeight="400">
20 | Apartment Type
21 |
22 |
23 |
24 |
25 | 1 RK
26 |
27 |
28 |
29 |
30 | 1 BHK
31 |
32 |
33 |
34 |
35 | 2 BHK
36 |
37 |
38 |
39 |
40 | 3 BHK
41 |
42 |
43 |
44 |
45 | 4 BHK
46 |
47 |
48 |
49 |
50 | 4+ BHK
51 |
52 |
53 |
54 |
55 |
56 |
57 | Under Construction
58 | Ready
59 |
60 |
61 |
62 | New Builder Projects
63 |
64 |
65 | }
66 |
67 |
68 | )
69 | }
70 |
71 | export default BuyOption
--------------------------------------------------------------------------------
/src/Components/Footer/FooterSubOptions3.jsx:
--------------------------------------------------------------------------------
1 | import React from "react";
2 | import { Flex, Box } from "@chakra-ui/react";
3 | import style from "./Footer.module.css";
4 | import FooterSubOptionsText from "./FooterSubOptionsText";
5 | function FooterSubOptions3() {
6 | const textArr1 = [
7 | "PG in Koramangala",
8 | "PG in Marathahalli",
9 | "PG in HSR Layout",
10 | "PG in Whitefield",
11 | "PG in Indira Nagar",
12 | "PG in Bellandur",
13 | "PG in Chandra Layout",
14 | "PG in J. P. Nagar",
15 | "PG in BTM Layout",
16 | "PG in Jayanagar",
17 | ];
18 |
19 | const textArr2 = [
20 | "PG in Andheri West",
21 | "PG in Andheri East",
22 | "PG in Malad West",
23 | "PG in Navi Mumbai",
24 | "PG in Powai",
25 | "PG in Thane West",
26 | "PG in Mira Road East",
27 | "PG in Kharghar",
28 | "PG in Kandivali East",
29 | "PG in Bandra West",
30 | ];
31 |
32 | const textArr3 = [
33 | "PG in Velachery",
34 | "PG in Madipakkam",
35 | "PG in Chromepet",
36 | "PG in Medavakkam",
37 | "PG in Choolaimedu",
38 | "PG in Porur",
39 | "PG in Pallikaranai",
40 | "PG in Urapakkam",
41 | "PG in Valasaravakkam",
42 | "PG in Thiruvanmiyur",
43 | ];
44 |
45 | const textArr4 = [
46 | "PG in Hadapsar",
47 | "PG in Kharadi",
48 | "PG in Baner",
49 | "PG in Kothrud",
50 | "PG in Hinjawadi",
51 | "PG in Wakad",
52 | "PG in Wadgaon",
53 | "PG in Aundh",
54 | "PG in Pimple Saudagar",
55 | "PG in Bavdhan",
56 | ];
57 |
58 | const textArr5 = [
59 | "Girls PG / Hostels in Gurgaon",
60 | "Boys PG / hostels in Gurgaon",
61 | "PG / Hostels in Sector 14 Gurgaon",
62 | "PG / Hostels in DLF Cyber City Gurgaon",
63 | "PG / Hostels in Gurgaon Sector 44",
64 | "PG / Hostels in Gurgaon Sector 22",
65 | "PG / Hostels in Gurgaon Sector 21",
66 | "PG / Hostels in Sector 49 Gurgaon",
67 | "PG / Hostels in Gurgaon Sector 48",
68 | "PG / Hostels in IMT Manesar Gurgaon",
69 | ];
70 |
71 | return (
72 |
73 |
74 | PG in Bangalore
75 | {textArr1.map((text, idx) => (
76 |
77 | ))}
78 |
79 |
80 | PG in Mumbai
81 | {textArr2.map((text, idx) => (
82 |
83 | ))}
84 |
85 |
86 | PG in Chennai
87 | {textArr3.map((text, idx) => (
88 |
89 | ))}
90 |
91 |
92 | PG in Pune
93 | {textArr4.map((text, idx) => (
94 |
95 | ))}
96 |
97 |
98 | PG / Hostels in Gurgaon
99 | {textArr5.map((text, idx) => (
100 |
101 | ))}
102 |
103 |
104 | );
105 | }
106 |
107 | export default FooterSubOptions3;
108 |
--------------------------------------------------------------------------------
/src/Components/Payment_Detail/slider.jsx:
--------------------------------------------------------------------------------
1 | import React, { Component } from "react";
2 | import styled from "../Rent_Page/rent.module.css";
3 | import Slider from "react-slick";
4 | import { Link } from "react-router-dom"
5 | import {
6 | Image,
7 | Text,
8 | Button,
9 | Container,
10 | Box,
11 | } from '@chakra-ui/react'
12 |
13 |
14 | export default function Sliders() {
15 | const [selectedBg, setSelectedBg] = React.useState(1);
16 | const settings = {
17 | className: "center",
18 | centerMode: true,
19 | infinite: true,
20 | centerPadding: "60px",
21 | slidesToShow: 3,
22 | speed: 500
23 | };
24 |
25 | return (
26 |
27 |
28 |
29 |
30 |
31 |
32 |
33 |
34 | setSelectedBg(1)} style={selectedBg === 1 ? { borderBottom: "3px solid blue" } : {}}>House Rent
35 |
36 |
37 |
38 |
39 |
40 |
41 |
42 | setSelectedBg(2)} style={selectedBg === 2 ? { borderBottom: "3px solid blue" } : {}}>School/College Fees
43 |
44 |
45 |
46 |
47 |
48 |
49 | setSelectedBg(3)} style={selectedBg === 3 ? { borderBottom: "3px solid blue" } : {}}>Tuition Fess
50 |
51 |
52 |
53 |
54 |
55 | setSelectedBg(4)} style={selectedBg === 4 ? { borderBottom: "3px solid blue" } : {}}>Society Maintenance
56 |
57 |
58 |
59 |
60 |
61 | setSelectedBg(7)} style={selectedBg === 7 ? { borderBottom: "3px solid blue" } : {}}>Office/Shop Rent
62 |
63 |
64 |
65 |
66 |
67 | setSelectedBg(5)} style={selectedBg === 5 ? { borderBottom: "3px solid blue" } : {}}>Property Token
68 |
69 |
70 |
71 |
72 |
73 | setSelectedBg(6)} style={selectedBg === 6 ? { borderBottom: "3px solid blue" } : {}}>Property Deposit
74 |
75 |
76 |
77 |
78 | );
79 | }
80 |
81 |
82 |
--------------------------------------------------------------------------------
/src/Components/Footer/FooterSubOptions7.jsx:
--------------------------------------------------------------------------------
1 | import React from "react";
2 | import { Flex, Box } from "@chakra-ui/react";
3 | import style from "./Footer.module.css";
4 | import FooterSubOptionsText from "./FooterSubOptionsText";
5 |
6 | function FooterSubOptions7() {
7 | const textArr1 = [
8 | "New Projects in Koramangala",
9 | "New Projects in HSR Layout",
10 | "New Projects in Marathahalli",
11 | "New Projects in Indira Nagar",
12 | "New Projects in Bellandur",
13 | "New Projects in Chandra Layout",
14 | "New Projects in J. P. Nagar",
15 | "New Projects in BTM Layout",
16 | "New Projects in Jayanagar",
17 | "New Projects in Whitefield",
18 | ];
19 |
20 | const textArr2 = [
21 | "New Projects in Andheri West",
22 | "New Projects in Malad West",
23 | "New Projects in Andheri East",
24 | "New Projects in Powai",
25 | "New Projects in Thane West",
26 | "New Projects in Dombivli",
27 | "New Projects in Mira Road East",
28 | "New Projects in Kharghar",
29 | "New Projects in Navi Mumbai",
30 | "New Projects in Bandra West",
31 | ];
32 |
33 | const textArr3 = [
34 | "New Projects in Velachery",
35 | "New Projects in Madipakkam",
36 | "New Projects in Chromepet",
37 | "New Projects in Medavakkam",
38 | "New Projects in Porur",
39 | "New Projects in Pallikaranai",
40 | "New Projects in Urapakkam",
41 | "New Projects in Ambattur",
42 | " New Projects in Okkiyam Thuraipakkam",
43 | "New Projects in Thiruvanmiyur",
44 | ];
45 |
46 | const textArr4 = [
47 | "New Projects in Hadapsar",
48 | "New Projects in Kharadi",
49 | "New Projects in Baner",
50 | "New Projects in Kothrud",
51 | "New Projects in Wagholi",
52 | "New Projects in Wakad",
53 | "New Projects in Wadgaon",
54 | "New Projects in Ambegaon Budruk",
55 | "New Projects in Aundh",
56 | "New Projects in Pimple Saudagar",
57 | ];
58 |
59 | const textArr5 = [
60 | "New Projects in Sushant Lok Gurgaon",
61 | "New Projects in Sector 31 Gurgaon",
62 | "New Projects in Sector 49 Gurgaon",
63 | "New Projects in Sector 40 Gurgaon",
64 | "New Projects in Sector 45 Gurgaon",
65 | "New Projects in Sector 57 Gurgaon",
66 | "New Projects in Sector 23 Gurgaon",
67 | ];
68 |
69 | return (
70 |
71 |
72 | New Projects in Bangalore
73 | {textArr1.map((text, idx) => (
74 |
75 | ))}
76 |
77 |
78 | New Projects in Mumbai
79 | {textArr2.map((text, idx) => (
80 |
81 | ))}
82 |
83 |
84 | New Projects in Chennai
85 | {textArr3.map((text, idx) => (
86 |
87 | ))}
88 |
89 |
90 | New Projects in Pune
91 | {textArr4.map((text, idx) => (
92 |
93 | ))}
94 |
95 |
96 | New Projects in Gurgaon
97 | {textArr5.map((text, idx) => (
98 |
99 | ))}
100 |
101 |
102 | );
103 | }
104 |
105 | export default FooterSubOptions7;
106 |
--------------------------------------------------------------------------------
/src/Components/Rent_Page/components/slider.jsx:
--------------------------------------------------------------------------------
1 | import React, { Component } from "react";
2 | import styled from "../rent.module.css";
3 | import Slider from "react-slick";
4 | import { Link } from "react-router-dom"
5 | import { Yourinput, Studentinput } from './Input'
6 | import {
7 | Image,
8 | Text,
9 | Button,
10 | Container,
11 | Box,
12 | TabList,
13 | Tab,
14 | Tabs,
15 | TabPanel,
16 | TabPanels,
17 | } from '@chakra-ui/react'
18 |
19 |
20 | export default function Sliders() {
21 | const [selectedBg, setSelectedBg] = React.useState(1);
22 | const settings = {
23 | className: "center",
24 | centerMode: true,
25 | infinite: true,
26 | centerPadding: "60px",
27 | slidesToShow: 3,
28 | speed: 500
29 | };
30 |
31 | return (
32 |
33 |
34 | {/* */}
35 |
36 |
37 |
38 |
39 |
40 |
41 | House Rent
42 |
43 |
44 |
45 |
46 |
47 |
48 |
49 | School/College Fees
50 |
51 |
52 |
53 |
54 |
55 |
56 | Tuition Fess
57 |
58 |
59 |
60 |
61 |
62 | Society Maintenance
63 |
64 |
65 |
66 |
67 |
68 | Office/Shop Rent
69 |
70 | {/*
71 |
72 |
73 |
74 | Property Token
75 |
76 |
77 |
78 |
79 |
80 | Property Deposit
81 | */}
82 |
83 |
84 |
85 |
86 |
87 |
88 |
89 |
90 |
91 |
92 |
93 |
94 |
95 |
96 |
97 |
98 |
99 |
100 |
101 |
102 |
103 |
104 |
105 |
106 |
107 |
108 |
109 |
110 | );
111 | }
112 |
113 |
114 |
--------------------------------------------------------------------------------
/src/Components/Footer/FooterSubOptions4.jsx:
--------------------------------------------------------------------------------
1 | import React from "react";
2 | import { Flex, Box } from "@chakra-ui/react";
3 | import style from "./Footer.module.css";
4 | import FooterSubOptionsText from "./FooterSubOptionsText";
5 |
6 | function FooterSubOptions4() {
7 | const textArr1 = [
8 | "Rooms for Rent in Koramangala",
9 | "Rooms for Rent in Marathahalli",
10 | "Rooms for Rent in HSR Layout",
11 | "Rooms for Rent in Whitefield",
12 | "Rooms for Rent in Indira Nagar",
13 | "Rooms for Rent in Bellandur",
14 | "Rooms for Rent in Chandra Layout",
15 | "Rooms for Rent in J. P. Nagar",
16 | "Rooms for Rent in BTM Layout",
17 | "Rooms for Rent in Jayanagar",
18 | ];
19 |
20 | const textArr2 = [
21 | "Rooms for Rent in Andheri West",
22 | "Rooms for Rent in Andheri East",
23 | "Rooms for Rent in Malad West",
24 | "Rooms for Rent in Navi Mumbai",
25 | "Rooms for Rent in Powai",
26 | "Rooms for Rent in Thane West",
27 | "Rooms for Rent in Mira Road East",
28 | "Rooms for Rent in Kharghar",
29 | "Rooms for Rent in Kandivali East",
30 | "Rooms for Rent in Bandra West",
31 | ];
32 |
33 | const textArr3 = [
34 | "Rooms for Rent in Velachery",
35 | "Rooms for Rent in Madipakkam",
36 | "Rooms for Rent in Chromepet",
37 | "Rooms for Rent in Medavakkam",
38 | "Rooms for Rent in Choolaimedu",
39 | "Rooms for Rent in Porur",
40 | "Rooms for Rent in Pallikaranai",
41 | "Rooms for Rent in Urapakkam",
42 | "Rooms for Rent in Valasaravakkam",
43 | "Rooms for Rent in Thiruvanmiyur",
44 | ];
45 |
46 | const textArr4 = [
47 | "Rooms for Rent in Hadapsar",
48 | "Rooms for Rent in Kharadi",
49 | "Rooms for Rent in Baner",
50 | "Rooms for Rent in Kothrud",
51 | "Rooms for Rent in Hinjawadi",
52 | "Rooms for Rent in Wakad",
53 | "Rooms for Rent in Wadgaon",
54 | "Rooms for Rent in Aundh",
55 | "Rooms for Rent in Pimple Saudagar",
56 | "Rooms for Rent in Bavdhan",
57 | ];
58 |
59 | const textArr5 = [
60 | "Rooms for Rent in Sector 31",
61 | "Rooms for Rent in Palam Vihar",
62 | "Rooms for Rent in Sushant Lok",
63 | "Rooms for Rent in South City 1",
64 | "Rooms for Rent in Sector 21",
65 | "Rooms for Rent in Sector 15",
66 | "Rooms for Rent in MG Road",
67 | "Rooms for Rent in Sector 14",
68 | ];
69 |
70 | return (
71 |
72 |
73 | Rooms for Rent in Bangalore
74 | {textArr1.map((text, idx) => (
75 |
76 | ))}
77 |
78 |
79 | Rooms for Rent in Mumbai
80 | {textArr2.map((text, idx) => (
81 |
82 | ))}
83 |
84 |
85 | Rooms for Rent in Chennai
86 | {textArr3.map((text, idx) => (
87 |
88 | ))}
89 |
90 |
91 | Rooms for Rent in Pune
92 | {textArr4.map((text, idx) => (
93 |
94 | ))}
95 |
96 |
97 | Rooms for Rent in Gurgaon
98 | {textArr5.map((text, idx) => (
99 |
100 | ))}
101 |
102 |
103 | );
104 | }
105 |
106 | export default FooterSubOptions4;
107 |
--------------------------------------------------------------------------------
/src/Pages/SearchPage/SearchPage.jsx:
--------------------------------------------------------------------------------
1 | import React, { useState } from 'react'
2 | import '../../Styles/SearchPages/searchpage.css'
3 | import { DataCard } from '../../Components/SearchPages/DataCard'
4 | import { ResultShower } from '../../Components/SearchPages/ResultShower';
5 | import { SearchBar } from '../../Components/SearchPages/SearchBar';
6 | import { FilterForSearchPage } from '../../Components/SearchPages/FilterForSearchPage';
7 | import { AdsSection } from '../../Components/SearchPages/AdsSection';
8 | import { QuickLinksSearchPage } from '../../Components/SearchPages/QuickLinksSearchPage';
9 |
10 | export const SearchPage = () => {
11 | const [apartType,setApartType] = useState('');
12 |
13 | const [order,setOrder] = useState('');
14 |
15 | const handleOrder = (orderType) => {
16 | setOrder(orderType);
17 | console.log('setting order');
18 | }
19 |
20 | const [searchedCity,setSearchedCity] = useState('');
21 | const handleApartmentType = (type) => {
22 | setApartType(type);
23 | console.log(type)
24 | console.log(data);
25 | }
26 | const handleSearchedCity = (cityName) => {
27 | setSearchedCity(cityName);
28 | console.log('inside handleSearchedCity');
29 | }
30 | const tempData = 'thane'
31 | const [data,setData] = useState([])
32 | const fetchData = () => {
33 | if(searchedCity===''){
34 | fetch(`http://localhost:8080/houses?_sort=total_square_feet_price&_order=${order}`)
35 | .then((res)=>res.json())
36 | .then((res)=>setData(res))
37 | .catch((err)=>console.log(err))
38 | }
39 | else{
40 | fetch(`http://localhost:8080/houses?city=${searchedCity}&_sort=total_square_feet_price&_order=${order}`)
41 | .then((res)=>res.json())
42 | .then((res)=>setData(res))
43 | .catch((err)=>console.log(err))
44 | }
45 | console.log(data);
46 | }
47 | React.useEffect(()=>{
48 | fetchData();
49 | },[searchedCity,order])
50 |
51 | return (
52 |
53 |
54 |
55 |
56 |
57 |
58 |
59 |
60 | {
61 | data.filter((el)=>{
62 | if(apartType===''){
63 | return el
64 | }
65 | else{
66 | if(el.apartment_type===apartType){
67 | return el
68 | }
69 | }
70 |
71 | }).map((el)=>{
72 | return(
73 | )
78 | })
79 | }
80 |
81 |
82 |
83 |
84 |
85 |
86 |
87 |
88 |
89 |
90 |
91 |
92 |
93 |
94 |
95 | )
96 | }
97 |
--------------------------------------------------------------------------------
/src/Components/Payment_Detail/newslide.jsx:
--------------------------------------------------------------------------------
1 | import React, { Component } from "react";
2 | import styled from "../Rent_Page/rent.module.css";
3 | import Slider from "react-slick";
4 | import { Link } from "react-router-dom"
5 | import {
6 | Image,
7 | Text,
8 | Button,
9 | Box,
10 | TabList,
11 | Tab,
12 | Tabs,
13 | TabPanel,
14 | TabPanels,
15 |
16 | } from '@chakra-ui/react'
17 | import { Home, School, Society, Office, Token, Propertys} from "./new";
18 |
19 |
20 |
21 |
22 |
23 |
24 | export default function Slides() {
25 | const [selectedBg, setSelectedBg] = React.useState(1);
26 | const settings = {
27 | className: "center",
28 | centerMode: true,
29 | infinite: true,
30 | centerPadding: "60px",
31 | slidesToShow: 3,
32 | speed: 500
33 | };
34 | return (
35 |
36 |
37 |
38 | {/* */}
39 |
40 |
41 |
42 |
43 |
44 | House Rent
45 |
46 |
47 |
48 |
49 |
50 |
51 |
52 | School/College Fees
53 |
54 |
55 |
56 |
57 |
58 |
59 | Tuition Fess
60 |
61 |
62 |
63 |
64 |
65 | Society Maintenance
66 |
67 |
68 |
69 |
70 |
71 | Office/Shop Rent
72 |
73 |
74 |
75 |
76 |
77 | Property Token
78 |
79 |
80 |
81 |
82 |
83 | Property Deposit
85 |
86 |
87 | {/* */}
88 |
89 |
90 |
91 |
92 |
93 |
94 |
95 |
96 |
97 |
98 |
99 |
100 |
101 |
102 |
103 |
104 |
105 |
106 |
107 |
108 |
109 |
110 |
111 |
112 |
113 |
114 |
115 |
116 | )
117 | }
118 |
--------------------------------------------------------------------------------
/src/Components/Rent_Page/components/testimonoals.jsx:
--------------------------------------------------------------------------------
1 | import React, { Component } from "react";
2 | import Slider from "react-slick";
3 | import {
4 | Container,
5 | Image,
6 | Text,
7 | Box,
8 | Heading,
9 | } from '@chakra-ui/react';
10 | import style from "../rent.module.css";
11 |
12 |
13 | export default function Testimonoals() {
14 | const settings = {
15 | dots: true,
16 | infinite: true,
17 | slidesToShow: 3,
18 | slidesToScroll: 1,
19 | autoplay: true,
20 | speed: 9000,
21 | autoplaySpeed: 2000,
22 | cssEase: "linear"
23 | };
24 | return (
25 |
26 |
27 | NoBroker Packers and Movers Reviews
28 | Testimonials from our NoBroker Pay customers
29 |
30 |
31 |
32 | --
33 |
34 | "NoBroker Pay has helped me immensely to manage my finances better. Now I am able to earn vouchers worth approximately 30K using my Amex Platinum Travel card. You need to choose your credit card carefully to get the maximum benefit." →
35 |
36 |
37 |
38 | Arjun Tendulkar
39 |
40 |
41 |
42 | --
43 |
44 | "I think I am one of the first customers of NoBroker Pay. I feel financially secure paying my rent through credit card. I invest in mutual funds every month and now I have extra cash of 24000 (my house rent) which I can invest because of the 50 day interest free period provided by my credit card."
45 |
46 |
47 |
48 | Karthik Kulkarni
49 |
50 |
51 |
52 | --
53 |
54 | "I am really excited about using NoBroker Pay. I had paid my house rent through my credit card. The entire process is so seamless. My landlord too got an instant notification.
55 | Though NoBroker people claim they will crea → the amount within 48 hours, mine got credited in under 7 hours."
56 |
57 |
58 |
59 | Jyothi Dave
60 |
61 |
62 |
63 | --
64 |
65 | "I think I am one of the first customers of NoBroker Pay. I feel financially secure paying my rent through credit card. I invest in mutual funds every month and now I have extra cash of 24000 (my house rent) which I can invest because of the 50 day interest free period provided by my credit card."
66 |
67 |
68 |
69 | Akash Jadhav
70 |
71 |
72 |
73 |
74 | );
75 | }
76 |
77 |
78 |
--------------------------------------------------------------------------------
/src/Components/Card_Detail_Page/PaymentInfo.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react'
2 | import style from '../Rent_Page/rent.module.css'
3 |
4 | import {
5 | Button,
6 | VStack,
7 | Container,
8 | Flex,
9 | Image,
10 | Heading,
11 | Text ,
12 | Input ,
13 | FormLabel,
14 | Box,
15 | Checkbox,
16 | Select,
17 |
18 | } from "@chakra-ui/react"
19 |
20 | export default function PaymentInfo() {
21 | return (
22 |
23 |
24 |
25 | Payment Details
26 | Fill your payment details once and we will save it
27 |
28 | {/* */}
29 | {/*
30 |
31 | Landlord Name(As per bank records)
32 |
33 |
34 |
35 | Landlord Name(As per bank records)
36 |
37 |
38 |
39 |
40 |
41 | Choose payment mode
42 |
43 | To Bank Account
44 | To UPI
45 |
46 |
47 |
48 |
49 |
50 | Bank Account Number
51 |
52 |
53 |
54 | Confirm Account Number
55 |
56 |
57 |
58 |
59 |
60 |
61 | IFSC Code
62 |
63 |
64 |
65 | BHK Type
66 |
67 | 1 RK
68 | 1 BHK
69 | 2 BHK
70 | 3 BHK
71 | 4 BHK
72 |
73 |
74 |
75 |
76 |
77 |
78 | Property Address
79 |
80 |
81 |
82 | Rent Amount
83 |
84 |
85 |
86 | */}
87 | {/*
88 | Upload Rental Agreement (optional)
89 |
90 | */}
91 |
92 |
93 | Fill your payment details once to save it so you don’t have to enter it again
94 | Save Payment Detail
95 |
96 |
97 | )
98 | }
99 |
--------------------------------------------------------------------------------
/src/Components/Footer/FooterSubOptions2.jsx:
--------------------------------------------------------------------------------
1 | import React from "react";
2 | import { Flex, Box } from "@chakra-ui/react";
3 | import style from "./Footer.module.css";
4 | import FooterSubOptionsText from "./FooterSubOptionsText";
5 | function FooterSubOptions2() {
6 | const textArr1 = [
7 | "Flats for rent in Koramangala",
8 | "Flats for rent in HSR Layout",
9 | "Flats for rent in Marathahalli",
10 | "Flats for rent in Indira Nagar",
11 | "Flats for rent in Bellandur",
12 | "Flats for rent in Chandra Layout",
13 | "Flats for rent in J. P. Nagar",
14 | "Flats for rent in BTM Layout",
15 | "Flats for rent in Jayanagar",
16 | "Flats for rent in Whitefield",
17 | "Properties in Bangalore for Lease",
18 | "Apartments for rent in Bangalore",
19 | "Flats for rent in Delhi",
20 | ];
21 |
22 | const textArr2 = [
23 | "Flats for rent in Andheri West",
24 | "Flats for rent in Malad West",
25 | "Flats for rent in Andheri East",
26 | "Flats for rent in Powai",
27 | "Flats for rent in Thane West",
28 | "Flats for rent in Dombivli",
29 | "Flats for rent in Mira Road East",
30 | "Flats for rent in Kharghar",
31 | "Flats for rent in Navi Mumbai",
32 | "Flats for rent in Bandra West",
33 | "Properties in Mumbai with Heavy Deposit",
34 | "Flats for rent in Faridabad",
35 | ];
36 |
37 | const textArr3 = [
38 | "Flats for rent in Velachery",
39 | "Flats for rent in Madipakkam",
40 | "Flats for rent in Madipakkam",
41 | "Flats for rent in Medavakkam",
42 | "Flats for rent in Porur",
43 | "Flats for rent in Pallikaranai",
44 | "Flats for rent in Urapakkam",
45 | "Flats for rent in Ambattur",
46 | " Flats for rent in Okkiyam Thuraipakkam",
47 | "Flats for rent in Thiruvanmiyur",
48 | "Properties in Chennai for Lease",
49 | "Flats for rent in Noida",
50 | ];
51 |
52 | const textArr4 = [
53 | "Flats for rent in Hadapsar",
54 | "Flats for rent in Kharadi",
55 | "Flats for rent in Baner",
56 | "Flats for rent in Kothrud",
57 | "Flats for rent in Wagholi",
58 | "Flats for rent in Wakad",
59 | "Flats for rent in Wadgaon",
60 | "Flats for rent in Ambegaon Budruk",
61 | "Flats for rent in Aundh",
62 | "Flats for rent in Pimple Saudagar",
63 | "Properties in Pune with Heavy Deposit",
64 | "Flats for rent in Ghaziabad",
65 | ];
66 |
67 | const textArr5 = [
68 | "1 BHK Flats in Gurgaon for Rent",
69 | "2 BHK Flats in Gurgaon for Rent ",
70 | "3 BHK Flats in Gurgaon for Rent",
71 | "Flats in Sushant Lok Gurgaon for Rent",
72 | "Flats in Sector 31 Gurgaon for Rent",
73 | "Flats in Sector 49 Gurgaon for Rent",
74 | "Flats in Sector 40 Gurgaon for Rent",
75 | "Flats in Sector 45 Gurgaon for Rent",
76 | "Flats in Sector 57 Gurgaon for Rent",
77 | "Flats in Sector 23 Gurgaon for Rent",
78 | "Properties in Gurgaon for Lease",
79 | "Flats for rent in Greater Noida",
80 | ];
81 | return (
82 |
83 |
84 | Flats for Rent in Bangalore
85 | {textArr1.map((text, idx) => (
86 |
87 | ))}
88 |
89 |
90 | Flats for Rent in Mumbai
91 | {textArr2.map((text, idx) => (
92 |
93 | ))}
94 |
95 |
96 | Flats for Rent in Chennai
97 | {textArr3.map((text, idx) => (
98 |
99 | ))}
100 |
101 |
102 | Flats for Rent in Pune
103 | {textArr4.map((text, idx) => (
104 |
105 | ))}
106 |
107 |
108 | Flats for Rent in Gurgaon
109 | {textArr5.map((text, idx) => (
110 |
111 | ))}
112 |
113 |
114 | );
115 | }
116 |
117 | export default FooterSubOptions2;
118 |
--------------------------------------------------------------------------------
/src/Components/Footer/FooterSubOptions5.jsx:
--------------------------------------------------------------------------------
1 | import React from "react";
2 | import { Flex, Box } from "@chakra-ui/react";
3 | import style from "./Footer.module.css";
4 | import FooterSubOptionsText from "./FooterSubOptionsText";
5 |
6 | function FooterSubOptions5() {
7 | const textArr1 = [
8 | "Packers and Movers",
9 | "Packers and Movers in Bangalore",
10 | "Flats for Rent in Hyderabad",
11 | "Office Space for Rent in Hyderabad",
12 | "Coworking Space for Rent in Hyderabad",
13 | "Shops for Rent in Hyderabad",
14 | "Office Space for Sale in Hyderabad",
15 | "Electrician Services Bangalore",
16 | "Carpentry Services Bangalore",
17 | "Cleaning Services Bangalore",
18 | "Property Management in Hyderabad",
19 | "Interior Designers in Pune",
20 | "Interior Designers in Gurgaon",
21 | "NRI Services in Chennai",
22 | "NRI Services in Delhi",
23 | ];
24 |
25 | const textArr2 = [
26 | "Best Packers and Movers in Whitefield",
27 | "Packers and Movers in Bangalore for Local Shifting",
28 | "Flats for Sale in Hyderabad",
29 | "Industrial Building for Rent in Hyderabad",
30 | "Industrial Shed for Rent in Hyderabad",
31 | "Godown for Rent in Hyderabad",
32 | "Industrial Building for Sale in Hyderabad",
33 | "Plumbing Services Bangalore",
34 | "Sapphire Lakeside",
35 | "Sobha Dream Acres",
36 | "Property Management in Pune",
37 | "Interior Designers in Mumbai",
38 | "Interior Designers in Faridabad",
39 | "NRI Services in Mumbai",
40 | "NRI Services in Gurgaon",
41 | ];
42 |
43 | const textArr3 = [
44 | "Packers and Movers in Mumbai",
45 | "Best Packers and Movers in Mumbai",
46 | "Packers and Movers in Chennai",
47 | "Best Packers and Movers in Chennai",
48 | "PG in Hyderabad",
49 | "Showroom Space for Rent in Hyderabad",
50 | "Godown for Sale in Hyderabad",
51 | "Industrial Shed for Sale in Hyderabad",
52 | "Home Services",
53 | "Prestige Lakeside Habitat",
54 | "Property Management in Mumbai",
55 | "Interior Designers in Bangalore",
56 | "Interior Designers in Ghaziabad",
57 | "NRI Services in pune",
58 | "NRI Services in Ghaziabad",
59 | ];
60 |
61 | const textArr4 = [
62 | "Two Colour Combination for Bedroom Walls",
63 | "Best Out Of Waste Ideas",
64 | "Akshay Kumar House",
65 | "Indian House Colour Combination Outside",
66 | "Tallest Buildings in Mumbai",
67 | "Wall Mounted Dining Table",
68 | "Safety Rules at Home",
69 | "GFRG Panel",
70 | "Hanging Lights for Living Room",
71 | "Franking Charges",
72 | "Paying Guest",
73 | "Property Management in Bangalore",
74 | "Interior Designers in Chennai",
75 | "Interior Designers in Delhi",
76 | "NRI Services in Bangalore",
77 | "NRI Services in Faridabad",
78 | ];
79 |
80 | const textArr5 = [
81 | "Packers and Movers in Pune",
82 | "Best Packers and Movers in Pune",
83 | "Hanging Lights for Living Room",
84 | "Property Management Services",
85 | "NoBrokerHOOD - Visitor & Society Management System",
86 | "Flatmates in Hyderabad",
87 | "Showrooms Space for Sale in Hyderabad",
88 | "Shops for Sale in Hyderabad",
89 | "Coworking Space for Sale in Hyderabad",
90 | "Painting Services Bangalore",
91 | "Property Management in Chennai",
92 | "Interior Designers in Hyderabad",
93 | "Interior Designers in Noida",
94 | "NRI Services in Hyderabad",
95 | "NRI Services in Noida",
96 | ];
97 |
98 | return (
99 |
100 |
101 | {textArr1.map((text, idx) => (
102 |
103 | ))}
104 |
105 |
106 | {textArr2.map((text, idx) => (
107 |
108 | ))}
109 |
110 |
111 | {textArr3.map((text, idx) => (
112 |
113 | ))}
114 |
115 |
116 | {textArr4.map((text, idx) => (
117 |
118 | ))}
119 |
120 |
121 | {textArr5.map((text, idx) => (
122 |
123 | ))}
124 |
125 |
126 | );
127 | }
128 |
129 | export default FooterSubOptions5;
130 |
--------------------------------------------------------------------------------
/src/Pages/Homepage/RentOption.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react'
2 | import { Box, Button, Checkbox, Flex, Menu, MenuButton, MenuItem, MenuList, Radio, RadioGroup, Select, Stack } from "@chakra-ui/react"
3 | import style from "./Homepage.module.css"
4 | import { ChevronDownIcon } from '@chakra-ui/icons'
5 |
6 | function RentOption() {
7 | const [value, setValue] = React.useState("fullHouse")
8 | return (
9 |
10 |
11 |
12 | Full House
13 | PG/Hostel
14 | Flatmates
15 |
16 |
17 |
18 | {value === 'fullHouse' ?
19 |
20 | } border="1px solid #e2e2e2 !important" borderRadius="0" bgColor="#fcfcfc" fontSize="12px !important" fontWeight="400">
21 | Apartment Type
22 |
23 |
24 |
25 |
26 | 1 RK
27 |
28 |
29 |
30 |
31 | 1 BHK
32 |
33 |
34 |
35 |
36 | 2 BHK
37 |
38 |
39 |
40 |
41 | 3 BHK
42 |
43 |
44 |
45 |
46 | 4 BHK
47 |
48 |
49 |
50 |
51 | 4+ BHK
52 |
53 |
54 |
55 |
56 |
57 |
58 | Immediate
59 | Within 15 Days
60 | Within 30 Days
61 | After 30 Days
62 |
63 | :
64 |
65 | } border="1px solid #e2e2e2 !important" borderRadius="0" bgColor="#fcfcfc" fontSize="12px !important" fontWeight="400">
66 | Tenant Type
67 |
68 |
69 |
70 |
71 | Male
72 |
73 |
74 |
75 |
76 | Female
77 |
78 |
79 |
80 |
81 |
82 |
83 | Single Room
84 | Double Sharing
85 | Triple Sharing
86 | Four Sharing
87 |
88 | }
89 |
90 |
91 | )
92 | }
93 |
94 | export default RentOption
--------------------------------------------------------------------------------
/src/Components/Payment_Detail/PaymentInfo.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react'
2 | import Slider from './slider'
3 | import style from '../Rent_Page/rent.module.css'
4 | import Slides from './newslide'
5 | import { Link } from "react-router-dom"
6 |
7 | import {
8 | Button,
9 | VStack,
10 | Container,
11 | Flex,
12 | Image,
13 | Heading,
14 | Text ,
15 | Input ,
16 | FormLabel,
17 | Box,
18 | Checkbox,
19 | Select,
20 | } from "@chakra-ui/react"
21 |
22 |
23 | export default function PaymentInfo() {
24 | return (
25 |
26 |
27 |
28 | Payment Details
29 | Fill your payment details once and we will save it
30 |
31 | {/* */}
32 |
33 | {/* */}
34 |
35 |
36 | {/* */}
37 | {/*
38 |
39 | Landlord Name(As per bank records)
40 |
41 |
42 |
43 | Landlord Name(As per bank records)
44 |
45 |
46 |
47 |
48 |
49 | Choose payment mode
50 |
51 | To Bank Account
52 | To UPI
53 |
54 |
55 |
56 |
57 |
58 | Bank Account Number
59 |
60 |
61 |
62 | Confirm Account Number
63 |
64 |
65 |
66 |
67 |
68 |
69 | IFSC Code
70 |
71 |
72 |
73 | BHK Type
74 |
75 | 1 RK
76 | 1 BHK
77 | 2 BHK
78 | 3 BHK
79 | 4 BHK
80 |
81 |
82 |
83 |
84 |
85 |
86 | Property Address
87 |
88 |
89 |
90 | Rent Amount
91 |
92 |
93 |
94 | */}
95 | {/*
96 | Upload Rental Agreement (optional)
97 |
98 | */}
99 |
100 | {/*
101 | Fill your payment details once to save it so you don’t have to enter it again
102 |
103 | Save Payment Detail
104 |
105 | */}
106 |
107 | )
108 | }
109 |
--------------------------------------------------------------------------------
/src/Components/Rent_Page/components/question.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react'
2 | import {
3 | Accordion,
4 | AccordionItem,
5 | Box,
6 | AccordionButton,
7 | AccordionPanel,
8 | AccordionIcon,
9 | Heading,
10 | } from '@chakra-ui/react'
11 | import style from "../rent.module.css"
12 |
13 | export default function Question() {
14 | return (
15 |
16 |
Frequently Asked Questions
17 |
18 |
19 |
20 |
21 |
22 |
23 | How secure is NoBroker Pay?
24 |
25 |
26 |
27 |
28 |
29 | Security is incredibly important to us, therefore when you pay on our website, we use sophisticated security measures to ensure your confidential information is secure and encrypted. NoBroker Pay does not store any of your financial information.
30 |
31 |
32 |
33 |
34 |
35 |
36 |
37 | What are the benefits of using NoBroker Pay?
38 |
39 |
40 |
41 |
42 |
43 | NoBroker Pay allows you to pay your house rent using a range of payment options like Credit Cards, Debit Cards, E-Wallets etc. By using your card on NoBroker Pay, you stand to earn cashback and/or reward points based on your card’s reward schemes.
44 |
45 |
46 |
47 |
48 |
49 |
50 | What are the fees/charges for using NoBroker Pay?
51 |
52 |
53 |
54 |
55 |
56 | We may levy a fee on making a payment via NoBroker Pay. The fee is mentioned on the payment page and included in the total payment when you are about to make the payment.
57 |
58 |
59 |
60 |
61 |
62 |
63 | How do I make my house rent payment on NoBroker Pay?
64 |
65 |
66 |
67 |
68 |
69 | The first time you use NoBroker Pay you will need to enter basic details such as – landlord’s contact & account details, monthly rent amount and date of payment. These details are needed only ONCE, thereafter, you can make payments by just choosing your preferred mode of payment.
70 |
71 |
72 |
73 |
74 |
75 |
76 | How do I earn cashback/ rewards with NoBroker Pay?
77 |
78 |
79 |
80 |
81 |
82 | When you make your rent payment on NoBroker Pay with a credit/debit card, you earn reward points, cashback or air miles on your transaction. If you don’t know how much you can earn, contact your bank, they will assist you as it depends on the card you have.
83 |
84 |
85 |
86 |
87 |
88 |
89 | How does NoBroker pay my landlord?
90 |
91 |
92 |
93 |
94 |
95 | When you submit your landlord’s bank details on NoBroker Pay and make your payment, we verify these details and transfer the rent amount directly to your landlord’s bank account. Please note that transfer may take up to 2 working days to reflect in your landlord’s bank account.
96 |
97 |
98 |
99 |
100 |
101 |
102 | )
103 | }
104 |
--------------------------------------------------------------------------------
/src/Images/navbar/logo.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/src/Pages/Homepage/OurCoustomerReview.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react'
2 | import "swiper/css";
3 | import "swiper/css/pagination";
4 | import "swiper/css/navigation";
5 | import { Navigation } from "swiper";
6 | import { Swiper, SwiperSlide } from "swiper/react";
7 |
8 | import ReviewCard from './ReviewCard';
9 | import { Box } from '@chakra-ui/react';
10 |
11 |
12 | const coustomersData = [
13 | {
14 | name: "Shubham Raibhandar",
15 | avatarUrl: "https://assets.nobroker.in/images/testimonials/ff80818155da4ee20155dd9b3e161113_2016.08.18.11.41.41.jpg",
16 | headLine: 'Helps us to find good properties',
17 | description: "The site really helps us to find good properties in the least amount of time without any headache of brokerage.I was so scared in Pune due to the issues of high deposit as well as brokerage.I was new and had no time.But then I found NoBroker."
18 | },
19 | {
20 | name: "Lisa Das",
21 | avatarUrl: "https://assets.nobroker.in/images/testimonials/ff8081815185752901518659f9cc12da.jpg",
22 | headLine: "It's a nice experience",
23 | description: "It was a nice experience with Nobroker. They helped me to find a new home to stay as it was difficult for me,as an individual,to find a home with friendly roommates.Thankfully Nobroker helped me to get one with all kind of facilities."
24 | },
25 | {
26 | name: "Kishore",
27 | avatarUrl: "https://assets.nobroker.in/images/testimonials/ff8081815373f3bb01538493929b5e5f_2016.08.18.11.26.15.jpg",
28 | headLine: 'Found Great Place to Stay via NoBroker',
29 | description: "NoBroker provides a great place to stay with safe environment. if they show you something about property that is always same as it. No fake pictures."
30 | },
31 | {
32 | name: "Mohamme Kouse",
33 | avatarUrl: "https://assets.nobroker.in/images/testimonials/ff80818155ac0fe40155af6ca8df1302_2016.10.06.12.05.00.jpg",
34 | headLine: 'Good App to Earn Money Online !',
35 | description: "I am Mohamed Kouse. The NoBroker app is very useful for home seekers looking for homes to rent. I have also earned money by using the Click & Earn option. I am so happy to use this app because I got a good house for the right amount."
36 | },
37 | {
38 | name: "Ayan",
39 | avatarUrl: "https://assets.nobroker.in/images/testimonials/ff8081814dc793fa014dc8d20faf1045_2016.10.06.12.03.04.jpg",
40 | headLine: 'Click n Earn is Awesome!',
41 | description: "Wow! I am really amazed. Click n Earn is awesome, I really earn by just clicking pictures of To-Let boards. Even many of my friends are also earning by this. The processing of leads is very fast and me and my friends are very happy. This is a great concept."
42 | },
43 | {
44 | name: "Prabhu Dev",
45 | avatarUrl: "https://assets.nobroker.in/images/testimonials/ff8081814c2dea94014c452131543574_2016.08.22.20.01.02.jpg",
46 | headLine: 'Got Genuine and very quick Response',
47 | description: "I have got a genuine and very quick response from the site. I am very happy with service of NoBroker.com owner plans."
48 | },
49 | {
50 | name: "Balasubramanyam K.c.",
51 | avatarUrl: "https://assets.nobroker.in/images/testimonials/ff8081814d4b859b014d5268806a2734_2016.08.22.18.28.14.jpg",
52 | headLine: 'Appreciate Positive and quick responses from RM',
53 | description: "RMs of NoBroker team, I really would like to appreciate positive and quick responses from you guys . Thank you for excellent service through paid plans of NoBroker.com."
54 | },
55 | {
56 | name: "Taisha",
57 | avatarUrl: "https://assets.nobroker.in/images/testimonials/ff80818154ce36190154d104805313f0_2016.08.18.18.24.52.jpg",
58 | headLine: 'Best Option',
59 | description: "The service was great and very professional. I went with the Relax plan. My RM Sayantan Gupta is really efficient. He noted my requirements quite well and suggested me a list of options. I shortlisted one from them and in just one visit, I was able to finalize."
60 | },
61 | {
62 | name: "Anoop Nair",
63 | avatarUrl: "https://assets.nobroker.in/images/testimonials/ff80818154f7abca0154fb3dd1232277.jpg",
64 | headLine: 'Excellent service',
65 | description: "Excellent service and an equally involved team. I opted for the Relax plan and got a good deal on my property. Highly recommended app."
66 | }
67 | ]
68 |
69 |
70 |
71 | function OurCoustomerReview() {
72 | return (
73 |
74 |
105 | {coustomersData.map((data, idx) =>
107 |
108 | )}
109 |
110 |
111 | )
112 | }
113 |
114 | export default OurCoustomerReview
--------------------------------------------------------------------------------
/src/Components/Footer/FooterSubOptions1.jsx:
--------------------------------------------------------------------------------
1 | import React from "react";
2 | import { Flex, Box } from "@chakra-ui/react";
3 | import style from "./Footer.module.css";
4 | import FooterSubOptionsText from "./FooterSubOptionsText";
5 | function FooterSubOptions1() {
6 | const textArr1 = [
7 | "Flats for Sale in Koramangala",
8 | "Flats for Sale in Marathahalli",
9 | "Flats for Sale in HSR Layout",
10 | "Flats for Sale in Whitefield",
11 | "Flats for Sale in Indira Nagar",
12 | "Flats for Sale in Bellandur",
13 | "Flats for Sale in Chandra Layout",
14 | "Flats for Sale in J. P. Nagar",
15 | "Flats for Sale in BTM Layout",
16 | "Flats for Sale in Jayanagar",
17 | "Flats for Sale in Bangalore Below 10 Lakhs",
18 | "Flats for Sale in Bangalore Below 15 Lakhs",
19 | "Flats for Sale in Bangalore Below 20 Lakhs",
20 | "Flats for Sale in Bangalore Below 25 Lakhs",
21 | "Flats for Sale in Bangalore Below 30 Lakhs",
22 | "Flats for Sale in Bangalore Below 35 Lakhs",
23 | "Flats for Sale in Bangalore Below 40 Lakhs",
24 | "Flats for Sale in Bangalore Below 45 Lakhs",
25 | "Flats for Sale in Bangalore Below 50 Lakhs",
26 | ];
27 |
28 | const textArr2 = [
29 | "Flats for Sale in Andheri West",
30 | "Flats for Sale in Andheri East",
31 | "Flats for Sale in Malad West",
32 | "Flats for Sale in Navi Mumbai",
33 | "Flats for Sale in Powai",
34 | "Flats for Sale in Thane West",
35 | "Flats for Sale in Mira Road East",
36 | "Flats for Sale in Kharghar",
37 | "Flats for Sale in Kandivali East",
38 | "Flats for Sale in Bandra West",
39 | "Flats for Sale in Mumbai Below 10 Lakhs",
40 | "Flats for Sale in Mumbai Below 15 Lakhs",
41 | "Flats for Sale in Mumbai Below 20 Lakhs",
42 | "Flats for Sale in Mumbai Below 25 Lakhs",
43 | "Flats for Sale in Mumbai Below 30 Lakhs",
44 | "Flats for Sale in Mumbai Below 35 Lakhs",
45 | "Flats for Sale in Mumbai Below 40 Lakhs",
46 | "Flats for Sale in Mumbai Below 45 Lakhs",
47 | "Flats for Sale in Mumbai Below 50 Lakhs",
48 | ];
49 |
50 | const textArr3 = [
51 | "Flats for Sale in Velachery",
52 | "Flats for Sale in Thiruvanmiyur",
53 | "Flats for Sale in Madipakkam",
54 | "Flats for Sale in Thoraipakkam",
55 | "Flats for Sale in Sholinganallur",
56 | "Flats for Sale in Medavakkam",
57 | "Flats for Sale in Mylapore",
58 | "Flats for Sale in Adyar",
59 | "Flats for Sale in T Nagar",
60 | "Flats for Sale in Perungudi",
61 | "Flats for Sale in Chennai Below 10 Lakhs",
62 | "Flats for Sale in Chennai Below 15 Lakhs",
63 | "Flats for Sale in Chennai Below 20 Lakhs",
64 | "Flats for Sale in Chennai Below 25 Lakhs",
65 | "Flats for Sale in Chennai Below 30 Lakhs",
66 | "Flats for Sale in Chennai Below 35 Lakhs",
67 | "Flats for Sale in Chennai Below 40 Lakhs",
68 | "Flats for Sale in Chennai Below 45 Lakhs",
69 | "Flats for Sale in Chennai Below 50 Lakhs",
70 | ];
71 | const textArr4 = [
72 | "Flats for Sale in Wakad",
73 | "Flats for Sale in Kharadi",
74 | "Flats for Sale in Baner",
75 | "Flats for Sale in Hadapsar",
76 | "Flats for Sale in Aundh",
77 | "Flats for Sale in Kothrud",
78 | "Flats for Sale in Pimple Saudagar",
79 | "Flats for Sale in Viman Nagar",
80 | "Flats for Sale in Pimpri",
81 | "Flats for Sale in Hinjewadi",
82 | "Flats for Sale in Pune Below 10 Lakhs",
83 | "Flats for Sale in Pune Below 15 Lakhs",
84 | "Flats for Sale in Pune Below 20 Lakhs",
85 | "Flats for Sale in Pune Below 25 Lakhs",
86 | "Flats for Sale in Pune Below 30 Lakhs",
87 | "Flats for Sale in Pune Below 35 Lakhs",
88 | "Flats for Sale in Pune Below 40 Lakhs",
89 | "Flats for Sale in Pune Below 45 Lakhs",
90 | "Flats for Sale in Pune Below 50 Lakhs",
91 | ];
92 | const textArr5 = [
93 | "1 BHK Flats in Gurgaon",
94 | "2 BHK Flats in Gurgaon",
95 | "3 BHK Flats in Gurgaon",
96 | "4 BHK Flats in Gurgaon",
97 | "4+ BHK in Gurgaon",
98 | "Fully Furnished Flats in Gurgaon",
99 | "Semi Furnished Flats in Gurgaon",
100 | "Unfurnished Flats in Gurgaon",
101 | "Independent Floor for Sale in Gurgaon",
102 | "Independent Houses For Sale in Gurgaon",
103 | "Flats for Sale in Gurgaon Below 10 Lakhs",
104 | "Flats for Sale in Gurgaon Below 15 Lakhs",
105 | "Flats for Sale in Gurgaon Below 20 Lakhs",
106 | "Flats for Sale in Gurgaon Below 25 Lakhs",
107 | "Flats for Sale in Gurgaon Below 30 Lakhs",
108 | "Flats for Sale in Gurgaon Below 35 Lakhs",
109 | "Flats for Sale in Gurgaon Below 40 Lakhs",
110 | "Flats for Sale in Gurgaon Below 45 Lakhs",
111 | "Flats for Sale in Gurgaon Below 50 Lakhs",
112 | ];
113 |
114 | return (
115 |
116 |
117 | Flats for Sale in Bangalore
118 | {textArr1.map((text, idx) => (
119 |
120 | ))}
121 |
122 |
123 | Flats for Sale in Mumbai
124 | {textArr2.map((text, idx) => (
125 |
126 | ))}
127 |
128 |
129 | Flats for Sale in Chennai
130 | {textArr3.map((text, idx) => (
131 |
132 | ))}
133 |
134 |
135 | Flats for Sale in Pune
136 | {textArr4.map((text, idx) => (
137 |
138 | ))}
139 |
140 |
141 | Flats in Gurgaon for Sale
142 | {textArr5.map((text, idx) => (
143 |
144 | ))}
145 |
146 |
147 | );
148 | }
149 |
150 | export default FooterSubOptions1;
151 |
--------------------------------------------------------------------------------
/src/Components/Card_Detail_Page/payment_detail.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react'
2 | import style from '../Rent_Page/rent.module.css'
3 |
4 |
5 | import {
6 | Button,
7 | VStack,
8 | Container,
9 | Flex,
10 | Image,
11 | Heading,
12 | Text ,
13 | Input ,
14 | FormLabel,
15 | Box,
16 | } from "@chakra-ui/react"
17 | import PaymentInfo from './PaymentInfo'
18 |
19 |
20 | export default function Detail() {
21 | return (
22 |
23 |
24 |
25 |
26 |
27 | Pay Rent and Fees with Credit Card
28 |
29 |
30 |
31 |
32 | Lowest Charges. Instant Transfers.
33 |
34 |
35 |
36 |
37 |
38 |
41 |
42 | Renter's Club
43 | Get 50% Off on processing fees by inviting your friends
44 |
45 |
46 |
47 |
50 |
51 | Now pay Society Maintenance too
52 | All your property payments at one place - rent, maintenance, deposit, token
53 |
54 |
55 |
56 |
59 |
60 |
61 | Earn upto ₹30,000/- in Rewards
62 | Earn miles and reward points on your Visa and Mastercard cards plus enjoy upto 45 days interest free credit period.
63 |
64 |
65 |
66 |
69 |
70 | Earn upto ₹30,000/- in Rewards
71 | Earn miles, get cash back and reward points on every property payment with your card.
72 |
73 |
74 |
75 |
78 |
79 | Pay with Credit Card
80 | Pay with Credit Carddescription We accept major cards like Visa and Mastercard so your property payment is hassle free.
81 |
82 |
83 |
84 |
87 |
88 | Enjoy 45 days interest free credit period
89 | Depending on your card statement date
90 |
91 |
92 |
93 |
96 |
97 | Reach Milestones Faster
98 | Earn rewards on those yearly spends with your credit card.
99 |
100 |
101 |
102 |
105 |
106 | Digital Receipts
107 | Payment receipts are generated instantly and sent directly to your email ID. Claim your HRA with ease.
108 |
109 |
110 |
111 |
114 |
115 | NoBroker Trust
116 | NoBroker Pay is a product by NoBroker and is 100% secure with PCI compliant payment gateway.
117 |
118 |
119 |
120 |
121 |
122 |
123 |
124 | )
125 | }
126 |
--------------------------------------------------------------------------------
/src/Components/SearchPages/FilterForSearchPage.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import Box from '@mui/material/Box';
3 | import Slider from '@mui/material/Slider';
4 | // import RefreshOutlinedIcon from '@mui/icons-material/RefreshOutlined';
5 | import '../../Styles/SearchPages/filter.css'
6 | import { Button } from '@mui/material';
7 |
8 |
9 | export const FilterForSearchPage = (props) => {
10 |
11 | const [value, setValue] = React.useState([20, 37]);
12 |
13 | const [filterType, setFilterType] = React.useState('filter')
14 |
15 | const handleChange = (event, newValue) => {
16 | setValue(newValue * 5000);
17 | };
18 |
19 |
20 | return (
21 |
22 |
23 | setFilterType('filter')}>Filter
24 | setFilterType('premium-filter')} >Premium Filter
25 |
26 | {
27 | filterType === 'filter' ?
28 |
29 |
30 |
props.setType('')}>refresh
31 |
32 |
33 | Apartment Type
34 |
35 |
36 | props.setType('1 RK')}>1RK
37 | props.setType('1BHK')}>1BHK
38 | props.setType('2BHK')}>2BHK
39 | props.setType('3 BHK')}>3BHK
40 | props.setType('4 BHK')}>4BHK
41 | props.setType('4+ RK')}>4+BHK
42 |
43 |
44 |
Price Range: ₹0 to ₹{value}
45 |
46 |
47 |
48 |
49 |
50 |
51 |
Availbility
52 |
53 |
54 |
55 | immidiate
56 |
57 |
58 |
59 | Within 15 days
60 |
61 |
62 |
63 | Within 15 days
64 |
65 |
66 |
67 | after 30 days
68 |
69 |
70 |
71 |
Furnishing
72 |
73 |
74 |
75 | Full
76 |
77 |
78 |
79 | semi
80 |
81 |
82 |
83 | none
84 |
85 |
86 |
87 |
88 | Floor
89 |
90 |
91 | Ground
92 | 1 to 3
93 | 4 to 6
94 | 7 to 9
95 | 10 {'&'} above
96 | Custom
97 |
98 |
99 |
100 |
101 |
102 | :
103 |
104 |
105 |
106 |
146 | }
147 |
148 |
149 | )
150 | }
151 |
--------------------------------------------------------------------------------
/src/Components/Footer/FooterSubOptions6.jsx:
--------------------------------------------------------------------------------
1 | import React from "react";
2 | import { Flex, Box } from "@chakra-ui/react";
3 | import style from "./Footer.module.css";
4 | import FooterSubOptionsText from "./FooterSubOptionsText";
5 | function FooterSubOptions6() {
6 | const textArr1 = [
7 | "Warehouse for Rent in Bangalore",
8 | "Commercial Office Space for Rent in Bangalore",
9 | "Coworking Spaces for Rent in Bangalore",
10 | "Commercial Shops for Rent in Bangalore",
11 | "Industrial Building for Rent in Bangalore",
12 | "Commercial Showrooms for Rent in Bangalore",
13 | "Industrial Shed for Rent in Bangalore",
14 | ];
15 |
16 | const textArr2 = [
17 | "Warehouse for Rent in Chennai",
18 | "Coworking Spaces for Rent in Chennai",
19 | "Office Space for Rent in Chennai",
20 | "Industrial Building for Rent in Chennai",
21 | "Commercial Shops for Rent in Chennai",
22 | "Commercial Showrooms for Rent in Chennai",
23 | "Industrial Shed for Rent in Chennai",
24 | ];
25 |
26 | const textArr3 = [
27 | "Warehouse for Rent in Pune",
28 | "Office Space for Rent in Pune",
29 | "Commercial Shops for Rent in Pune",
30 | "Industrial Shed for Rent in Pune",
31 | "Commercial Showrooms for Rent in Pune",
32 | "Coworking Spaces for Rent in Pune",
33 | "Industrial Building for Rent in Pune",
34 | ];
35 |
36 | const textArr4 = [
37 | "Office Space for Rent in Mumbai",
38 | "Industrial Building for Rent in Mumbai",
39 | "Warehouse for Rent in Mumbai",
40 | "Commercial Shops for Rent in Mumbai",
41 | "Coworking Spaces for Rent in Mumbai",
42 | "Commercial Showrooms for Rent in Mumbai",
43 | "Industrial Shed for Rent in Mumbai",
44 | ];
45 |
46 | const textArr5 = [
47 | "Office space for rent in gurgaon",
48 | "Warehouse for Rent in Gurgaon",
49 | "Commercial Showrooms for Rent in Gurgaon",
50 | "Industrial Building for Rent in Gurgaon",
51 | "Coworking Spaces for Rent in Gurgaon",
52 | "Industrial Shed for Rent in Gurgaon",
53 | "Commercial Shops for Rent in Gurgaon",
54 | ];
55 |
56 | const textArr6 = [
57 | "Office Space for Sale in Bangalore", "Industrial Building for Sale in Bangalore", "Coworking Spaces for Sale in Bangalore", "Industrial Shed for Sale in Bangalore", "Commercial Shops for Sale in Bangalore", "Warehouse for Sale in Bangalore", "Commercial Showrooms for Sale in Bangalore"
58 | ]
59 |
60 | const textArr7 = [
61 | "Office Space for Sale in Chennai", "Industrial Building for Sale in Chennai", "Coworking Spaces for Sale in Chennai", "Industrial Shed for Sale in Chennai", "Commercial Shops for Sale in Chennai", "Warehouse for Sale in Chennai", "Commercial Showrooms for Sale in Chennai"
62 | ]
63 |
64 | const textArr8 = [
65 | "Coworking Spaces for Sale in Pune", "Industrial Shed for Sale in Pune", "Industrial Building for Sale in Pune", "Commercial Shops for Sale in Pune", "Warehouse for Sale in Pune", "Commercial Showrooms for Sale in Pune", "Office Space for Sale in Pune"
66 | ]
67 |
68 | const textArr9 = [
69 | "Industrial Building for Sale in Mumbai", "Coworking Spaces for Sale in Mumbai", "Commercial Shops for Sale in Mumbai", "Industrial Shed for Sale in Mumbai", "Commercial Showrooms for Sale in Mumbai", "Warehouse for Sale in Mumbai", "Office Space for Sale in Mumbai"
70 | ]
71 |
72 | const textArr10 = [
73 | "Coworking Spaces for Sale in Gurgaon", "Industrial Shed for Sale in Gurgaon", "Commercial Shops for Sale in Gurgaon", "Commercial Showrooms for Sale in Gurgaon", "Warehouse for Sale in Gurgaon", "Office Space for Sale in Gurgaon", "Industrial Building for Sale in Gurgaon"
74 | ]
75 |
76 |
77 | return (
78 |
79 |
80 |
81 | Commercial Properties For Rent in Bangalore
82 | {textArr1.map((text, idx) => (
83 |
84 | ))}
85 |
86 |
87 | Commercial Properties For Rent in Chennai
88 | {textArr2.map((text, idx) => (
89 |
90 | ))}
91 |
92 |
93 | Commercial Properties For Rent in Pune
94 | {textArr3.map((text, idx) => (
95 |
96 | ))}
97 |
98 |
99 | Commercial Properties For Rent in Mumbai
100 | {textArr4.map((text, idx) => (
101 |
102 | ))}
103 |
104 |
105 | Commercial Properties For Rent in Gurgaon
106 | {textArr5.map((text, idx) => (
107 |
108 | ))}
109 |
110 |
111 |
112 |
113 |
114 | Commercial Properties For Sale in Bangalore
115 | {textArr6.map((text, idx) => (
116 |
117 | ))}
118 |
119 |
120 | Commercial Properties For Sale in Chennai
121 | {textArr7.map((text, idx) => (
122 |
123 | ))}
124 |
125 |
126 | Commercial Properties For Sale in Pune
127 | {textArr8.map((text, idx) => (
128 |
129 | ))}
130 |
131 |
132 | Commercial Properties For Sale in Mumbai
133 | {textArr9.map((text, idx) => (
134 |
135 | ))}
136 |
137 |
138 | Commercial Properties For Sale in Gurgaon
139 | {textArr10.map((text, idx) => (
140 |
141 | ))}
142 |
143 |
144 |
145 |
146 | );
147 | }
148 |
149 | export default FooterSubOptions6;
150 |
--------------------------------------------------------------------------------
/src/Components/Rent_Page/detailshow.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react'
2 | import Slider from './components/slider'
3 |
4 | import {
5 | Button,
6 | VStack,
7 | Container,
8 | Flex,
9 | Image,
10 | Heading,
11 | Text,
12 | } from "@chakra-ui/react"
13 | import style from './rent.module.css'
14 |
15 | export default function Detail() {
16 | return (
17 |
18 |
19 |
20 |
21 | Pay Rent and Fees with Credit Card
22 |
23 |
24 |
25 | Lowest Charges. Instant Transfers.
26 |
27 |
28 |
29 |
30 |
31 |
32 |
35 |
36 | Renter's Club
37 | Get 50% Off on processing fees by inviting your friends
38 |
39 |
40 |
41 |
44 |
45 | Now pay Society Maintenance too
46 | All your property payments at one place - rent, maintenance, deposit, token
47 |
48 |
49 |
50 |
53 |
54 |
55 | Earn upto ₹30,000/- in Rewards
56 | Earn miles and reward points on your Visa and Mastercard cards plus enjoy upto 45 days interest free credit period.
57 |
58 |
59 |
60 |
63 |
64 | Earn upto ₹30,000/- in Rewards
65 | Earn miles, get cash back and reward points on every property payment with your card.
66 |
67 |
68 |
69 |
72 |
73 | Pay with Credit Card
74 | Pay with Credit Carddescription We accept major cards like Visa and Mastercard so your property payment is hassle free.
75 |
76 |
77 |
78 |
81 |
82 | Enjoy 45 days interest free credit period
83 | Depending on your card statement date
84 |
85 |
86 |
87 |
90 |
91 | Reach Milestones Faster
92 | Earn rewards on those yearly spends with your credit card.
93 |
94 |
95 |
96 |
99 |
100 | Digital Receipts
101 | Payment receipts are generated instantly and sent directly to your email ID. Claim your HRA with ease.
102 |
103 |
104 |
105 |
108 |
109 | NoBroker Trust
110 | NoBroker Pay is a product by NoBroker and is 100% secure with PCI compliant payment gateway.
111 |
112 |
113 |
114 |
115 |
116 |
117 |
118 | )
119 | }
120 |
--------------------------------------------------------------------------------
/src/Components/Payment_Detail/payment_detail.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react'
2 | import Slider from './slider'
3 | import style from '../Rent_Page/rent.module.css'
4 |
5 |
6 | import {
7 | Button,
8 | VStack,
9 | Container,
10 | Flex,
11 | Image,
12 | Heading,
13 | Text,
14 | Input,
15 | FormLabel,
16 | Box,
17 | } from "@chakra-ui/react"
18 | import PaymentInfo from './PaymentInfo'
19 |
20 |
21 | export default function Detail() {
22 | return (
23 |
24 |
25 |
26 |
27 |
28 | Pay Rent and Fees with Credit Card
29 |
30 |
31 |
32 |
33 | Lowest Charges. Instant Transfers.
34 |
35 |
36 |
37 |
38 |
39 |
42 |
43 | Renter's Club
44 | Get 50% Off on processing fees by inviting your friends
45 |
46 |
47 |
48 |
51 |
52 | Now pay Society Maintenance too
53 | All your property payments at one place - rent, maintenance, deposit, token
54 |
55 |
56 |
57 |
60 |
61 |
62 | Earn upto ₹30,000/- in Rewards
63 | Earn miles and reward points on your Visa and Mastercard cards plus enjoy upto 45 days interest free credit period.
64 |
65 |
66 |
67 |
70 |
71 | Earn upto ₹30,000/- in Rewards
72 | Earn miles, get cash back and reward points on every property payment with your card.
73 |
74 |
75 |
76 |
79 |
80 | Pay with Credit Card
81 | Pay with Credit Carddescription We accept major cards like Visa and Mastercard so your property payment is hassle free.
82 |
83 |
84 |
85 |
88 |
89 | Enjoy 45 days interest free credit period
90 | Depending on your card statement date
91 |
92 |
93 |
94 |
97 |
98 | Reach Milestones Faster
99 | Earn rewards on those yearly spends with your credit card.
100 |
101 |
102 |
103 |
106 |
107 | Digital Receipts
108 | Payment receipts are generated instantly and sent directly to your email ID. Claim your HRA with ease.
109 |
110 |
111 |
112 |
115 |
116 | NoBroker Trust
117 | NoBroker Pay is a product by NoBroker and is 100% secure with PCI compliant payment gateway.
118 |
119 |
120 |
121 |
122 |
123 |
124 |
125 | )
126 | }
127 |
--------------------------------------------------------------------------------
/src/Pages/LoginSignup/Login.jsx:
--------------------------------------------------------------------------------
1 | import React from "react";
2 | import style from "./LoginSignup.module.css";
3 | import {
4 | Box,
5 | Text,
6 | Flex,
7 | Image,
8 | List,
9 | ListItem,
10 | ListIcon,
11 | CloseButton,
12 | InputGroup,
13 | InputLeftAddon,
14 | Input,
15 | Switch,
16 | Button,
17 | } from "@chakra-ui/react";
18 | import { BsCheck } from "react-icons/bs";
19 | import signupHome from "../../Images/Login/signupHome.png";
20 | import { Link, Navigate } from "react-router-dom";
21 | import { useDispatch, useSelector } from "react-redux";
22 | import { loginSignupReq } from "../../Redux/LoginSignup/action";
23 | import whatsappIcon from "../../Images/Login/whatsappIcon.png";
24 |
25 | function Login() {
26 | // const { loginReq } = useSelector((state) => state);
27 | // if (loginReq) {
28 | // document.querySelector("body").style.overflow = "hidden";
29 | // } else {
30 | // document.querySelector("body").style.overflow = "auto";
31 | // }
32 | const [show, setShow] = React.useState(true);
33 |
34 | const dispatch = useDispatch();
35 |
36 | React.useEffect(() => {
37 | dispatch(loginSignupReq(true));
38 |
39 | }, []);
40 |
41 | if (!show) {
42 | dispatch(loginSignupReq(false));
43 | return ;
44 | }
45 | return (
46 | show && (
47 |
48 |
49 |
50 |
51 |
52 | setShow(false)}
58 | />
59 |
60 |
61 |
62 |
63 |
64 |
71 |
72 |
73 |
74 | Login
75 |
76 |
77 |
78 |
79 | Zero Brokerage.
80 |
81 |
82 |
83 | Thousands of new listings daily.
84 |
85 |
86 |
87 | 100 Cr+ Brokerage saved monthly.
88 |
89 |
90 |
91 |
92 |
93 |
94 | Enter phone to continue
95 |
96 |
97 |
98 |
102 |
107 |
108 |
109 |
110 |
111 | Get updates on
112 |
118 | Whatsapp
119 |
120 |
121 |
122 |
123 |
124 |
125 |
126 |
127 | Continue
128 |
129 |
130 | Don't have an account?{" "}
131 | Sign Up
132 |
133 |
134 |
135 | By continuing, you agree to our{" "}
136 |
140 | Terms & Conditions
141 |
142 |
143 |
144 |
145 |
146 |
147 |
148 | )
149 | );
150 | }
151 |
152 | export default Login;
153 |
--------------------------------------------------------------------------------
/src/Components/Footer/FooterOptions.jsx:
--------------------------------------------------------------------------------
1 | import React from "react";
2 | import { Flex, Box, Text } from "@chakra-ui/react";
3 | import { Grid, GridItem, Wrap, WrapItem, Image, Link } from '@chakra-ui/react'
4 | import { FaFacebook, FaTwitter } from "react-icons/fa"
5 | import { AiFillInstagram, AiFillLinkedin } from "react-icons/ai"
6 | import youtubeLogo from "../../Images/footer/youtube.svg"
7 |
8 |
9 | import style from "./Footer.module.css";
10 |
11 |
12 |
13 | import FooterSubOptions1 from "./FooterSubOptions1";
14 | import FooterSubOptions2 from "./FooterSubOptions2";
15 | import FooterSubOptions3 from "./FooterSubOptions3";
16 | import FooterSubOptions4 from "./FooterSubOptions4";
17 | import FooterSubOptions5 from "./FooterSubOptions5";
18 | import FooterSubOptions6 from "./FooterSubOptions6";
19 | import FooterSubOptions7 from "./FooterSubOptions7";
20 |
21 |
22 | import androidDownload from "../../Images/footer/googlePlayStore.svg"
23 | import iosDonload from "../../Images/footer/iosDownload.svg"
24 |
25 | function FooterOptions() {
26 | const [selectedBg, setSelectedBg] = React.useState(1);
27 | return (
28 |
29 |
30 | setSelectedBg(1)} style={selectedBg === 1 ? { borderBottom: "3px solid black" } : {}}>Flats for Sale
31 | setSelectedBg(2)} style={selectedBg === 2 ? { borderBottom: "3px solid black" } : {}}>Flats for Rent
32 | setSelectedBg(3)} style={selectedBg === 3 ? { borderBottom: "3px solid black" } : {}}>PG / Hostels
33 | setSelectedBg(4)} style={selectedBg === 4 ? { borderBottom: "3px solid black" } : {}}>Flatmates
34 | setSelectedBg(5)} style={selectedBg === 5 ? { borderBottom: "3px solid black" } : {}}>Miscellaneous
35 | setSelectedBg(6)} style={selectedBg === 6 ? { borderBottom: "3px solid black" } : {}}>Commercial
36 | setSelectedBg(7)} style={selectedBg === 7 ? { borderBottom: "3px solid black" } : {}}>New Projects
37 |
38 | {selectedBg === 1 ? (
39 |
40 | ) : selectedBg === 2 ? (
41 |
42 | ) : selectedBg === 3 ? (
43 |
44 | ) : selectedBg === 4 ? (
45 |
46 | ) : selectedBg === 5 ? (
47 |
48 | ) : selectedBg === 6 ? (
49 |
50 | ) : (
51 |
52 | )}
53 | NoBroker Services
54 |
55 |
56 | Buy
57 |
58 | Home Loan
59 | Property Legal Services
60 | Interiors
61 | Sale Agreement
62 | NoBroker For NRI's
63 | New Builder Project
64 | EMI Calculator
65 | Home Loan Balance Transfer
66 | Home Loan Eligibility Check
67 | Apply Home Loan
68 | Pre Approved Home Loan
69 | Buy / Sell Property Questions
70 |
71 |
72 |
73 |
74 | Rent
75 |
76 | Rental Agreement
77 | Pay Rent
78 | Refer and Earn
79 | Home Services
80 | Packers and Movers
81 | Property Management in India
82 | Home Services Questions
83 | Rent Services Questions
84 |
85 |
86 |
87 |
88 |
89 | Find Property
90 | Select from thousands of options, without brokerage.
91 | Find Now
92 |
93 |
94 | List Your Property
95 | For Free. Without any brokerage.
96 | Free Posting
97 |
98 |
99 |
100 | About Us
101 | Careers
102 | Terms & Conditions
103 | Privacy Policy
104 | Testimonials
105 | Sitemap
106 | FAQs
107 |
108 |
109 |
110 |
111 |
112 |
113 |
114 |
115 |
116 |
117 |
118 |
119 |
120 |
121 |
122 |
123 |
124 |
125 |
126 |
127 |
128 |
129 |
130 |
131 |
132 |
133 |
134 | © 2013-22 NoBroker Technologies Solution Pvt. Ltd.
135 |
136 | );
137 | }
138 |
139 | export default FooterOptions;
140 |
--------------------------------------------------------------------------------
/src/Components/SearchPages/DataCard.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react'
2 | import '../../Styles/SearchPages/searchpage.css'
3 | import ChairOutlinedIcon from '@mui/icons-material/ChairOutlined';
4 | import FaceOutlinedIcon from '@mui/icons-material/FaceOutlined';
5 | import ApartmentOutlinedIcon from '@mui/icons-material/ApartmentOutlined';
6 | import KeyOutlinedIcon from '@mui/icons-material/KeyOutlined';
7 | import { Button } from '@mui/material';
8 | import FavoriteBorderOutlinedIcon from '@mui/icons-material/FavoriteBorderOutlined';
9 | import FlagTwoToneIcon from '@mui/icons-material/FlagTwoTone';
10 | import IosShareIcon from '@mui/icons-material/IosShare';
11 | import Carousel from 'react-elastic-carousel'
12 |
13 | export const DataCard = (props) => {
14 |
15 | const images = props.item.img;
16 |
17 | return (
18 |
19 |
20 |
21 |
22 |
23 |
{props.item.apartment_name}
24 |
25 |
26 |
27 |
28 |
29 |
30 |
31 |
32 |
33 | {props.item.parking}
34 | Parking
35 |
36 |
37 |
38 |
39 |
40 |
41 | {props.item.emi}
42 | Emi
43 |
44 |
45 |
46 |
47 |
48 |
49 | ₹ {props.item.total_square_feet_price} lacs
50 | Price
51 |
52 |
53 |
54 |
55 |
56 |
66 |
67 |
68 |
69 |
70 |
71 |
Semi furnished
72 |
Furnishing
73 |
74 |
75 |
76 |
77 |
78 |
{props.item.apartment_type}
79 |
Apartment Type
80 |
81 |
82 |
83 |
84 |
85 |
All
86 |
Preferred Tennant
87 |
88 |
89 |
90 |
91 |
92 |
Ready To Move
93 |
Available Form
94 |
95 |
96 |
97 |
98 |
99 | Get Owner Details
100 |
101 |
102 |
103 |
104 |
105 |
106 |
107 |
108 |
109 |
110 |
111 |
112 |
113 |
114 |
115 |
Nearby:
116 |
Q Cinemas
117 |
Metro Cash And Carry
118 |
Vishal Mega Mart
119 |
Janta Eating House
120 |
121 |
122 |
123 |
124 | )
125 | }
126 |
--------------------------------------------------------------------------------
/src/Pages/Homepage/Homepage.module.css:
--------------------------------------------------------------------------------
1 | body html {
2 | color: #464646 !important;
3 | font-size: 14px;
4 | font-family: Source Sans Pro, sans-serif !important;
5 | box-sizing: border-box;
6 | scroll-behavior: smooth;
7 | margin: 0;
8 | }
9 |
10 |
11 | .homepageContainer {
12 | padding-top: 70px;
13 | padding: 85px 20px 30px 20px;
14 | background-color: #fdfdfd;
15 | }
16 |
17 | .homeTitle {
18 | font-size: 32px;
19 | font-weight: 400;
20 | color: #787676;
21 | text-align: center;
22 | margin-bottom: 15px;
23 | padding-top: 40px;
24 | }
25 |
26 | .nIcon {
27 | align-items: center;
28 | justify-content: center;
29 | margin-bottom: 10px;
30 | box-sizing: border-box;
31 | color: #464646;
32 | font-size: 14px;
33 | font-family: Source Sans Pro, sans-serif;
34 | cursor: pointer;
35 | padding: 10px 15px;
36 | border-radius: 3px;
37 | background-color: rgba(252, 178, 68, .2);
38 | }
39 |
40 | .nIcon>img {
41 | margin-right: 5px;
42 | width: 18px;
43 | height: 18px;
44 | transition: .2s;
45 | animation: scale 1s ease-in-out infinite;
46 | }
47 |
48 | @keyframes scale {
49 | to {
50 | transform: scale(1.3);
51 | }
52 | }
53 |
54 | .buyRent {
55 | width: 370px;
56 | background-color: #fcfcfc;
57 | margin: 30px auto 0;
58 | border: solid #efefef;
59 | border-width: 1px 1px 0;
60 | border-radius: 4px 4px 0 0;
61 | grid-template-columns: repeat(3, 1fr);
62 | }
63 |
64 | .buyRent>div {
65 | text-align: center;
66 | border-right: 1px solid #efefef;
67 | border-top-left-radius: 4px;
68 | cursor: pointer;
69 | display: inline-block;
70 | line-height: 40px;
71 | font-size: 17px;
72 | font-weight: 400;
73 | color: #afaaaa;
74 | text-decoration: none;
75 | }
76 |
77 |
78 |
79 | .searchBox {
80 | width: 900px;
81 | margin: 0 auto;
82 | position: relative;
83 | align-items: center;
84 |
85 | cursor: default;
86 | flex-wrap: wrap;
87 | }
88 |
89 | .searchBox select {
90 | height: 50px;
91 | font-size: 16px;
92 | border-radius: 4px 0 0 0;
93 | border: 1px solid #e2e2e2;
94 | transition: all 100ms ease 0s;
95 | box-sizing: border-box;
96 | outline: 0px !important;
97 |
98 | }
99 |
100 | option {
101 | padding: 8px !important;
102 | font-size: 14px !important;
103 | }
104 |
105 |
106 | .searchInput {
107 | height: 100%;
108 | }
109 |
110 | .searchInput>input {
111 | width: 540px;
112 | height: 50px;
113 | font-size: 16px;
114 | border-radius: 0;
115 | border: 1px solid #e2e2e2;
116 | padding-left: 15px;
117 | }
118 |
119 |
120 |
121 | .searchButton {
122 | height: 50px !important;
123 | padding: 12px 20px;
124 | font-size: 18px;
125 | z-index: 1;
126 | width: 180px;
127 | border-radius: 0 4px 0 0 !important;
128 | font-weight: 400;
129 | }
130 |
131 | .searchButton:hover {
132 | background-color: #d72f45 !important;
133 | }
134 |
135 | .filterBox {
136 | height: 59px;
137 | background-color: #fcfcfc;
138 | width: 900px;
139 | margin: 0 auto;
140 | padding: 10px;
141 | border: 1px solid #e2e2e2;
142 | border-top: 0 solid #e2e2e2;
143 | border-radius: 0 0 4px 4px;
144 | align-items: center;
145 | }
146 |
147 | .postYourAd {
148 | cursor: pointer;
149 | font-weight: 300;
150 | border: 1px solid #e6e6e6;
151 | border-radius: 2px;
152 | font-size: 13px;
153 | font-family: Source Sans Pro, sans-serif;
154 | height: 40px;
155 | overflow: hidden;
156 | font-size: 16px;
157 | padding: 7px 25px;
158 | width: fit-content;
159 | margin: auto;
160 | }
161 |
162 |
163 | .optiosWithIcon {
164 | flex-wrap: wrap;
165 | align-items: baseline;
166 | text-align: center;
167 | justify-content: space-evenly;
168 | }
169 |
170 | .optiosWithIcon>div {
171 | padding: 10px 15px;
172 | cursor: pointer;
173 | /* text-decoration: none !important; */
174 | /* width: 16.6667%; */
175 | }
176 |
177 | .optiosWithIcon>div img:hover {
178 | cursor: pointer;
179 | transition-duration: 0.4s;
180 | transform: scale(1.2);
181 | }
182 |
183 | .optiosWithIcon>div>:first-child {
184 | font-size: 12px;
185 | font-weight: 600;
186 | display: inline-block;
187 | color: #464646;
188 | margin-bottom: 6px;
189 | background-color: #ffefd9;
190 | padding: 2px 8px;
191 | border-radius: 20px;
192 | }
193 |
194 | .optiosWithIcon>div>:last-child {
195 | font-size: 14px;
196 | margin-top: 10px;
197 | }
198 |
199 | .optiosWithIcon img {
200 | display: block;
201 | margin: auto;
202 | height: 60px;
203 | width: 60px;
204 | max-width: 100%;
205 | }
206 |
207 | .horizontalLineBox {
208 | display: flex;
209 | opacity: .5;
210 | align-items: center;
211 | height: 100%;
212 | width: 100%;
213 | overflow: hidden;
214 | }
215 |
216 | .horizontalLine {
217 | height: 1px;
218 | width: 100%;
219 | background-color: #707070;
220 | }
221 |
222 | .redCircle {
223 | height: 20px;
224 | width: 20px;
225 | border: 1px solid red;
226 | border-radius: 50%;
227 | }
228 |
229 | .whyUseNoBroker {
230 | text-align: center;
231 | grid-template-columns: repeat(4, 1fr);
232 | margin-top: 40px;
233 | margin: 40px;
234 | }
235 |
236 | .whyUseNoBroker img {
237 | margin: auto;
238 | }
239 |
240 | .whyUseNoBroker img:hover {
241 | cursor: pointer;
242 | transition-duration: 0.4s;
243 | transform: scale(1.2);
244 | }
245 |
246 | .whyUseNoBroker>div>:nth-child(2) {
247 | margin-top: 8px;
248 | font-size: 17px;
249 | }
250 |
251 | .whyUseNoBroker>div>:last-child {
252 | font-size: 14px;
253 | }
254 |
255 | .enquiryNow {
256 | padding: 40px 0;
257 | background-color: #f4f4f4;
258 | }
259 |
260 | .enquiryBtn {
261 | margin-top: 30px;
262 | text-decoration: none;
263 | display: inline-block;
264 | padding: 12px 24px;
265 | background-color: #fd3752;
266 | color: #fff;
267 | font-weight: 400;
268 | margin-bottom: 2px;
269 | }
270 |
271 | .reviewBox {
272 | padding: 40px;
273 | color: #fff;
274 | background-color: #334a5c;
275 |
276 | }
277 |
278 | .reviewBox iframe {
279 | display: inline;
280 | width: 560px;
281 | height: 320px;
282 | vertical-align: middle;
283 | }
284 |
285 |
286 |
287 | .userAvatarBox>img {
288 | height: 35px;
289 | width: 35px;
290 | border-radius: 100px;
291 | background-size: cover;
292 | margin-right: 10px;
293 | }
294 |
295 | .ratting_star {
296 | display: inline;
297 | width: 14px;
298 | color: #009587;
299 | }
300 |
301 | .descriptionBox {
302 | margin-top: 20px;
303 | max-height: 140px;
304 | overflow: hidden;
305 | }
306 |
307 |
308 |
309 | .mobileIconBox {
310 | padding: 40px;
311 | justify-content: center;
312 | align-items: center;
313 | }
314 |
315 | .mobileIconBox img {
316 | max-width: 80%;
317 | height: auto;
318 | display: inline-block;
319 | }
320 |
321 | .radioBtnBox>label>:last-child {
322 | font-size: 12px !important;
323 | }
324 |
325 |
326 | .apartmentType {
327 | border: 1px solid #e2e2e2 !important;
328 | font-size: 12px !important;
329 | border-radius: 0;
330 | background-color: #fcfcfc;
331 | }
332 |
333 |
334 | .menuItems {
335 | min-width: fit-content !important;
336 | padding: 0;
337 | border-radius: 0 !important;
338 | border: 1px solid #e2e2e2 !important;
339 | padding-right: 10px !important;
340 | }
341 |
342 | .menuItems2 {
343 | width: 100px;
344 | padding: 0;
345 | border-radius: 0 !important;
346 | border: 1px solid #e2e2e2 !important;
347 | padding-right: 10px !important;
348 | }
349 |
350 | .menuItems button>label>:last-child {
351 | font-size: 14px !important;
352 |
353 | }
354 |
355 | .menuItems2>button {
356 | font-size: 14px !important;
357 |
358 | }
--------------------------------------------------------------------------------
/src/Images/Homepage/iosDownload.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/src/Images/footer/iosDownload.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/src/Components/Navbar/Navbar.jsx:
--------------------------------------------------------------------------------
1 | import React from "react";
2 | import {
3 | Box,
4 | Flex,
5 | Text,
6 | Menu,
7 | MenuButton,
8 | IconButton,
9 | MenuList,
10 | MenuItem,
11 | Avatar,
12 | } from "@chakra-ui/react";
13 | import { ChevronDownIcon, HamburgerIcon } from "@chakra-ui/icons";
14 | import { Image } from "@chakra-ui/react";
15 | import style from "./NavBar.module.css";
16 | import logo from "../../Images/navbar/logo.png";
17 | import { Link } from "react-router-dom";
18 | import myBooking from "../../Images/navbar/myBookings.svg";
19 | import payRent from "../../Images/navbar/payrent.png";
20 | import { useDispatch, useSelector } from "react-redux";
21 | import { isUserLogged } from "../../Redux/LoginSignup/action";
22 |
23 | function Navbar() {
24 | const isUserLoggedIn = useSelector((state) => state.isUserLoggedIn);
25 | const dispatch = useDispatch()
26 | return (
27 |
28 |
29 |
30 |
31 |
32 |
33 |
34 |
35 |
36 | My Bookings
37 |
38 |
39 |
40 |
41 | Pay Rent
42 |
43 |
44 |
45 |
51 | For Property owners
52 |
53 |
54 | {!isUserLoggedIn ? (
55 |
56 |
57 | Sign Up
58 |
59 |
60 | Log In
61 |
62 |
63 | ) : (
64 |
65 | {/*
66 | Saurabh Singh */}
67 |
68 |
69 |
70 | Saurabh Singh
71 | }
77 | />
78 |
79 |
80 |
81 | Profile
82 |
83 |
84 | My Chats
85 |
86 |
87 | My Support Chats
88 |
89 |
90 | My Residential Plan
91 |
92 |
93 | My Commercial Plan
94 |
95 |
96 | My Dashboard
97 |
98 |
99 | My Listing
100 |
101 |
102 | My Rental Agreements
103 |
104 |
105 | dispatch(isUserLogged(false))}>Sign Out
106 |
107 |
108 |
109 |
110 |
111 | )}
112 |
113 |
114 | }
118 | variant="link"
119 | minW="fit-content !important"
120 | p="0 2px 0 0"
121 | />
122 | Menu
123 |
124 |
125 | Post Your Property
126 |
127 |
128 | Rental Agreement
129 |
130 |
131 | Painting & Cleaning
132 |
133 |
134 | Refer & Earn
135 |
136 |
137 | Rent Receipts
138 |
139 |
140 | Tenant Plans
141 |
142 |
143 | Owner Plans
144 |
145 |
146 | Buyer Plans
147 |
148 |
149 | Seller Plans
150 |
151 |
152 | Commercial Plans
153 |
154 |
155 | Careers
156 |
157 |
158 | Corporate Enquiry
159 |
160 |
161 | Blog
162 |
163 |
164 | Contact Us
165 |
166 |
167 |
168 |
169 |
170 |
171 | );
172 | }
173 |
174 | export default Navbar;
175 |
--------------------------------------------------------------------------------