From 7a7dc0db0005ba75b20f042a23fef5b9e0b4cfb5 Mon Sep 17 00:00:00 2001
From: alsaze <veselov@alfabit.com>
Date: Thu, 9 Oct 2025 00:16:30 +0300
Subject: [PATCH] =?UTF-8?q?=D1=81=D0=BE=D0=B7=D0=B4=D0=B0=D1=8E=20=D1=82?=
 =?UTF-8?q?=D0=B5=D0=BB=D0=B5=D0=B3=D1=83=20=D1=82=D0=BE=D0=B2=D0=B0=D1=80?=
 =?UTF-8?q?=D0=BE=D0=B2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 components/ProductDescription.vue |  3 +--
 pages/product/[id].vue            | 35 ++++++-------------------------
 2 files changed, 7 insertions(+), 31 deletions(-)

diff --git a/components/ProductDescription.vue b/components/ProductDescription.vue
index d14b8f4..a1f1812 100644
--- a/components/ProductDescription.vue
+++ b/components/ProductDescription.vue
@@ -97,7 +97,6 @@ function addToCartBtn() {
 
 .product-description {
   width: 100%;
-  max-width: 335px;
   padding: 30px 30px 0;
   display: flex;
   flex-direction: column;
@@ -112,7 +111,7 @@ function addToCartBtn() {
   }
 
   @include mobile {
-    padding: 0 10px;
+    padding: 20px 30px;
   }
 
   &__sizes {
diff --git a/pages/product/[id].vue b/pages/product/[id].vue
index 6f3dbaf..d2c714a 100644
--- a/pages/product/[id].vue
+++ b/pages/product/[id].vue
@@ -30,6 +30,7 @@
       v-if="isMobile"
       v-model:open="open"
       class="product__drawer"
+      fixed
       :ui="{
         content: 'fixed bg-default ring ring-default flex focus:outline-none overflow-hidden',
         container: 'w-full flex flex-col gap-4 p-4 overflow-hidden',
@@ -37,30 +38,9 @@
       }"
     >
       <template #content>
-        <!--        <div ref="targetDrawer" class="flex flex-col gap-10" style="overflow-y: auto;"> -->
-        <!--          <h1>BABAB</h1> -->
-        <!--          <h1>BABAB</h1> -->
-        <!--          <h1>BABAB</h1> -->
-        <!--          <h1>BABAB</h1> -->
-        <!--          <h1>BABAB</h1> -->
-        <!--          <h1>BABAB</h1> -->
-        <!--          <h1>BABAB</h1> -->
-        <!--          <h1>BABAB</h1> -->
-        <!--          <h1>BABAB</h1> -->
-        <!--          <h1>BABAB</h1> -->
-        <!--          <h1>BABAB</h1> -->
-        <!--          <h1>BABAB</h1> -->
-        <!--          <h1>BABAB</h1> -->
-        <!--          <h1>BABAB</h1> -->
-        <!--          <h1>BABAB</h1> -->
-        <!--          <h1>BABAB</h1> -->
-        <!--          <h1>BABAB</h1> -->
-        <!--          <h1>BABAB</h1> -->
-        <!--          <h1>BABAB</h1> -->
-        <!--          <h1>BABAB</h1> -->
-        <!--        </div> -->
-
-        <ProductDescription ref="targetDrawer" style="overflow-y: auto;" />
+        <div ref="targetDrawer" style="overflow-y: auto;">
+          <ProductDescription />
+        </div>
       </template>
     </UDrawer>
 
@@ -91,6 +71,7 @@ const { lengthY } = useSwipe(
   {
     passive: false,
     onSwipeEnd(e: TouchEvent, direction: UseSwipeDirection) {
+      console.log('target.value', target.value)
       if (lengthY.value > 50 && targetHeight.value && (Math.abs(lengthY.value) / targetHeight.value) >= 0.25) {
         open.value = true
       }
@@ -103,11 +84,7 @@ const { lengthY: drawerLengthY } = useSwipe(
   {
     passive: false,
     onSwipeEnd(e: TouchEvent, direction: UseSwipeDirection) {
-      console.log('drawerLengthY.value', drawerLengthY.value)
-      console.log('y', y.value)
-      console.log('targetDrawerHeight.value', targetDrawerHeight.value)
-      console.log('Math.abs(drawerLengthY.value)', Math.abs(drawerLengthY.value))
-      console.log('Math.abs(drawerLengthY.value) / targetDrawerHeight.value', Math.abs(drawerLengthY.value) / targetDrawerHeight.value)
+      console.log('targetDrawer.value', targetDrawer.value)
       if (drawerLengthY.value < 0 && y.value === 0 && targetDrawerHeight.value && (Math.abs(drawerLengthY.value) / targetDrawerHeight.value) >= 0.2) {
         open.value = false
       }