Skip to content

Commit

Permalink
update
Browse files Browse the repository at this point in the history
  • Loading branch information
krishnagithub03 committed Oct 28, 2023
1 parent 45264d6 commit 49c9c4a
Show file tree
Hide file tree
Showing 20 changed files with 1,749 additions and 341 deletions.
1,293 changes: 1,239 additions & 54 deletions package-lock.json

Large diffs are not rendered by default.

8 changes: 7 additions & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -10,16 +10,22 @@
"preview": "vite preview"
},
"dependencies": {
"@emotion/react": "^11.11.1",
"@emotion/styled": "^11.11.0",
"@headlessui/react": "^1.7.16",
"@mui/material": "^5.14.15",
"@mui/styled-engine-sc": "^6.0.0-alpha.3",
"@reduxjs/toolkit": "^1.9.5",
"firebase": "^10.1.0",
"framer-motion": "^10.16.4",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react-icons": "^4.10.1",
"react-redux": "^8.1.2",
"react-router-dom": "^6.14.2",
"react-tabs": "^6.0.2",
"react-toastify": "^9.1.3"
"react-toastify": "^9.1.3",
"styled-components": "^6.1.0"
},
"devDependencies": {
"@types/react": "^18.2.15",
Expand Down
5 changes: 4 additions & 1 deletion src/App.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -25,7 +25,10 @@ function App() {
<MyState>
<Router>
<Routes>
<Route path="/" element={<Home />} />
<Route path="/" element={
<div className="relative z-0 bg-transparent"><Home /></div>

} />
<Route path="/allproducts" element={<Allproducts />} />
<Route path="/order" element={
<ProtectedRoute>
Expand Down
Binary file added src/assets/bg-hero.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
3 changes: 3 additions & 0 deletions src/assets/close.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added src/assets/farmer.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
6 changes: 6 additions & 0 deletions src/assets/index.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,6 @@
import bg1 from "../assets/bg-hero.jpg"
import logo from "../assets/logo.png"
import menu from "../assets/menu.svg"
import close from "../assets/close.svg"
import farmer from "../assets/farmer.png"
export { bg1 , logo, menu, close, farmer}
Binary file added src/assets/logo.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
3 changes: 3 additions & 0 deletions src/assets/menu.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
18 changes: 7 additions & 11 deletions src/components/filter/Filter.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -3,17 +3,13 @@ import myContext from '../../context/data/myContext'

function Filter() {
const context = useContext(myContext)
const { mode, searchkey, setSearchkey, filterType, setFilterType,
const { searchkey, setSearchkey, filterType, setFilterType,
filterPrice, setFilterPrice, product } = context

return (
<div>
<div className=' container mx-auto px-4 mt-5 '>
<div className="p-5 rounded-lg bg-green-300 drop-shadow-md border border-green-600"
style={{
backgroundColor: mode === 'dark' ? '#282c34' : '',
color: mode === 'dark' ? 'white' : '',
}}>
<div className="p-5 rounded-lg bg-[#445D48] drop-shadow-md">
<div className="relative">
<div className="absolute flex items-center ml-2 h-full">
<svg className="w-4 h-4 fill-current text-primary-gray-dark" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
Expand All @@ -27,27 +23,27 @@ function Filter() {
onChange={(e) => setSearchkey(e.target.value)}
id="searchkey"
placeholder="Search here"
className="px-8 py-3 w-full rounded-md bg-violet-0 border-transparent outline-0 text-sm" style={{ backgroundColor: mode === 'dark' ? 'rgb(64 66 70)' : '', color: mode === 'dark' ? 'white' : '', }} />
className="px-8 py-3 w-full rounded-md bg-violet-0 border-transparent outline-0 text-sm"/>
</div>
<div className="flex items-center justify-between mt-4">
<p className="font-medium">
<p className="font-medium text-white">
Filters
</p>
<button className="px-4 py-2 bg-gray-50hover:bg-gray-200 text-gray-800 text-sm font-medium rounded-md" style={{ color: mode === 'dark' ? 'white' : '' }}>
<button className="px-4 py-2 bg-gray-50hover:bg-gray-200 text-gray-900 text-sm font-medium rounded-md" >
Reset Filter
</button>
</div>
<div>
<div className="grid grid-cols-2 md:grid-cols-3 xl:grid-cols-4 gap-4 mt-4">
<select value={filterType} onChange={(e)=> setFilterType(e.target.value)} className="px-4 py-3 w-full rounded-md bg-gray-50 border-transparent outline-0 focus:border-gray-500 focus:bg-white focus:ring-0 text-sm" style={{ backgroundColor: mode === 'dark' ? 'rgb(64 66 70)' : '', color: mode === 'dark' ? 'white' : '', }}>
<select value={filterType} onChange={(e)=> setFilterType(e.target.value)} className="px-4 py-3 w-full rounded-md bg-[#001524] border-transparent outline-0 focus:border-gray-500 focus:bg-[#001524] focus:ring-0 text-sm">

{product.map((item, index) => {
return (
<option value={item.category}>{item.category}</option>
)
})}
</select>
<select value={filterPrice} onChange={(e)=>setFilterPrice(e.target.value)} className="px-4 py-3 w-full rounded-md bg-gray-50 border-transparent outline-0 focus:border-gray-500 focus:bg-white focus:ring-0 text-sm" style={{ backgroundColor: mode === 'dark' ? 'rgb(64 66 70)' : '', color: mode === 'dark' ? 'white' : '', }}>
<select value={filterPrice} onChange={(e)=>setFilterPrice(e.target.value)} className="px-4 py-3 w-full rounded-md bg-[#001524] border-transparent outline-0 focus:border-gray-500 focus:bg-[#001524] focus:ring-0 text-sm">
{product.map((item, index) => {
return (
<option value={item.price}>{item.price}</option>
Expand Down
40 changes: 13 additions & 27 deletions src/components/footer/Footer.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -3,70 +3,56 @@ import myContext from '../../context/data/myContext'
import { Link } from 'react-router-dom';

function Footer() {
const context = useContext(myContext);
const { mode } = context;
return (
<div>
<footer className="text-gray-600 body-font bg-gray-300" style={{ backgroundColor: mode === 'dark' ? 'rgb(46 49 55)' : '', color: mode === 'dark' ? 'white' : '', }}>
<footer className="text-gray-600 body-font bg-[#FDE5D4]">
<div className="container px-5 py-24 mx-auto" >
<div className="flex flex-wrap md:text-left text-center order-first">
<div className="lg:w-1/4 md:w-1/2 w-full px-4">
<h2 className="title-font font-medium text-gray-900 tracking-widest text-sm mb-3" style={{ color: mode === 'dark' ? 'white' : '' }}>CATEGORIES</h2>
<h2 className="title-font font-medium text-gray-900 tracking-widest text-sm mb-3">CATEGORIES</h2>
<nav className="list-none mb-10">
<li>
<a className="text-gray-600 hover:text-gray-800" style={{ color: mode === 'dark' ? 'white' : '' }}>Home</a>
<a className="text-gray-600 hover:text-gray-800">Home</a>
</li>
<li>
<a className="text-gray-600 hover:text-gray-800" style={{ color: mode === 'dark' ? 'white' : '' }}>Order</a>
<a className="text-gray-600 hover:text-gray-800" >Order</a>
</li>
<li>
<a className="text-gray-600 hover:text-gray-800" style={{ color: mode === 'dark' ? 'white' : '' }}>All Products</a>
</li>
<li>
<a className="text-gray-600 hover:text-gray-800" style={{ color: mode === 'dark' ? 'white' : '' }}>Cart</a>
<a className="text-gray-600 hover:text-gray-800">All Products</a>
</li>
</nav>
</div>
<div className="lg:w-1/4 md:w-1/2 w-full px-4">
<h2 className="title-font font-medium text-gray-900 tracking-widest text-sm mb-3 uppercase" style={{ color: mode === 'dark' ? 'white' : '' }}>Customer Service</h2>
<h2 className="title-font font-medium text-gray-900 tracking-widest text-sm mb-3 uppercase">Customer Service</h2>
<nav className="list-none mb-10">
<li>
<Link to={'/returnpolicy'} className="text-gray-600 hover:text-gray-800" style={{ color: mode === 'dark' ? 'white' : '' }}>Return Policy</Link>
<Link to={'/returnpolicy'} className="text-gray-600 hover:text-gray-800" >Return Policy</Link>
</li>
<li>
<Link to={'/about'} className="text-gray-600 hover:text-gray-800" style={{ color: mode === 'dark' ? 'white' : '' }}>About</Link>
<Link to={'/about'} className="text-gray-600 hover:text-gray-800" >About</Link>
</li>
<li>
<Link to={'/contact'} className="text-gray-600 hover:text-gray-800" style={{ color: mode === 'dark' ? 'white' : '' }}>Contact Us</Link>
<Link to={'/contact'} className="text-gray-600 hover:text-gray-800" >Contact Us</Link>
</li>
</nav>
</div>

{/* <div className="lg:w-1/4 md:w-1/2 w-full px-4">
<h2 className="title-font font-medium text-gray-900 tracking-widest text-sm mb-3" style={{ color: mode === 'dark' ? 'white' : '' }}>Services</h2>
<nav className="list-none mb-10">
<li>
<Link to={'/privacypolicy'} className="text-gray-600 hover:text-gray-800" style={{ color: mode === 'dark' ? 'white' : '' }}>Privacy</Link>
</li>
</nav>
</div> */}
<div className="lg:w-1/4 md:w-1/2 w-full px-4">
<img src="https://ecommerce-sk.vercel.app/pay.png" alt="" />
</div>
</div>

</div>

<div className="bg-gray-200" style={{ backgroundColor: mode === 'dark' ? 'rgb(55 57 61)' : '', color: mode === 'dark' ? 'white' : '', }}>
<div className="bg-gray-200" >
<div className="container px-5 py-3 mx-auto flex items-center sm:flex-row flex-col">
<Link to={'/'} className='flex'>
<div className="flex ">
<h1 className=' text-2xl font-bold text-black px-2 py-1 rounded' style={{ color: mode === 'dark' ? 'white' : '', }}>E-Mandi</h1>
<h1 className=' text-2xl font-bold text-black px-2 py-1 rounded' >E-Mandi</h1>
</div>
</Link>
<p className="text-sm text-gray-500 sm:ml-6 sm:mt-0 mt-4" style={{ color: mode === 'dark' ? 'white' : '' }}>© 2023 E-Mandi —
<a href="https://twitter.com/knyttneve" rel="noopener noreferrer" className="text-gray-600 ml-1" target="_blank" style={{ color: mode === 'dark' ? 'white' : '' }}>www.emandi.com</a>
<p className="text-sm text-gray-500 sm:ml-6 sm:mt-0 mt-4" >© 2023 E-Mandi —
<a href="https://twitter.com/knyttneve" rel="noopener noreferrer" className="text-gray-600 ml-1" target="_blank" >www.emandi.com</a>
</p>
<span className="inline-flex sm:ml-auto sm:mt-0 mt-4 justify-center sm:justify-start">
<a className="text-gray-500">
Expand Down
68 changes: 62 additions & 6 deletions src/components/heroSection/HeroSection.jsx
Original file line number Diff line number Diff line change
@@ -1,11 +1,67 @@
import React from 'react'
// import React from 'react'
// import { bg1 } from '../../assets'

function HeroSection() {
// function HeroSection() {
// return (
// <div className='min-h-screen'>
// <img src={bg1} alt=""/>
// <h2>Welcome to E-mandi!!</h2>
// <h5>A One Place Solution for Fresh Vegetables anf Fruits.</h5>
// </div>
// )
// }

// export default HeroSection
import { motion } from "framer-motion";

import { styles } from "../styles";
import { farmer } from "../../assets";

const Hero = () => {
return (
<div>
<img src="https://static.vecteezy.com/system/resources/previews/004/299/835/original/online-shopping-on-phone-buy-sell-business-digital-web-banner-application-money-advertising-payment-ecommerce-illustration-search-free-vector.jpg" alt="" />
</div>
<section
className='relative w-full h-screen mx-auto'
>
<div
className={`${ styles.paddingX } absolute insert-0 top-[120px] max-w-7xl mx-auto flex dlex-row items-start gap-5`}>
<div className="flex flex-col
justify-center items-center mt-5
// ">
{/* <div className="w-5 h-5 rounded-full bg-[#445D48]"/>
<div className="w-1 sm:h-80 h-40"/> */}
</div>

<div>
<h1 className={`${styles.heroHeadText} text-white`}>
Welcome to <span className='text-[#445D48]'>E-Mandi</span>
</h1>
<p className={`${styles.heroSubText} mt-2 text-white-100`}>One Stop Solution for your fresh vegetables,fruits and grains directy from Framers.<br className="sm:block hidden"/>Get Everything Fresh</p>
</div>
<div>
<img src={farmer} alt="" className=" w-[30rem] sm:h-96 h-28"/>
</div>
</div>
<div
className="absolute xs:bottom-10 bottom-32 w-full flex justify-center items-center"
>
<a href="/filter">
<div className="w-[35px] h-[64px] rounded-3xl border-4 border-secondary flex justify center items-start p-2">
<motion.dev
animate={{
y:[0,24,0]
}}
transition={{
duration: 1.5,
repeat : Infinity,
repeatType: 'loop'
}}
className="w-3 h-3 rounded-full bg-secondary mb-1"
/>
</div>
</a>
</div>
</section>
)
}

export default HeroSection
export default Hero
Loading

0 comments on commit 49c9c4a

Please sign in to comment.