diff --git a/client/package-lock.json b/client/package-lock.json index 2ef8c8a6..c1fe8ec5 100644 --- a/client/package-lock.json +++ b/client/package-lock.json @@ -20,6 +20,7 @@ "axios": "^1.7.3", "flowbite-react": "^0.10.2", "lottie-react": "^2.4.0", + "mdb-react-ui-kit": "^9.0.0", "react": "^18.3.1", "react-dom": "^18.3.1", "react-hot-toast": "^2.4.1", @@ -30,6 +31,9 @@ "swiper": "^11.1.14", "tailwindcss": "^3.4.4", "web-vitals": "^2.1.4" + }, + "devDependencies": { + "@babel/plugin-proposal-private-property-in-object": "^7.21.11" } }, "node_modules/@adobe/css-tools": { @@ -682,9 +686,18 @@ } }, "node_modules/@babel/plugin-proposal-private-property-in-object": { - "version": "7.21.0-placeholder-for-preset-env.2", - "resolved": "https://registry.npmjs.org/@babel/plugin-proposal-private-property-in-object/-/plugin-proposal-private-property-in-object-7.21.0-placeholder-for-preset-env.2.tgz", - "integrity": "sha512-SOSkfJDddaM7mak6cPEpswyTRnuRltl429hMraQEglW+OkovnCzsiszTmsrlY//qLFjCpQDFRvjdm2wA5pPm9w==", + "version": "7.21.11", + "resolved": "https://registry.npmjs.org/@babel/plugin-proposal-private-property-in-object/-/plugin-proposal-private-property-in-object-7.21.11.tgz", + "integrity": "sha512-0QZ8qP/3RLDVBwBFoWAwCtgcDZJVwA5LUJRZU8x2YFfKNuFq161wK3cuGrALu5yiPu+vzwTAg/sMWVNeWeNyaw==", + "deprecated": "This proposal has been merged to the ECMAScript standard and thus this plugin is no longer maintained. Please use @babel/plugin-transform-private-property-in-object instead.", + "dev": true, + "license": "MIT", + "dependencies": { + "@babel/helper-annotate-as-pure": "^7.18.6", + "@babel/helper-create-class-features-plugin": "^7.21.0", + "@babel/helper-plugin-utils": "^7.20.2", + "@babel/plugin-syntax-private-property-in-object": "^7.14.5" + }, "engines": { "node": ">=6.9.0" }, @@ -1927,6 +1940,18 @@ "@babel/core": "^7.0.0-0" } }, + "node_modules/@babel/preset-env/node_modules/@babel/plugin-proposal-private-property-in-object": { + "version": "7.21.0-placeholder-for-preset-env.2", + "resolved": "https://registry.npmjs.org/@babel/plugin-proposal-private-property-in-object/-/plugin-proposal-private-property-in-object-7.21.0-placeholder-for-preset-env.2.tgz", + "integrity": "sha512-SOSkfJDddaM7mak6cPEpswyTRnuRltl429hMraQEglW+OkovnCzsiszTmsrlY//qLFjCpQDFRvjdm2wA5pPm9w==", + "license": "MIT", + "engines": { + "node": ">=6.9.0" + }, + "peerDependencies": { + "@babel/core": "^7.0.0-0" + } + }, "node_modules/@babel/preset-env/node_modules/semver": { "version": "6.3.1", "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz", @@ -9544,6 +9569,53 @@ "url": "https://github.com/sponsors/rawify" } }, + "node_modules/framer-motion": { + "version": "10.18.0", + "resolved": "https://registry.npmjs.org/framer-motion/-/framer-motion-10.18.0.tgz", + "integrity": "sha512-oGlDh1Q1XqYPksuTD/usb0I70hq95OUzmL9+6Zd+Hs4XV0oaISBa/UUMSjYiq6m8EUF32132mOJ8xVZS+I0S6w==", + "license": "MIT", + "dependencies": { + "tslib": "^2.4.0" + }, + "optionalDependencies": { + "@emotion/is-prop-valid": "^0.8.2" + }, + "peerDependencies": { + "react": "^18.0.0", + "react-dom": "^18.0.0" + }, + "peerDependenciesMeta": { + "react": { + "optional": true + }, + "react-dom": { + "optional": true + } + } + }, + "node_modules/framer-motion/node_modules/@emotion/is-prop-valid": { + "version": "0.8.8", + "resolved": "https://registry.npmjs.org/@emotion/is-prop-valid/-/is-prop-valid-0.8.8.tgz", + "integrity": "sha512-u5WtneEAr5IDG2Wv65yhunPSMLIpuKsbuOktRojfrEiEvRyC85LgPMZI63cr7NUqT8ZIGdSVg8ZKGxIug4lXcA==", + "license": "MIT", + "optional": true, + "dependencies": { + "@emotion/memoize": "0.7.4" + } + }, + "node_modules/framer-motion/node_modules/@emotion/memoize": { + "version": "0.7.4", + "resolved": "https://registry.npmjs.org/@emotion/memoize/-/memoize-0.7.4.tgz", + "integrity": "sha512-Ja/Vfqe3HpuzRsG1oBtWTHk2PGZ7GR+2Vz5iYGelAw8dx32K0y7PjVuxK6z1nMpZOqAFsRUPCkK1YjJ56qJlgw==", + "license": "MIT", + "optional": true + }, + "node_modules/framer-motion/node_modules/tslib": { + "version": "2.7.0", + "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.7.0.tgz", + "integrity": "sha512-gLXCKdN1/j47AiHiOkJN69hJmcbGTHI0ImLmbYLHykhgeN0jVGola9yVjFgzCUklsZQMW55o+dW7IXv3RCXDzA==", + "license": "0BSD" + }, "node_modules/fresh": { "version": "0.5.2", "resolved": "https://registry.npmjs.org/fresh/-/fresh-0.5.2.tgz", @@ -13400,6 +13472,43 @@ "tmpl": "1.0.5" } }, + "node_modules/mdb-react-ui-kit": { + "version": "9.0.0", + "resolved": "https://registry.npmjs.org/mdb-react-ui-kit/-/mdb-react-ui-kit-9.0.0.tgz", + "integrity": "sha512-1c4r7WH6CSULnNjlJUaFWwGgzVXWmVA7IjLyrgCcVkQoQgknOeXmGIVrKls4nKrdlh1TmG5fbTJs+rDlAFVNlg==", + "license": "SEE LICENSE IN ", + "dependencies": { + "@popperjs/core": "2.11.5", + "clsx": "1.1.1", + "framer-motion": "^10.16.4", + "react-popper": "2.3.0" + }, + "peerDependencies": { + "@types/react": "^18.0.9", + "@types/react-dom": "^18.0.3", + "react": "^18.1.0", + "react-dom": "^18.1.0" + } + }, + "node_modules/mdb-react-ui-kit/node_modules/@popperjs/core": { + "version": "2.11.5", + "resolved": "https://registry.npmjs.org/@popperjs/core/-/core-2.11.5.tgz", + "integrity": "sha512-9X2obfABZuDVLCgPK9aX0a/x4jaOEweTTWE2+9sr0Qqqevj2Uv5XorvusThmc9XGYpS9yI+fhh8RTafBtGposw==", + "license": "MIT", + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/popperjs" + } + }, + "node_modules/mdb-react-ui-kit/node_modules/clsx": { + "version": "1.1.1", + "resolved": "https://registry.npmjs.org/clsx/-/clsx-1.1.1.tgz", + "integrity": "sha512-6/bPho624p3S2pMyvP5kKBPXnI3ufHLObBFCfgx+LkeR5lg2XYy2hqZqUf45ypD8COn2bhgGJSUE+l5dhNBieA==", + "license": "MIT", + "engines": { + "node": ">=6" + } + }, "node_modules/mdn-data": { "version": "2.0.4", "resolved": "https://registry.npmjs.org/mdn-data/-/mdn-data-2.0.4.tgz", @@ -15994,6 +16103,12 @@ "resolved": "https://registry.npmjs.org/react-error-overlay/-/react-error-overlay-6.0.11.tgz", "integrity": "sha512-/6UZ2qgEyH2aqzYZgQPxEnz33NJ2gNsnHA2o5+o4wW9bLM/JYQitNP9xPhsXwC08hMMovfGe/8retsdDsczPRg==" }, + "node_modules/react-fast-compare": { + "version": "3.2.2", + "resolved": "https://registry.npmjs.org/react-fast-compare/-/react-fast-compare-3.2.2.tgz", + "integrity": "sha512-nsO+KSNgo1SbJqJEYRE9ERzo7YtYbou/OqjSQKxV7jcKox7+usiUVZOAC+XnDOABXggQTno0Y1CpVnuWEc1boQ==", + "license": "MIT" + }, "node_modules/react-hot-toast": { "version": "2.4.1", "resolved": "https://registry.npmjs.org/react-hot-toast/-/react-hot-toast-2.4.1.tgz", @@ -16023,6 +16138,21 @@ "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz", "integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==" }, + "node_modules/react-popper": { + "version": "2.3.0", + "resolved": "https://registry.npmjs.org/react-popper/-/react-popper-2.3.0.tgz", + "integrity": "sha512-e1hj8lL3uM+sgSR4Lxzn5h1GxBlpa4CQz0XLF8kx4MDrDRWY0Ena4c97PUeSX9i5W3UAfDP0z0FXCTQkoXUl3Q==", + "license": "MIT", + "dependencies": { + "react-fast-compare": "^3.0.1", + "warning": "^4.0.2" + }, + "peerDependencies": { + "@popperjs/core": "^2.0.0", + "react": "^16.8.0 || ^17 || ^18", + "react-dom": "^16.8.0 || ^17 || ^18" + } + }, "node_modules/react-refresh": { "version": "0.11.0", "resolved": "https://registry.npmjs.org/react-refresh/-/react-refresh-0.11.0.tgz", @@ -18443,6 +18573,15 @@ "makeerror": "1.0.12" } }, + "node_modules/warning": { + "version": "4.0.3", + "resolved": "https://registry.npmjs.org/warning/-/warning-4.0.3.tgz", + "integrity": "sha512-rpJyN222KWIvHJ/F53XSZv0Zl/accqHR8et1kpaMTD/fLCRxtV8iX8czMzY7sVZupTI3zcUTg8eycS2kNF9l6w==", + "license": "MIT", + "dependencies": { + "loose-envify": "^1.0.0" + } + }, "node_modules/watchpack": { "version": "2.4.1", "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-2.4.1.tgz", diff --git a/client/package.json b/client/package.json index 78e4ed7a..e7a76f31 100644 --- a/client/package.json +++ b/client/package.json @@ -15,6 +15,7 @@ "axios": "^1.7.3", "flowbite-react": "^0.10.2", "lottie-react": "^2.4.0", + "mdb-react-ui-kit": "^9.0.0", "react": "^18.3.1", "react-dom": "^18.3.1", "react-hot-toast": "^2.4.1", @@ -49,5 +50,8 @@ "last 1 firefox version", "last 1 safari version" ] + }, + "devDependencies": { + "@babel/plugin-proposal-private-property-in-object": "^7.21.11" } } diff --git a/client/src/Components/index.js b/client/src/Components/index.js deleted file mode 100644 index 2820e9f1..00000000 --- a/client/src/Components/index.js +++ /dev/null @@ -1,11 +0,0 @@ - -import Profile from "./CustomerProfile/Profile.jsx"; -import Product from "./Product.jsx" -import Footer from "./Footer/Footer.jsx" -import Navbar from "./NavBar/NavBar.jsx" -export { - Profile, - Product, - Footer, - Navbar -} \ No newline at end of file diff --git a/client/src/components/index.js b/client/src/Components/index2.js similarity index 73% rename from client/src/components/index.js rename to client/src/Components/index2.js index d6becf3e..7b0d42c8 100644 --- a/client/src/components/index.js +++ b/client/src/Components/index2.js @@ -1,6 +1,6 @@ import Header from "./Header/Header.js"; -import ProfilePage from "./Profile/ProfilePage"; -import HomePage from "./HomePage"; +import ProfilePage from "./Profile/ProfilePage.js"; +import HomePage from "./HomePage.js"; import Product from "./Product.jsx" import Footer from "./Footer/Footer.jsx" import Navbar from "./NavBar/NavBar.jsx"; diff --git a/client/src/Pages/Home.jsx b/client/src/Pages/Home.jsx index 85af771f..2b592cc5 100644 --- a/client/src/Pages/Home.jsx +++ b/client/src/Pages/Home.jsx @@ -9,7 +9,7 @@ import Newarrivals from "./Newarrivals"; import Review from "./Review"; import Trending from "../Components/Trending"; import Book from "../Components/Card/Book"; -import Review from './Review'; +import Testimonial from "./Testimonial"; const Home = () => { const [isLoading, setIsLoading] = useState(true); @@ -61,12 +61,10 @@ const Home = () => {
- - @@ -147,7 +145,6 @@ const Home = () => { -
@@ -174,6 +171,7 @@ const Home = () => { + )} diff --git a/client/src/Pages/Testimonial.jsx b/client/src/Pages/Testimonial.jsx new file mode 100644 index 00000000..6525d8df --- /dev/null +++ b/client/src/Pages/Testimonial.jsx @@ -0,0 +1,605 @@ +import React from "react"; +import "./testimonial.css"; +import { + MDBCarousel, + MDBCarouselInner, + MDBCarouselItem, + MDBCol, + MDBIcon, + MDBTypography, + MDBContainer, + MDBRow, +} from "mdb-react-ui-kit"; + +export default function Testimonial() { + return ( + + + + + + + +
+ +
+
Anna Deynah
+
UX Designer
+

+ + Lorem ipsum dolor sit amet, consectetur adipisicing elit. + Quod eos id officiis hic tenetur quae quaerat ad velit ab + hic tenetur. +

+ +
  • + +
    • +
  • + +
    • +
  • + +
    • +
  • + +
    • +
  • + +
    • +     +     + +
    + +
    +
    John Doe
    +
    Web Developer
    +

    + + Ut enim ad minima veniam, quis nostrum exercitationem ullam + corporis suscipit laboriosam, nisi ut aliquid commodi. +

    + +
  • + +
    • +
  • + +
    • +
  • + +
    • +
  • + +
    • +
  • + +
    • +     +     + +
    + +
    +
    Maria Kate
    +
    Photographer
    +

    + + At vero eos et accusamus et iusto odio dignissimos ducimus + qui blanditiis praesentium voluptatum deleniti atque + corrupti. +

    + +
  • + +
    • +
  • + +
    • +
  • + +
    • +
  • + +
    • +
  • + +
    • +     +     +     +     +     + + + + +
    + +
    +
    John Doe
    +
    UX Designer
    +

    + + Lorem ipsum dolor sit amet, consectetur adipisicing elit. + Quod eos id officiis hic tenetur quae quaerat ad velit ab + hic tenetur. +

    + +
  • + +
    • +
  • + +
    • +
  • + +
    • +
  • + +
    • +
  • + +
    • +     +     + +
    + +
    +
    Alex Rey
    +
    Web Developer
    +

    + + Ut enim ad minima veniam, quis nostrum exercitationem ullam + corporis suscipit laboriosam, nisi ut aliquid commodi. +

    + +
  • + +
    • +
  • + +
    • +
  • + +
    • +
  • + +
    • +
  • + +
    • +     +     + +
    + +
    +
    Maria Kate
    +
    Photographer
    +

    + + At vero eos et accusamus et iusto odio dignissimos ducimus + qui blanditiis praesentium voluptatum deleniti atque + corrupti. +

    + +
  • + +
    • +
  • + +
    • +
  • + +
    • +
  • + +
    • +
  • + +
    • +     +     +     +     +     + + + + +
    + +
    +
    Anna Deynah
    +
    UX Designer
    +

    + + Lorem ipsum dolor sit amet, consectetur adipisicing elit. + Quod eos id officiis hic tenetur quae quaerat ad velit ab + hic tenetur. +

    + +
  • + +
    • +
  • + +
    • +
  • + +
    • +
  • + +
    • +
  • + +
    • +     +     + +
    + +
    +
    John Doe
    +
    Web Developer
    +

    + + Ut enim ad minima veniam, quis nostrum exercitationem ullam + corporis suscipit laboriosam, nisi ut aliquid commodi. +

    + +
  • + +
    • +
  • + +
    • +
  • + +
    • +
  • + +
    • +
  • + +
    • +     +     + +
    + +
    +
    Maria Kate
    +
    Photographer
    +

    + + At vero eos et accusamus et iusto odio dignissimos ducimus + qui blanditiis praesentium voluptatum deleniti atque + corrupti. +

    + +
  • + +
    • +
  • + +
    • +
  • + +
    • +
  • + +
    • +
  • + +
    • +     +     +     +     +     +     +     +     + ); +} diff --git a/client/src/Pages/testimonial.css b/client/src/Pages/testimonial.css new file mode 100644 index 00000000..b86760e8 --- /dev/null +++ b/client/src/Pages/testimonial.css @@ -0,0 +1,21 @@ +.carousel-inner { + height: 538px; + } + + .carousel-control-prev { + height: 50px; + left: unset !important; + position: fixed !important; + top: -5px !important; + right: 50%; + color: gray !important; + } + + .carousel-control-next { + height: 50px; + right: unset !important; + position: fixed !important; + top: -5px !important; + left: 50%; + color: gray !important; + } \ No newline at end of file