From 5a3316c89007a77d5cd3667d155c9c0217470db1 Mon Sep 17 00:00:00 2001
From: Yoga Pangestu <ypangestu976@gmail.com>
Date: Sun, 5 Jul 2026 15:10:22 +0700
Subject: [PATCH] refactor: enhance layout consistency in CuttingPosForm,
 CuttingPosMaterialCatalogPanel, and CuttingPosResultCatalogPanel; update grid
 structures for improved responsiveness and user experience

---
 .../js/pages/admin/manage/cuttings/form/CuttingPosForm.vue      | 2 +-
 .../manage/cuttings/form/CuttingPosMaterialCatalogPanel.vue     | 2 +-
 .../admin/manage/cuttings/form/CuttingPosResultCatalogPanel.vue | 2 +-
 3 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/resources/js/pages/admin/manage/cuttings/form/CuttingPosForm.vue b/resources/js/pages/admin/manage/cuttings/form/CuttingPosForm.vue
index 3a1018c..e6ef0bd 100644
--- a/resources/js/pages/admin/manage/cuttings/form/CuttingPosForm.vue
+++ b/resources/js/pages/admin/manage/cuttings/form/CuttingPosForm.vue
@@ -273,7 +273,7 @@ function onProductCreated(product: CuttingProductCatalogItem) {
 </script>
 
 <template>
-    <div class="grid gap-4 xl:grid-cols-[1fr_400px]">
+    <div class="grid min-w-0 gap-4 xl:grid-cols-[1fr_400px]">
         <div class="space-y-4">
             <CuttingPosMaterialCatalogPanel v-model:material-search="materialSearch"
                 :filtered-raw-materials="filteredRawMaterials" :raw-material-catalog="rawMaterialCatalogState"
diff --git a/resources/js/pages/admin/manage/cuttings/form/CuttingPosMaterialCatalogPanel.vue b/resources/js/pages/admin/manage/cuttings/form/CuttingPosMaterialCatalogPanel.vue
index 579e561..19b98ad 100644
--- a/resources/js/pages/admin/manage/cuttings/form/CuttingPosMaterialCatalogPanel.vue
+++ b/resources/js/pages/admin/manage/cuttings/form/CuttingPosMaterialCatalogPanel.vue
@@ -77,7 +77,7 @@ function openCombination(rawMaterial: CuttingRawMaterialCatalogItem, price: Cutt
                     </Empty>
                 </div>
 
-                <div v-else class="columns-1 gap-4 sm:columns-2">
+                <div v-else class="grid grid-cols-1 gap-4 sm:grid-cols-2">
                     <PosCatalogCard v-for="rawMaterial in filteredRawMaterials" :key="rawMaterial.id"
                         :title="rawMaterial.name" :cover-image="getFirstCoverImage(rawMaterial.prices)">
                         <template #header-extra>
diff --git a/resources/js/pages/admin/manage/cuttings/form/CuttingPosResultCatalogPanel.vue b/resources/js/pages/admin/manage/cuttings/form/CuttingPosResultCatalogPanel.vue
index 621a1ba..92e871d 100644
--- a/resources/js/pages/admin/manage/cuttings/form/CuttingPosResultCatalogPanel.vue
+++ b/resources/js/pages/admin/manage/cuttings/form/CuttingPosResultCatalogPanel.vue
@@ -63,7 +63,7 @@ const quickCreateOpen = ref(false);
                     </Empty>
                 </div>
 
-                <div v-else class="columns-1 gap-4 sm:columns-2">
+                <div v-else class="grid grid-cols-1 gap-4 sm:grid-cols-2">
                     <PosCatalogCard
                         v-for="product in filteredProducts"
                         :key="product.id"