isMobile Is Set For Product Page

src/views/Product/index.js

@@ -10,6 +10,7 @@ import Comment from "./Comment";
 import Rate from "./Rate";
 
 export const Product = ({
+  isMobile,
   productType,
   getInfo,
   book,
@@ -21,14 +22,25 @@ export const Product = ({
   setHeaderOptions,
 }) => {
   const [type, setType] = useState("physical");
+  const [desktopContentTransform, setDesktopContentTransform] = useState(false);
 
   useEffect(() => {
     getInfo({ id: location.getId() });
     setHeaderOptions(headerOptions);
+    if (!isMobile) {
+      window.addEventListener("scroll", () => {
+        if (window.scrollY >= 64) {
+          setDesktopContentTransform(() => true);
+        } else {
+          setDesktopContentTransform(() => false);
+        }
+      });
+    }
   }, []);
   return (
     <>
       {/* Portrait */}
+      {isMobile ? (
       <div className="w-full flex flex-col bg-transparent px-4">
         <header
           className={`w-full flex ${
@@ -161,7 +173,7 @@ export const Product = ({
             <Comment key={index} />
           ))}
         </div>
-      </div>
+      </div>) : <div>Desktop</div>}
     </>
   );
 };