From fda26bb305ba8ea0a5dedef7fc6b9ff4180e2411 Mon Sep 17 00:00:00 2001
From: shumit taher <shumitt@gmail.com>
Date: Tue, 2 Sep 2025 09:16:02 +0000
Subject: [PATCH] active column count flowing to Section

---
 src/components/LinkItems/Section.vue | 2 ++
 src/views/Home.vue                   | 6 ++++--
 2 files changed, 6 insertions(+), 2 deletions(-)

diff --git a/src/components/LinkItems/Section.vue b/src/components/LinkItems/Section.vue
index f1659ed5..e2f75a98 100644
--- a/src/components/LinkItems/Section.vue
+++ b/src/components/LinkItems/Section.vue
@@ -14,6 +14,7 @@
     :id="sectionRef"
     :ref="sectionRef"
   >
+  {{ activeColCount }}
     <!-- If no items, show message -->
     <div v-if="isEmpty" class="no-items">
       {{ $t('home.no-items-section') }}
@@ -128,6 +129,7 @@ export default {
     widgets: Array,
     index: Number,
     isWide: Boolean,
+    activeColCount: Number,
   },
   components: {
     Collapsable,
diff --git a/src/views/Home.vue b/src/views/Home.vue
index a954a121..b8d49c34 100644
--- a/src/views/Home.vue
+++ b/src/views/Home.vue
@@ -21,7 +21,6 @@
     <!-- Main content, section for each group of items -->
     <div v-if="checkTheresData(sections) || isEditMode" :class="computedClass"
     ref="sectionsContainer">
-      <span style="position: absolute;">{{readActiveColCount()}}</span>
       <template v-for="(section, index) in filteredSections">
         <Section
           :key="index"
@@ -38,6 +37,7 @@
           @change-modal-visibility="updateModalVisibility"
           :isWide="!!singleSectionView || layoutOrientation === 'horizontal'"
           :class="(searchValue && section.filteredItems.length === 0) ? 'no-results' : ''"
+          :activeColCount="activeColCount"
         />
       </template>
       <!-- Show add new section button, in edit mode -->
@@ -85,6 +85,7 @@ export default {
     layout: '',
     itemSizeBound: '',
     addNewSectionOpen: false,
+    activeColCount: 1,
   }),
   computed: {
     singleSectionView() {
@@ -179,7 +180,7 @@ export default {
       if (!sectionsContainer) return;
       const cs = getComputedStyle(sectionsContainer);
       const varVal = cs.getPropertyValue('--col-count').trim();
-      console.log(varVal);
+      this.activeColCount = varVal;
     },
   },
   mounted() {
@@ -187,6 +188,7 @@ export default {
     this.initiateMaterialDesignIcons();
     this.layout = this.layoutOrientation;
     this.itemSizeBound = this.iconSize;
+    this.readActiveColCount();
   },
 };
 </script>