diff --git a/Front-with-React/VigyBag/src/assets/Bamboo-Toothbrush-Set.jpeg b/Front-with-React/VigyBag/src/assets/Bamboo-Toothbrush-Set.jpeg new file mode 100644 index 00000000..5c59ea76 Binary files /dev/null and b/Front-with-React/VigyBag/src/assets/Bamboo-Toothbrush-Set.jpeg differ diff --git a/Front-with-React/VigyBag/src/assets/Biodegradable-Phone-Case.jpeg b/Front-with-React/VigyBag/src/assets/Biodegradable-Phone-Case.jpeg new file mode 100644 index 00000000..5f2ece71 Binary files /dev/null and b/Front-with-React/VigyBag/src/assets/Biodegradable-Phone-Case.jpeg differ diff --git a/Front-with-React/VigyBag/src/assets/Glass-Water-Bottle.webp b/Front-with-React/VigyBag/src/assets/Glass-Water-Bottle.webp new file mode 100644 index 00000000..6723853b Binary files /dev/null and b/Front-with-React/VigyBag/src/assets/Glass-Water-Bottle.webp differ diff --git a/Front-with-React/VigyBag/src/assets/Organic Cotton Towels.jpg b/Front-with-React/VigyBag/src/assets/Organic Cotton Towels.jpg new file mode 100644 index 00000000..1f193d07 Binary files /dev/null and b/Front-with-React/VigyBag/src/assets/Organic Cotton Towels.jpg differ diff --git a/Front-with-React/VigyBag/src/assets/Organic-Tea-Set.webp b/Front-with-React/VigyBag/src/assets/Organic-Tea-Set.webp new file mode 100644 index 00000000..7b0c11ad Binary files /dev/null and b/Front-with-React/VigyBag/src/assets/Organic-Tea-Set.webp differ diff --git a/Front-with-React/VigyBag/src/assets/Recycled-Paper-Journals.webp b/Front-with-React/VigyBag/src/assets/Recycled-Paper-Journals.webp new file mode 100644 index 00000000..574cfb06 Binary files /dev/null and b/Front-with-React/VigyBag/src/assets/Recycled-Paper-Journals.webp differ diff --git a/Front-with-React/VigyBag/src/assets/Reusable-Shopping-Bags.jpeg b/Front-with-React/VigyBag/src/assets/Reusable-Shopping-Bags.jpeg new file mode 100644 index 00000000..b01d14c8 Binary files /dev/null and b/Front-with-React/VigyBag/src/assets/Reusable-Shopping-Bags.jpeg differ diff --git a/Front-with-React/VigyBag/src/assets/avatar.png b/Front-with-React/VigyBag/src/assets/avatar.png new file mode 100644 index 00000000..0dc07114 Binary files /dev/null and b/Front-with-React/VigyBag/src/assets/avatar.png differ diff --git a/Front-with-React/VigyBag/src/assets/bamboo-comb.jpeg b/Front-with-React/VigyBag/src/assets/bamboo-comb.jpeg new file mode 100644 index 00000000..91955f32 Binary files /dev/null and b/Front-with-React/VigyBag/src/assets/bamboo-comb.jpeg differ diff --git a/Front-with-React/VigyBag/src/assets/basket.png b/Front-with-React/VigyBag/src/assets/basket.png new file mode 100644 index 00000000..41931fba Binary files /dev/null and b/Front-with-React/VigyBag/src/assets/basket.png differ diff --git a/Front-with-React/VigyBag/src/assets/coffee-mug.png b/Front-with-React/VigyBag/src/assets/coffee-mug.png new file mode 100644 index 00000000..59e2520a Binary files /dev/null and b/Front-with-React/VigyBag/src/assets/coffee-mug.png differ diff --git a/Front-with-React/VigyBag/src/assets/cuttery-set.jpg b/Front-with-React/VigyBag/src/assets/cuttery-set.jpg new file mode 100644 index 00000000..9bc153d5 Binary files /dev/null and b/Front-with-React/VigyBag/src/assets/cuttery-set.jpg differ diff --git a/Front-with-React/VigyBag/src/assets/eco-friendly-notebooks.jpeg b/Front-with-React/VigyBag/src/assets/eco-friendly-notebooks.jpeg new file mode 100644 index 00000000..66c098a5 Binary files /dev/null and b/Front-with-React/VigyBag/src/assets/eco-friendly-notebooks.jpeg differ diff --git a/Front-with-React/VigyBag/src/assets/granola.jpg b/Front-with-React/VigyBag/src/assets/granola.jpg new file mode 100644 index 00000000..2bde305b Binary files /dev/null and b/Front-with-React/VigyBag/src/assets/granola.jpg differ diff --git a/Front-with-React/VigyBag/src/assets/like.png b/Front-with-React/VigyBag/src/assets/like.png new file mode 100644 index 00000000..aaa81b79 Binary files /dev/null and b/Front-with-React/VigyBag/src/assets/like.png differ diff --git a/Front-with-React/VigyBag/src/assets/profile.png b/Front-with-React/VigyBag/src/assets/profile.png new file mode 100644 index 00000000..ff20a20a Binary files /dev/null and b/Front-with-React/VigyBag/src/assets/profile.png differ diff --git a/Front-with-React/VigyBag/src/assets/shawals.jpg b/Front-with-React/VigyBag/src/assets/shawals.jpg new file mode 100644 index 00000000..540a5ffe Binary files /dev/null and b/Front-with-React/VigyBag/src/assets/shawals.jpg differ diff --git a/Front-with-React/VigyBag/src/assets/spoon-set.png b/Front-with-React/VigyBag/src/assets/spoon-set.png new file mode 100644 index 00000000..b4b99a9b Binary files /dev/null and b/Front-with-React/VigyBag/src/assets/spoon-set.png differ diff --git a/Front-with-React/VigyBag/src/assets/vigybag-carry-bag.png b/Front-with-React/VigyBag/src/assets/vigybag-carry-bag.png new file mode 100644 index 00000000..07f85e64 Binary files /dev/null and b/Front-with-React/VigyBag/src/assets/vigybag-carry-bag.png differ diff --git a/Front-with-React/VigyBag/src/components/Aside(Dashboard)/Aside.jsx b/Front-with-React/VigyBag/src/components/Aside(Dashboard)/Aside.jsx new file mode 100644 index 00000000..d2ff443d --- /dev/null +++ b/Front-with-React/VigyBag/src/components/Aside(Dashboard)/Aside.jsx @@ -0,0 +1,50 @@ +import React from 'react'; +import { FaHome, FaClipboardList, FaShoppingCart, FaHeart, FaBell, FaQuestionCircle, FaPhoneAlt } from 'react-icons/fa'; +import Logo from '../../assets/offical_logo.png'; + +const Aside = () => { + return ( + + ); +}; + +export default Aside; diff --git a/Front-with-React/VigyBag/src/components/Aside/Aside.jsx b/Front-with-React/VigyBag/src/components/Aside/Aside.jsx new file mode 100644 index 00000000..462f77ff --- /dev/null +++ b/Front-with-React/VigyBag/src/components/Aside/Aside.jsx @@ -0,0 +1,50 @@ +import React from 'react'; +import { FaHome, FaClipboardList, FaShoppingCart, FaHeart, FaBell, FaQuestionCircle, FaPhoneAlt } from 'react-icons/fa'; +import Logo from '../../assets/offical_logo.png'; + +const Aside = () => { + return ( + + ); +}; + +export default Aside; diff --git a/Front-with-React/VigyBag/src/components/ProductCard/ProductCard.jsx b/Front-with-React/VigyBag/src/components/ProductCard/ProductCard.jsx new file mode 100644 index 00000000..46070f23 --- /dev/null +++ b/Front-with-React/VigyBag/src/components/ProductCard/ProductCard.jsx @@ -0,0 +1,29 @@ +import React from 'react'; +import { FaStar } from 'react-icons/fa'; +import {FaShoppingCart} from'react-icons/fa'; + +const ProductCard = ({ image, title, price, rating }) => { + return ( +
+ {title} +
+

{title}

+ +
+

₹{price}

+ {[...Array(rating)].map((_, i) => ( + + ))} +
+ +
+
+ ); +}; + +export default ProductCard; diff --git a/Front-with-React/VigyBag/src/main.jsx b/Front-with-React/VigyBag/src/main.jsx index c018714d..3a8e8d42 100644 --- a/Front-with-React/VigyBag/src/main.jsx +++ b/Front-with-React/VigyBag/src/main.jsx @@ -10,6 +10,7 @@ import DecorativeItems from './pages/Category/DecorativeItems'; import AboutUs from './pages/AboutUs'; import Gifts from './pages/gifts/Gifts'; import Contact from './pages/Contact'; +import Dashboard from './pages/Dashboard'; import Home from './pages/Home'; import Layout from './Layout' import Team from './components/Team/Team'; @@ -37,6 +38,7 @@ const router = createBrowserRouter( }/> }/> }/> + }/> ) ) diff --git a/Front-with-React/VigyBag/src/pages/Contact.jsx b/Front-with-React/VigyBag/src/pages/Contact.jsx index eb724fcb..35663339 100644 --- a/Front-with-React/VigyBag/src/pages/Contact.jsx +++ b/Front-with-React/VigyBag/src/pages/Contact.jsx @@ -1,9 +1,92 @@ -import React from 'react' +import React from 'react'; +import { FaEnvelope, FaPhone } from 'react-icons/fa'; +import Logo from '../assets/offical_logo.png'; -function Contact() { +const ContactForm = () => { return ( -
This is Contact us page
- ) -} +
+
+
+
+ +
+
+

Contact Us

+

Got something to say? Let us know!

-export default Contact \ No newline at end of file +
+
+ +
+
+ +
+
+ +
+
+ +
+
+ +
+
+ +
+ +
+ +
+ +
+

or contact us via

+
+
+ + customersupport@vigybag.in +
+
+ + +91 9123456789 +
+
+
+
+
+ ); +}; + +export default ContactForm; diff --git a/Front-with-React/VigyBag/src/pages/Dashboard.jsx b/Front-with-React/VigyBag/src/pages/Dashboard.jsx index 15b4150a..183f02a9 100644 --- a/Front-with-React/VigyBag/src/pages/Dashboard.jsx +++ b/Front-with-React/VigyBag/src/pages/Dashboard.jsx @@ -1,13 +1,206 @@ -import React from "react"; -import Navbar from "../components/Navbar/Navbar"; - -function Dashboard() { - return ( -
- -

Dashboard

+import React, { useState } from 'react'; +import granola from '../assets/granola.jpg'; +import cuttery from '../assets/cuttery-set.jpg'; +import basket from '../assets/basket.png'; +import shawls from '../assets/shawals.jpg'; +import notebooks from '../assets/eco-friendly-notebooks.jpeg'; +import toothbrushes from '../assets/Bamboo-Toothbrush-Set.jpeg'; +import towels from '../assets/Organic Cotton Towels.jpg'; +import shoppingBags from '../assets/Reusable-Shopping-Bags.jpeg'; +import phoneCase from '../assets/Biodegradable-Phone-Case.jpeg'; +import journals from '../assets/Recycled-Paper-Journals.webp'; +import waterBottle from '../assets/Glass-Water-Bottle.webp'; +import teaSet from '../assets/Organic-Tea-Set.webp'; +import { FaSearch } from 'react-icons/fa'; +import carryBag from '../assets/vigybag-carry-bag.png'; +import profile from '../assets/profile.png'; +import ProductCard from '../components/ProductCard/ProductCard'; +import Aside from '../components/Aside/Aside'; + +const Dashboard = () => { + + const initialProducts = [ + { + image: granola, + title: "Snacker's Special Granola", + price: 350, + rating: 5, + }, + { + image: cuttery, + title: 'Wooden Cutlery Set of 7', + price: 1200, + rating: 4, + }, + { + image: basket, + title: 'Jute Cotton Basket', + price: 399, + rating: 4, + }, + { + image: shawls, + title: 'Premium Woolen Shawls', + price: 5000, + rating: 5, + }, + ]; + + const moreProducts = [ + { + image: notebooks, + title: 'Eco-Friendly Notebook', + price: 250, + rating: 4, + }, + { + image: toothbrushes, + title: 'Bamboo Toothbrush Set', + price: 150, + rating: 5, + }, + { + image: towels, + title: 'Organic Cotton Towels', + price: 600, + rating: 4, + }, + { + image: shoppingBags, + title: 'Reusable Shopping Bags', + price: 300, + rating: 5, + }, + { + image: phoneCase, + title: 'Biodegradable Phone Case', + price: 450, + rating: 5, + }, + { + image: journals, + title: 'Recycled Paper Journals', + price: 200, + rating: 4, + }, + { + image: waterBottle, + title: 'Glass Water Bottle', + price: 350, + rating: 5, + }, + { + image: teaSet, + title: 'Organic Tea Set', + price: 750, + rating: 5, + }, + ]; + + const [products] = useState([...initialProducts, ...moreProducts]); + const [visibleProducts, setVisibleProducts] = useState(4); + const [clicked, setClicked] = useState(0); + const [showViewLess, setShowViewLess] = useState(false); + + const handleSeeMore = () => { + if (clicked === 0) { + setVisibleProducts(visibleProducts + 4); + } else if (clicked === 1) { + setVisibleProducts(products.length); + setShowViewLess(true); + } + setClicked(clicked + 1); + }; + + const handleViewLess = () => { + setVisibleProducts(4); + setClicked(0); + setShowViewLess(false); + }; + + return ( + +
+ + {/* Sidebar */} +
+ ); +}; + +export default Dashboard; diff --git a/Front-with-React/VigyBag/src/pages/Login/Login.jsx b/Front-with-React/VigyBag/src/pages/Login/Login.jsx index b3263c4e..7ccc3c80 100644 --- a/Front-with-React/VigyBag/src/pages/Login/Login.jsx +++ b/Front-with-React/VigyBag/src/pages/Login/Login.jsx @@ -12,7 +12,8 @@ function Login() { <>
-
+
-
- Illustration +
+ Illustration