assets/main.scss

@@ -12,6 +12,9 @@ html {
 
 body {
     @apply select-none min-w-80 font-sans;
+    &.modal-opened {
+        @apply overflow-hidden;
+    }
 }
 
 .container {
@@ -210,7 +213,7 @@ a[href^="#"] {
     &-image {
         @apply max-w-full max-h-full aspect-square overflow-hidden col-span-1 pr-4;
 
-        img{
+        img {
             @apply rounded-full bg-slate-300
         }
     }
@@ -247,6 +250,10 @@ a[href^="#"] {
         }
     }
 
+    &-content {
+        @apply max-h-[66vh] overflow-auto;
+    }
+
     h2 {
         @apply px-6 text-2xl text-center;
     }

components/calcValues.vue

@@ -133,6 +133,11 @@ watch(() => form_state, changeParametres, { deep: true })
 const isModalOpen = useState('modal_open', () => false)
 const toggleModal = () => {
     isModalOpen.value = !isModalOpen.value
+    if(isModalOpen.value == true) {
+        document.body.classList.add('modal-opened')
+    } else {
+        document.body.classList.remove('modal-opened')
+    }
 }
 const goal = (target: string, params: object) => {
     const nuxtApp = useNuxtApp()

components/modal.vue

@@ -208,7 +208,7 @@ const policy = () => {
             </div>
             <template v-else-if="modal_state.show_form">
                 <h2>Оставьте контакты для связи </h2>
-                <form @submit.prevent="submit" ref="form">
+                <form @submit.prevent="submit" ref="form" class="modal-content">
                     <input type="text" placeholder="Ваше имя" v-model="modal_data.name" />
                     <input type="phone" placeholder="Ваш номер телефона" v-model="modal_data.phone"
                         @keypress="validateInput" />
@@ -229,7 +229,7 @@ const policy = () => {
             </template>
             <template v-else>
                 <h2>данные расчета</h2>
-                <div class="flex gap-4 flex-col mb-4">
+                <div class="flex gap-4 flex-col mb-4 modal-content">
                     <p>Общая длина: {{ total_length }}<br />
                         Ламелей: {{ lamelles_count }}<br />
                         Длина секции: {{ (fence_section * 1000).toFixed(0) }}<br />