fixed issue MonalikaPatnaik#1,issue MonalikaPatnaik#9

aindree-2005 · Dec 10, 2023 · 7496775 · 7496775
1 parent ec3ec36
commit 7496775
Show file tree

Hide file tree

Showing 5 changed files with 57 additions and 55 deletions.
diff --git a/client/src/App.css b/client/src/App.css
@@ -121,8 +121,8 @@ a {
   /* text-align: center; */
 }
 .button:hover {
-  background-color: #d7a9eb;
-  color: #5b1c36;
+  background-color: #232f3e;
+  color:#e645bb ;
 }
 /* Header Part */
 
@@ -536,7 +536,11 @@ footer .input-group-text {
 .auth-card{
     padding: 10px;
     background-color:#decaec;
-    width: 800px;
+    width: 600px;
+    padding-left: 100px;
+    padding-right:100px;
+    padding-top:50px;
+    padding-bottom:20px;
     margin: 30px auto;
     /* margin-top: 5px; */
     border-radius: 10px;
@@ -839,8 +843,24 @@ footer .input-group-text {
 ::-webkit-scrollbar-corner {
   background-color: #fff; /* Set the color of the scrollbar corner (if needed) */
 }
-.divname{
-  background-color: #270536;
-  border-width: 2px;
+.divname:hover{
+  background-color: #e645bb;
+  border-spacing: 5px;
   border-radius: 10px;
 }
+
+.Scroll2topBtn{
+  padding: 20px;
+  background-color:#decaec;
+  padding: 10px;
+  text-align: center;
+  position: static;
+  left: 50px;
+  bottom: 110px;
+  float: right;
+  color: #131921;
+  font-size: 20px;
+  font-weight: 400;
+
+
+}
diff --git a/client/src/components/SpecialProduct.js b/client/src/components/SpecialProduct.js
@@ -1,11 +1,19 @@
-import React, { useEffect } from "react";
+import React, { useEffect,useState } from "react";
 import ReactStars from "react-rating-stars-component";
 import { useDispatch, useSelector } from "react-redux";
 import { Link, useParams } from "react-router-dom";
 import { getShop } from "../actions/shopActions";
 import Loader from "./Loader";
 
 const SpecialProduct = () => {
+  const [showButton, setShowButton] = useState(false);
+
+  const scrollTop = () => {
+    window.scrollTo({
+      top: 10,
+      behavior: 'smooth'
+    });
+  }
   const { keyword } = useParams();
   const { location } = useParams();
   const dispatch = useDispatch();
@@ -14,6 +22,18 @@ const SpecialProduct = () => {
   useEffect(() => {
     dispatch(getShop(keyword));
   }, [dispatch]);
+  useEffect(() => {
+
+    const handleScroll = () => {
+      if (window.scrollY > 50) {
+        setShowButton(true);
+      }else {
+        setShowButton(false);
+      }
+    };
+    window.addEventListener('scroll', handleScroll);
+  return () => window.removeEventListener('scroll', handleScroll);
+  },[])
 
   return (
     <>
@@ -50,6 +70,13 @@ const SpecialProduct = () => {
               </div>
             </div>
           ))}
+          <div className="Scroll2top">
+          {showButton && (
+            <button className="Scroll2topBtn" onClick={scrollTop}>
+              Back to Top
+            </button>
+          )}
+          </div>
       </div>
     </>
   );

diff --git a/client/src/constants/top-button.jsx b/client/src/constants/top-button.jsx
diff --git a/client/src/pages/CreateItem.js b/client/src/pages/CreateItem.js
@@ -72,8 +72,8 @@ const CreateItem = () => {
       <Container class1="login-wrapper py-3 home-wrapper-2">
         <div className="row">
           <div className="col-12">
+            <h3 className=" d-flex text-align-center justify-content-center">Add Item</h3>
             <div className="auth-card">
-              <h4 className=" d-flex text-align-center justify-content-center">Add Item</h4>
               <form onSubmit={handleSubmit} className="d-flex flex-column gap-15">
                 <CustomInput
                   type="text"

diff --git a/client/src/pages/CreateStore.js b/client/src/pages/CreateStore.js
@@ -82,8 +82,9 @@ const CreateStore = () => {
       <Container class1="login-wrapper py-3 home-wrapper-2">
         <div className="row">
           <div className="col-12">
+            <h3 className=" d-flex text-align-center justify-content-center">Create store!</h3>
             <div className="auth-card">
-              <h3 className=" d-flex text-align-center justify-content-center">Create store!</h3>
+
               <form onSubmit={handleSubmit} className="d-flex flex-column gap-15">
                 <CustomInput
                   type="text"