Fix scroll issues on PDP for small screens

Shopify · Apr 12, 2023 · 50dd3d1 · 50dd3d1
1 parent 5faed30
commit 50dd3d1
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 1 deletion.
diff --git a/.changeset/gorgeous-seahorses-call.md b/.changeset/gorgeous-seahorses-call.md
@@ -0,0 +1,5 @@
+---
+'demo-store': minor
+---
+
+Fix scroll issues on Product Detail Page for small screens
diff --git a/templates/demo-store/app/routes/($lang).products.$productHandle.tsx b/templates/demo-store/app/routes/($lang).products.$productHandle.tsx
@@ -126,7 +126,7 @@ export default function Product() {
         <div className="grid items-start md:gap-6 lg:gap-20 md:grid-cols-2 lg:grid-cols-3">
           <ProductGallery
             media={media.nodes}
-            className="w-screen md:w-full lg:col-span-2"
+            className="w-full lg:col-span-2"
           />
           <div className="sticky md:-mb-nav md:top-nav md:-translate-y-nav md:h-screen md:pt-nav hiddenScroll md:overflow-y-scroll">
             <section className="flex flex-col w-full max-w-xl gap-8 p-6 md:mx-auto md:max-w-sm md:px-0">