complete application
This commit is contained in:
parent
118c01d816
commit
f7415ede05
17 changed files with 202 additions and 18 deletions
86
real_estate/client/package-lock.json
generated
86
real_estate/client/package-lock.json
generated
|
|
@ -8,12 +8,14 @@
|
|||
"name": "client",
|
||||
"version": "0.0.0",
|
||||
"dependencies": {
|
||||
"@react-google-maps/api": "^2.19.3",
|
||||
"@reduxjs/toolkit": "^2.2.1",
|
||||
"firebase": "^10.8.1",
|
||||
"react": "^18.2.0",
|
||||
"react-calendar": "^4.8.0",
|
||||
"react-dom": "^18.2.0",
|
||||
"react-icons": "^5.0.1",
|
||||
"react-iframe": "^1.8.5",
|
||||
"react-redux": "^9.1.0",
|
||||
"react-router-dom": "^6.22.3",
|
||||
"redux-persist": "^6.0.0",
|
||||
|
|
@ -971,6 +973,23 @@
|
|||
"resolved": "https://registry.npmjs.org/@firebase/webchannel-wrapper/-/webchannel-wrapper-0.10.5.tgz",
|
||||
"integrity": "sha512-eSkJsnhBWv5kCTSU1tSUVl9mpFu+5NXXunZc83le8GMjMlsWwQArSc7cJJ4yl+aDFY0NGLi0AjZWMn1axOrkRg=="
|
||||
},
|
||||
"node_modules/@googlemaps/js-api-loader": {
|
||||
"version": "1.16.2",
|
||||
"resolved": "https://registry.npmjs.org/@googlemaps/js-api-loader/-/js-api-loader-1.16.2.tgz",
|
||||
"integrity": "sha512-psGw5u0QM6humao48Hn4lrChOM2/rA43ZCm3tKK9qQsEj1/VzqkCqnvGfEOshDbBQflydfaRovbKwZMF4AyqbA==",
|
||||
"dependencies": {
|
||||
"fast-deep-equal": "^3.1.3"
|
||||
}
|
||||
},
|
||||
"node_modules/@googlemaps/markerclusterer": {
|
||||
"version": "2.5.3",
|
||||
"resolved": "https://registry.npmjs.org/@googlemaps/markerclusterer/-/markerclusterer-2.5.3.tgz",
|
||||
"integrity": "sha512-x7lX0R5yYOoiNectr10wLgCBasNcXFHiADIBdmn7jQllF2B5ENQw5XtZK+hIw4xnV0Df0xhN4LN98XqA5jaiOw==",
|
||||
"dependencies": {
|
||||
"fast-deep-equal": "^3.1.3",
|
||||
"supercluster": "^8.0.1"
|
||||
}
|
||||
},
|
||||
"node_modules/@grpc/grpc-js": {
|
||||
"version": "1.9.14",
|
||||
"resolved": "https://registry.npmjs.org/@grpc/grpc-js/-/grpc-js-1.9.14.tgz",
|
||||
|
|
@ -1224,6 +1243,33 @@
|
|||
"resolved": "https://registry.npmjs.org/@protobufjs/utf8/-/utf8-1.1.0.tgz",
|
||||
"integrity": "sha512-Vvn3zZrhQZkkBE8LSuW3em98c0FwgO4nxzv6OdSxPKJIEKY2bGbHn+mhGIPerzI4twdxaP8/0+06HBpwf345Lw=="
|
||||
},
|
||||
"node_modules/@react-google-maps/api": {
|
||||
"version": "2.19.3",
|
||||
"resolved": "https://registry.npmjs.org/@react-google-maps/api/-/api-2.19.3.tgz",
|
||||
"integrity": "sha512-jiLqvuOt5lOowkLeq7d077AByTyJp+s6hZVlLhlq7SBacBD37aUNpXBz2OsazfeR6Aw4a+9RRhAEjEFvrR1f5A==",
|
||||
"dependencies": {
|
||||
"@googlemaps/js-api-loader": "1.16.2",
|
||||
"@googlemaps/markerclusterer": "2.5.3",
|
||||
"@react-google-maps/infobox": "2.19.2",
|
||||
"@react-google-maps/marker-clusterer": "2.19.2",
|
||||
"@types/google.maps": "3.55.2",
|
||||
"invariant": "2.2.4"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"react": "^16.8 || ^17 || ^18",
|
||||
"react-dom": "^16.8 || ^17 || ^18"
|
||||
}
|
||||
},
|
||||
"node_modules/@react-google-maps/infobox": {
|
||||
"version": "2.19.2",
|
||||
"resolved": "https://registry.npmjs.org/@react-google-maps/infobox/-/infobox-2.19.2.tgz",
|
||||
"integrity": "sha512-6wvBqeJsQ/eFSvoxg+9VoncQvNoVCdmxzxRpLvmjPD+nNC6mHM0vJH1xSqaKijkMrfLJT0nfkTGpovrF896jwg=="
|
||||
},
|
||||
"node_modules/@react-google-maps/marker-clusterer": {
|
||||
"version": "2.19.2",
|
||||
"resolved": "https://registry.npmjs.org/@react-google-maps/marker-clusterer/-/marker-clusterer-2.19.2.tgz",
|
||||
"integrity": "sha512-x9ibmsP0ZVqzyCo1Pitbw+4b6iEXRw/r1TCy3vOUR3eKrzWLnHYZMR325BkZW2r8fnuWE/V3Fp4QZOP9qYORCw=="
|
||||
},
|
||||
"node_modules/@reduxjs/toolkit": {
|
||||
"version": "2.2.1",
|
||||
"resolved": "https://registry.npmjs.org/@reduxjs/toolkit/-/toolkit-2.2.1.tgz",
|
||||
|
|
@ -1640,6 +1686,11 @@
|
|||
"integrity": "sha512-/kYRxGDLWzHOB7q+wtSUQlFrtcdUccpfy+X+9iMBpHK8QLLhx2wIPYuS5DYtR9Wa/YlZAbIovy7qVdB1Aq6Lyw==",
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/@types/google.maps": {
|
||||
"version": "3.55.2",
|
||||
"resolved": "https://registry.npmjs.org/@types/google.maps/-/google.maps-3.55.2.tgz",
|
||||
"integrity": "sha512-JcTwzkxskR8DN/nnX96Pie3gGN3WHiPpuxzuQ9z3516o1bB243d8w8DHUJ8BohuzoT1o3HUFta2ns/mkZC8KRw=="
|
||||
},
|
||||
"node_modules/@types/lodash": {
|
||||
"version": "4.17.0",
|
||||
"resolved": "https://registry.npmjs.org/@types/lodash/-/lodash-4.17.0.tgz",
|
||||
|
|
@ -2817,8 +2868,7 @@
|
|||
"node_modules/fast-deep-equal": {
|
||||
"version": "3.1.3",
|
||||
"resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz",
|
||||
"integrity": "sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q==",
|
||||
"dev": true
|
||||
"integrity": "sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q=="
|
||||
},
|
||||
"node_modules/fast-glob": {
|
||||
"version": "3.3.2",
|
||||
|
|
@ -3367,6 +3417,14 @@
|
|||
"node": ">= 0.4"
|
||||
}
|
||||
},
|
||||
"node_modules/invariant": {
|
||||
"version": "2.2.4",
|
||||
"resolved": "https://registry.npmjs.org/invariant/-/invariant-2.2.4.tgz",
|
||||
"integrity": "sha512-phJfQVBuaJM5raOpJjSfkiD6BpbCE4Ns//LaXl6wGYtUBY83nWS6Rf9tXm2e8VaK60JEjYldbPif/A2B1C2gNA==",
|
||||
"dependencies": {
|
||||
"loose-envify": "^1.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/is-array-buffer": {
|
||||
"version": "3.0.4",
|
||||
"resolved": "https://registry.npmjs.org/is-array-buffer/-/is-array-buffer-3.0.4.tgz",
|
||||
|
|
@ -3820,6 +3878,11 @@
|
|||
"node": ">=4.0"
|
||||
}
|
||||
},
|
||||
"node_modules/kdbush": {
|
||||
"version": "4.0.2",
|
||||
"resolved": "https://registry.npmjs.org/kdbush/-/kdbush-4.0.2.tgz",
|
||||
"integrity": "sha512-WbCVYJ27Sz8zi9Q7Q0xHC+05iwkm3Znipc2XTlrnJbsHMYktW4hPhXUE8Ys1engBrvffoSCqbil1JQAa7clRpA=="
|
||||
},
|
||||
"node_modules/keyv": {
|
||||
"version": "4.5.4",
|
||||
"resolved": "https://registry.npmjs.org/keyv/-/keyv-4.5.4.tgz",
|
||||
|
|
@ -4590,6 +4653,17 @@
|
|||
"react": "*"
|
||||
}
|
||||
},
|
||||
"node_modules/react-iframe": {
|
||||
"version": "1.8.5",
|
||||
"resolved": "https://registry.npmjs.org/react-iframe/-/react-iframe-1.8.5.tgz",
|
||||
"integrity": "sha512-F4cQJGs3ydaG6fJWfuz9yLwOU0Trzl6kttXuUG+vYwosH8enOOFxZWEDQCSbNVO8ayjfYZeqLxEvdvcsSy4GvA==",
|
||||
"dependencies": {
|
||||
"object-assign": "^4.1.1"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"react": ">=16.x.x"
|
||||
}
|
||||
},
|
||||
"node_modules/react-is": {
|
||||
"version": "16.13.1",
|
||||
"resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz",
|
||||
|
|
@ -5248,6 +5322,14 @@
|
|||
"url": "https://github.com/sponsors/isaacs"
|
||||
}
|
||||
},
|
||||
"node_modules/supercluster": {
|
||||
"version": "8.0.1",
|
||||
"resolved": "https://registry.npmjs.org/supercluster/-/supercluster-8.0.1.tgz",
|
||||
"integrity": "sha512-IiOea5kJ9iqzD2t7QJq/cREyLHTtSmUT6gQsweojg9WH2sYJqZK9SswTu6jrscO6D1G5v5vYZ9ru/eq85lXeZQ==",
|
||||
"dependencies": {
|
||||
"kdbush": "^4.0.2"
|
||||
}
|
||||
},
|
||||
"node_modules/supports-color": {
|
||||
"version": "7.2.0",
|
||||
"resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
|
||||
|
|
|
|||
|
|
@ -10,12 +10,14 @@
|
|||
"preview": "vite preview"
|
||||
},
|
||||
"dependencies": {
|
||||
"@react-google-maps/api": "^2.19.3",
|
||||
"@reduxjs/toolkit": "^2.2.1",
|
||||
"firebase": "^10.8.1",
|
||||
"react": "^18.2.0",
|
||||
"react-calendar": "^4.8.0",
|
||||
"react-dom": "^18.2.0",
|
||||
"react-icons": "^5.0.1",
|
||||
"react-iframe": "^1.8.5",
|
||||
"react-redux": "^9.1.0",
|
||||
"react-router-dom": "^6.22.3",
|
||||
"redux-persist": "^6.0.0",
|
||||
|
|
|
|||
|
|
@ -11,6 +11,7 @@ import UpdateListing from './pages/UpdateListing'
|
|||
import Listing from './pages/Listing'
|
||||
import SearchProperties from './pages/SearchProperties'
|
||||
import Footer from './components/Footer'
|
||||
import Agent from './pages/Agent'
|
||||
|
||||
|
||||
const App = () => {
|
||||
|
|
@ -29,6 +30,7 @@ const App = () => {
|
|||
<Route path='/login' element={<Login/>}/>
|
||||
<Route path='/signup' element={<SignUp/>}/>
|
||||
<Route path='/contact' element={<Contact/>}/>
|
||||
<Route path='/contact-agent' element={<Agent/>}/>
|
||||
</Routes>
|
||||
<Footer/>
|
||||
</BrowserRouter>
|
||||
|
|
|
|||
BIN
real_estate/client/src/assets/contact.jpg
Normal file
BIN
real_estate/client/src/assets/contact.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 626 KiB |
BIN
real_estate/client/src/assets/contact1.png
Normal file
BIN
real_estate/client/src/assets/contact1.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 492 KiB |
BIN
real_estate/client/src/assets/contact2.png
Normal file
BIN
real_estate/client/src/assets/contact2.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 66 KiB |
BIN
real_estate/client/src/assets/hero1.jpg
Normal file
BIN
real_estate/client/src/assets/hero1.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 2 MiB |
|
|
@ -8,13 +8,13 @@ import { FaPhoneAlt } from "react-icons/fa";
|
|||
|
||||
const Footer = () => {
|
||||
return (
|
||||
<footer>
|
||||
<div className="max-w-6xl mx-auto pr-10 pl-10 pb-4">
|
||||
<footer className="bg-gray-50">
|
||||
<div className="max-w-6xl mx-auto pr-6 pl-6 pb-4">
|
||||
<div className="grid w-full justify-between sm:flex sm:justify-between md:flex md:grid-cols-1">
|
||||
<Link>
|
||||
<p className="text-blue-900 text-lg uppercase tracking-wide font-serif">Chicagoland</p>
|
||||
<p className="text-blue-900 text-lg uppercase tracking-wide font-serif pt-10">Chicagoland</p>
|
||||
</Link>
|
||||
<div className="grid grid-cols-2 gap-10 pt-5 md:grid-cols-3">
|
||||
<div className="grid grid-cols-2 gap-10 pt-10 md:grid-cols-3">
|
||||
<div className="flex flex-col">
|
||||
<p className="uppercase text-blue-900 font-semibold text-sm">About us</p>
|
||||
<div className="mt-2">
|
||||
|
|
|
|||
|
|
@ -18,9 +18,8 @@ const Navbar = () => {
|
|||
</Link>
|
||||
<ul className="flex gap-4 sm:px-10 px-5">
|
||||
<Link to="/"><li className="text-white tracking-wide text-center uppercase text-sm hidden md:inline">Home</li></Link>
|
||||
<Link to="/"><li className="text-white tracking-wide text-center uppercase text-sm hidden md:inline">Buying</li></Link>
|
||||
<Link to="/"><li className="text-white tracking-wide text-center uppercase text-sm hidden md:inline">Renting</li></Link>
|
||||
<Link to="/contact"><li className="text-white tracking-wide text-center uppercase text-sm hidden md:inline">Contact</li></Link>
|
||||
<Link to="/search"><li className="text-white tracking-wide text-center uppercase text-sm hidden md:inline">Buying/Renting</li></Link>
|
||||
<Link to="/contact"><li className="text-white tracking-wide text-center uppercase text-sm hidden md:inline">Agents</li></Link>
|
||||
<Link to="/profile" className="flex items-center gap-1">
|
||||
{currentUser ? (
|
||||
<img className="rounded-full h-7 w-7 object-cover bg-blue-100" src={currentUser.avatar} alt="" />
|
||||
|
|
|
|||
19
real_estate/client/src/pages/Agent.jsx
Normal file
19
real_estate/client/src/pages/Agent.jsx
Normal file
|
|
@ -0,0 +1,19 @@
|
|||
import contactAgent from '../assets/contact2.png'
|
||||
|
||||
const Agent = () => {
|
||||
return (
|
||||
<div>
|
||||
<div className="flex flex-col max-w-6xl mx-auto justify-center items-center my-24 gap-4 text-center">
|
||||
<img src={contactAgent} alt="" className=' w-48 h-48'/>
|
||||
<h1 className='px-5 text-blue-900 font-bold capitalize text-xl sm:text-2xl pt-5'>Connect with local agents</h1>
|
||||
<p className='px-5 text-gray-700'>Put your email address below to connect with a local agent.</p>
|
||||
<form className='flex flex-col gap-5 pt-5'>
|
||||
<input type="text" placeholder='Email' className="border p-2 rounded-md focus:outline-none"/>
|
||||
<button disabled className='border p-2 rounded-md bg-blue-950 text-white hover:opacity-90 disabled:opacity-80'>Connect</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default Agent
|
||||
|
|
@ -1,8 +1,42 @@
|
|||
import { Link } from "react-router-dom"
|
||||
import agent from '../assets/contact1.png'
|
||||
|
||||
|
||||
const Contact = () => {
|
||||
return (
|
||||
<div>Contact</div>
|
||||
<div>
|
||||
<div className="relative flex flex-col h-[30vh] md:h-[50vh] justify-center overflow-hidden">
|
||||
<div className="bg-hero2-pattern absolute z-10 w-full h-[30vh] md:h-[50vh] bg-no-repeat bg-cover bg-center opacity-50"></div>
|
||||
<div className="flex flex-col gap-2 sm:gap-4 p-28 px-5 w-[1200px] mx-auto z-30">
|
||||
<h1 className='text-slate-700 font-bold text-2xl md:text-6xl sm:text-4xl'>Find a local<span className='text-slate-500'> agent</span></h1>
|
||||
<h2 className='text-gray-600 text-sm sm:text-lg text-wrap'>A Local agent is the best agent to help you find
|
||||
<br /> your next perfect place to live.
|
||||
</h2>
|
||||
<Link to={'/contact-agent'}><button className='text-xs sm:text-sm text-white font-semibold hover:opacity-90 bg-blue-950 p-1 sm:p-2 rounded-md'>Find local agents</button></Link>
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex flex-col max-w-6xl mx-auto justify-center items-center my-10 gap-4 sm:gap-6 sm:flex-row px-5">
|
||||
<img src={agent} alt="" className="sm:h-40 sm:w-40 w-24 h-24" />
|
||||
<div className="flex flex-col gap-2 text-center sm:text-start">
|
||||
<h1 className="text-blue-900 font-bold tracking-wider">Find agents in Chicago area</h1>
|
||||
<h2 className="text-gray-700">Our agent services are a 100% free - no hidden fees or obligations.</h2>
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex flex-col max-w-6xl mx-auto justify-center items-center my-10 gap-4 px-5">
|
||||
<p className="text-sm">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
||||
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
|
||||
Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident,
|
||||
sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
||||
|
||||
<p className="text-sm">Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam,
|
||||
eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit,
|
||||
sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt. </p>
|
||||
|
||||
<p className="text-sm">Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur,
|
||||
adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat voluptatem. Ut enim ad minima veniam, quis nostrum exercitationem
|
||||
ullam corporis suscipit laboriosam, nisi ut aliquid ex ea commodi consequatur? </p>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
|
|
|
|||
38
real_estate/client/src/pages/Hero.jsx
Normal file
38
real_estate/client/src/pages/Hero.jsx
Normal file
|
|
@ -0,0 +1,38 @@
|
|||
import { GiHouse } from "react-icons/gi";
|
||||
import { BsFillBuildingsFill } from "react-icons/bs";
|
||||
import { MdOutlineRealEstateAgent } from "react-icons/md";
|
||||
import { FaUserLarge } from "react-icons/fa6";
|
||||
import { Link } from "react-router-dom";
|
||||
|
||||
const Hero = () => {
|
||||
return (
|
||||
<div>
|
||||
<div className="relative flex flex-col items-center justify-center h-[25vh] mt-10">
|
||||
<div className="bg-hero1-pattern absolute z-10 w-full h-[25vh] bg-no-repeat bg-cover bg-center opacity-40"></div>
|
||||
<p className="uppercase z-30 tracking-wider text-md font-serif mb-10 px-2 text-blue-900 sm:text-lg text-center font-bold"> You can be sure to find a right property for you and your family
|
||||
<br/> with Chicagoland
|
||||
</p>
|
||||
<div className="relative z-30 text-center text-blue-900 flex justify-center items-center gap-4 md:gap-10">
|
||||
<Link className="flex flex-col items-center justify-center text-center hover:text-sky-950">
|
||||
<h1 className="text-xl sm:text-3xl mb-2"><GiHouse/></h1>
|
||||
<p className="uppercase text-xs font-bold tracking-wider">Buying</p>
|
||||
</Link>
|
||||
<Link className="flex flex-col items-center justify-center text-center hover:text-sky-950">
|
||||
<h1 className="text-xl sm:text-3xl mb-2"><BsFillBuildingsFill/></h1>
|
||||
<p className="uppercase text-xs font-bold tracking-wider">Renting</p>
|
||||
</Link>
|
||||
<Link className="flex flex-col items-center justify-center text-center hover:text-sky-950">
|
||||
<h1 className="text-xl sm:text-3xl mb-2"><MdOutlineRealEstateAgent/></h1>
|
||||
<p className="uppercase text-xs font-bold tracking-wider">Get Offer</p>
|
||||
</Link>
|
||||
<Link to='/contact' className="flex flex-col items-center justify-center text-center hover:text-sky-950">
|
||||
<h1 className="text-xl sm:text-3xl mb-2"><FaUserLarge/></h1>
|
||||
<p className="uppercase text-xs font-bold tracking-wider">Find agents</p>
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default Hero
|
||||
|
|
@ -2,6 +2,7 @@ import { useEffect, useState } from "react"
|
|||
import Search from "../components/Search"
|
||||
import { Link } from "react-router-dom";
|
||||
import ListingCard from '../components/ListingCard'
|
||||
import Hero from "./Hero";
|
||||
|
||||
const Home = () => {
|
||||
const [offerListings, setOfferListings] = useState([]);
|
||||
|
|
@ -47,15 +48,15 @@ const Home = () => {
|
|||
|
||||
return (
|
||||
<>
|
||||
<div className="relative flex items-center justify-center h-[80vh]">
|
||||
<div className="bg-hero-pattern absolute z-10 w-full h-[80vh] bg-no-repeat bg-cover bg-center"></div>
|
||||
<div className="relative flex items-center justify-center h-[70vh]">
|
||||
<div className="bg-hero-pattern absolute z-10 w-full h-[70vh] bg-no-repeat bg-cover bg-center"></div>
|
||||
<div className="relative z-30 text-white text-center flex flex-col justify-center items-center">
|
||||
<h1 className="uppercase tracking-tight text-5xl font-serif mb-4 text-shadow-lg shadow-black">Chicago properties for sale</h1>
|
||||
<p className="text-shadow-DEFAULT shadow-black">Lorem ipsum dolor sit, amet consectetur adipisicing elit. <br />Alias dolorem error atque aut, asperiores et tempore iste quaerat pariatur maxime?</p>
|
||||
<h1 className="uppercase tracking-tight text-3xl font-serif mb-4 text-shadow-lg shadow-black sm:text-5xl">Chicago properties for sale</h1>
|
||||
<p className="text-shadow-DEFAULT shadow-black ">Lorem ipsum dolor sit, amet consectetur adipisicing elit. <br />Alias dolorem error atque aut, asperiores et tempore iste quaerat pariatur maxime?</p>
|
||||
<Search/>
|
||||
</div>
|
||||
</div>
|
||||
<div className="max-w-6xl mx-auto p-10 flex flex-col gap-4 my-10">
|
||||
<div className="max-w-6xl mx-auto p-10 flex flex-col gap-4">
|
||||
{offerListings && offerListings.length > 0 && (
|
||||
<div className=''>
|
||||
<div className='my-3'>
|
||||
|
|
@ -96,6 +97,7 @@ const Home = () => {
|
|||
</div>
|
||||
)}
|
||||
</div>
|
||||
<Hero/>
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -41,8 +41,9 @@ const Login = () => {
|
|||
|
||||
|
||||
return (
|
||||
<div className=' h-[65vh] py-20'>
|
||||
<div className="p-2 max-w-xs mx-auto">
|
||||
<h1 className="text-2xl uppercase text-center text-blue-900 font-serif my-10 tracking-wide">Login</h1>
|
||||
<h1 className="text-2xl uppercase text-center text-blue-900 font-serif my-6 tracking-wide">Login</h1>
|
||||
<form className="flex flex-col gap-5 text-sm" onSubmit={handleSubmit}>
|
||||
<input type="text" placeholder="Email" id="email" className="border p-2 rounded-md" onChange={handleChange}/>
|
||||
<input type="password" placeholder="Password" id="password" className="border p-2 rounded-md" onChange={handleChange}/>
|
||||
|
|
@ -55,6 +56,7 @@ const Login = () => {
|
|||
</div>
|
||||
{error && <p className='text-red-500 mt-5'>{error}</p>}
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -156,7 +156,7 @@ const SearchProperties = () => {
|
|||
<button className="bg-blue-950 text-white font-semibold p-1 rounded-md hover:opacity-95">Search</button>
|
||||
</form>
|
||||
</div>
|
||||
<div className="flex-1">
|
||||
<div className="flex-2">
|
||||
<h1 className="text-2xl font-semibold border-b p-8 text-blue-900 capitalize">Listing results</h1>
|
||||
<div className="flex flex-wrap p-8 gap-4">
|
||||
{!loading && listings.length === 0 &&(
|
||||
|
|
|
|||
|
|
@ -43,8 +43,9 @@ const SignUp = () => {
|
|||
|
||||
|
||||
return (
|
||||
<div className=' h-[65vh] py-20'>
|
||||
<div className="p-2 max-w-xs mx-auto">
|
||||
<h1 className="text-2xl uppercase text-center text-blue-900 font-serif my-10 tracking-wide">Sign Up</h1>
|
||||
<h1 className="text-2xl uppercase text-center text-blue-900 font-serif my-6 tracking-wide">Sign Up</h1>
|
||||
<form className="flex flex-col gap-5 text-sm" onSubmit={handleSubmit}>
|
||||
<input type="text" placeholder="Username" id="username" className="border p-2 rounded-md" onChange={handleChange}/>
|
||||
<input type="text" placeholder="Email" id="email" className="border p-2 rounded-md" onChange={handleChange}/>
|
||||
|
|
@ -58,6 +59,7 @@ const SignUp = () => {
|
|||
</div>
|
||||
{error && <p className='text-red-500 mt-5'>{error}</p>}
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -10,6 +10,8 @@ export default {
|
|||
extend: {
|
||||
backgroundImage: {
|
||||
'hero-pattern': "url('./src/assets/hero.jpg')",
|
||||
'hero1-pattern': "url('./src/assets/hero1.jpg')",
|
||||
'hero2-pattern': "url('./src/assets/contact.jpg')",
|
||||
},
|
||||
textShadow: {
|
||||
sm: '1px 1px 2px var(--tw-shadow-color)',
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue