From edc62aa9b07a6c97a13eddc9b88dd453bf07cf39 Mon Sep 17 00:00:00 2001
From: shumit taher <shumitt@gmail.com>
Date: Tue, 2 Sep 2025 06:44:10 +0000
Subject: [PATCH 1/5] change in conf

---
 user-data/conf.yml | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/user-data/conf.yml b/user-data/conf.yml
index 5f0b012a..b0db8125 100644
--- a/user-data/conf.yml
+++ b/user-data/conf.yml
@@ -17,6 +17,10 @@ appConfig:
 sections:
 - name: Getting Started
   icon: fas fa-rocket
+  displayData:
+    sortBy: default
+    rows: 1
+    cols: 4
   items:
   - title: Dashy Live
     description: Development a project management links for Dashy

From bd08a227db4e48e7fc6a100ab97c6155f70680c8 Mon Sep 17 00:00:00 2001
From: shumit taher <shumitt@gmail.com>
Date: Tue, 2 Sep 2025 08:33:05 +0000
Subject: [PATCH 2/5] fethcing col count dynamically

---
 src/views/Home.vue | 11 +++++++-
 user-data/conf.yml | 64 +++++++++++++++++++++++++++++-----------------
 2 files changed, 51 insertions(+), 24 deletions(-)

diff --git a/src/views/Home.vue b/src/views/Home.vue
index 004b181a..a954a121 100644
--- a/src/views/Home.vue
+++ b/src/views/Home.vue
@@ -19,7 +19,9 @@
       </router-link>
     </div>
     <!-- Main content, section for each group of items -->
-    <div v-if="checkTheresData(sections) || isEditMode" :class="computedClass">
+    <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"
@@ -172,6 +174,13 @@ export default {
       availibleThemes.Default = '#';
       return availibleThemes;
     },
+    readActiveColCount() {
+      const { sectionsContainer } = this.$refs;
+      if (!sectionsContainer) return;
+      const cs = getComputedStyle(sectionsContainer);
+      const varVal = cs.getPropertyValue('--col-count').trim();
+      console.log(varVal);
+    },
   },
   mounted() {
     this.initiateFontAwesome();
diff --git a/user-data/conf.yml b/user-data/conf.yml
index b0db8125..41ac8305 100644
--- a/user-data/conf.yml
+++ b/user-data/conf.yml
@@ -12,10 +12,37 @@ pageInfo:
 # Optional app settings and configuration
 appConfig:
   theme: colorful
+  # colCount: 4
 
 # Main content - An array of sections, each containing an array of items
 sections:
-- name: Getting Started
+- name: Section 1
+  icon: fas fa-rocket
+  displayData:
+    sortBy: default
+    rows: 1
+    cols: 1
+  items:
+  - title: Dashy Live
+    description: Development a project management links for Dashy
+    icon: https://i.ibb.co/qWWpD0v/astro-dab-128.png
+    url: https://live.dashy.to/
+    target: newtab
+  
+- name: Section 2
+  icon: fas fa-rocket
+  displayData:
+    sortBy: default
+    rows: 1
+    cols: 3
+  items:
+  - title: Dashy Live
+    description: Development a project management links for Dashy
+    icon: https://i.ibb.co/qWWpD0v/astro-dab-128.png
+    url: https://live.dashy.to/
+    target: newtab
+
+- name: Section 3
   icon: fas fa-rocket
   displayData:
     sortBy: default
@@ -27,25 +54,16 @@ sections:
     icon: https://i.ibb.co/qWWpD0v/astro-dab-128.png
     url: https://live.dashy.to/
     target: newtab
-  - title: GitHub
-    description: Source Code, Issues and Pull Requests
-    url: https://github.com/lissy93/dashy
-    icon: favicon
-  - title: Docs
-    description: Configuring & Usage Documentation
-    provider: Dashy.to
-    icon: far fa-book
-    url: https://dashy.to/docs
-  - title: Showcase
-    description: See how others are using Dashy
-    url: https://github.com/Lissy93/dashy/blob/master/docs/showcase.md
-    icon: far fa-grin-hearts
-  - title: Config Guide
-    description: See full list of configuration options
-    url: https://github.com/Lissy93/dashy/blob/master/docs/configuring.md
-    icon: fas fa-wrench
-  - title: Support
-    description: Get help with Dashy, raise a bug, or get in contact
-    url: https://github.com/Lissy93/dashy/blob/master/.github/SUPPORT.md
-    icon: far fa-hands-helping
-  
\ No newline at end of file
+
+- name: Section 4
+  icon: fas fa-rocket
+  displayData:
+    sortBy: default
+    rows: 1
+    cols: 5
+  items:
+  - title: Dashy Live
+    description: Development a project management links for Dashy
+    icon: https://i.ibb.co/qWWpD0v/astro-dab-128.png
+    url: https://live.dashy.to/
+    target: newtab
\ No newline at end of file

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 3/5] 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>

From 1f8ae2f9664a2f268db8399e8a730d5dfecf2dfa Mon Sep 17 00:00:00 2001
From: shumit taher <shumitt@gmail.com>
Date: Tue, 2 Sep 2025 09:24:38 +0000
Subject: [PATCH 4/5] passed correct column span

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

diff --git a/src/components/LinkItems/Section.vue b/src/components/LinkItems/Section.vue
index e2f75a98..335f83a7 100644
--- a/src/components/LinkItems/Section.vue
+++ b/src/components/LinkItems/Section.vue
@@ -4,7 +4,7 @@
     :icon="icon"
     :uniqueKey="groupId"
     :collapsed="displayData.collapsed"
-    :cols="displayData.cols"
+    :cols="effectiveColsSpan"
     :rows="displayData.rows"
     :color="displayData.color"
     :customStyles="displayData.customStyles"
@@ -14,7 +14,6 @@
     :id="sectionRef"
     :ref="sectionRef"
   >
-  {{ activeColCount }}
     <!-- If no items, show message -->
     <div v-if="isEmpty" class="no-items">
       {{ $t('home.no-items-section') }}
@@ -129,7 +128,7 @@ export default {
     widgets: Array,
     index: Number,
     isWide: Boolean,
-    activeColCount: Number,
+    activeColCount: String,
   },
   components: {
     Collapsable,
@@ -211,6 +210,9 @@ export default {
       }
       return styles;
     },
+    effectiveColsSpan() {
+      return Math.min(this.activeColCount, this.displayData.cols);
+    },
   },
   methods: {
     /* Opens the iframe modal */
diff --git a/src/views/Home.vue b/src/views/Home.vue
index b8d49c34..63c304b0 100644
--- a/src/views/Home.vue
+++ b/src/views/Home.vue
@@ -85,7 +85,7 @@ export default {
     layout: '',
     itemSizeBound: '',
     addNewSectionOpen: false,
-    activeColCount: 1,
+    activeColCount: '1',
   }),
   computed: {
     singleSectionView() {

From f7ab858e4bbe7d7e06b9280583cef6459c9f33d1 Mon Sep 17 00:00:00 2001
From: shumit taher <shumitt@gmail.com>
Date: Mon, 29 Sep 2025 06:12:07 +0000
Subject: [PATCH 5/5] :adhesive_bandage: fixing bug reported in issue 1927

---
 user-data/conf.yml | 68 ++++++++++++++++------------------------------
 1 file changed, 23 insertions(+), 45 deletions(-)

diff --git a/user-data/conf.yml b/user-data/conf.yml
index 41ac8305..5f0b012a 100644
--- a/user-data/conf.yml
+++ b/user-data/conf.yml
@@ -12,58 +12,36 @@ pageInfo:
 # Optional app settings and configuration
 appConfig:
   theme: colorful
-  # colCount: 4
 
 # Main content - An array of sections, each containing an array of items
 sections:
-- name: Section 1
+- name: Getting Started
   icon: fas fa-rocket
-  displayData:
-    sortBy: default
-    rows: 1
-    cols: 1
   items:
   - title: Dashy Live
     description: Development a project management links for Dashy
     icon: https://i.ibb.co/qWWpD0v/astro-dab-128.png
     url: https://live.dashy.to/
     target: newtab
-  
-- name: Section 2
-  icon: fas fa-rocket
-  displayData:
-    sortBy: default
-    rows: 1
-    cols: 3
-  items:
-  - title: Dashy Live
-    description: Development a project management links for Dashy
-    icon: https://i.ibb.co/qWWpD0v/astro-dab-128.png
-    url: https://live.dashy.to/
-    target: newtab
-
-- name: Section 3
-  icon: fas fa-rocket
-  displayData:
-    sortBy: default
-    rows: 1
-    cols: 4
-  items:
-  - title: Dashy Live
-    description: Development a project management links for Dashy
-    icon: https://i.ibb.co/qWWpD0v/astro-dab-128.png
-    url: https://live.dashy.to/
-    target: newtab
-
-- name: Section 4
-  icon: fas fa-rocket
-  displayData:
-    sortBy: default
-    rows: 1
-    cols: 5
-  items:
-  - title: Dashy Live
-    description: Development a project management links for Dashy
-    icon: https://i.ibb.co/qWWpD0v/astro-dab-128.png
-    url: https://live.dashy.to/
-    target: newtab
\ No newline at end of file
+  - title: GitHub
+    description: Source Code, Issues and Pull Requests
+    url: https://github.com/lissy93/dashy
+    icon: favicon
+  - title: Docs
+    description: Configuring & Usage Documentation
+    provider: Dashy.to
+    icon: far fa-book
+    url: https://dashy.to/docs
+  - title: Showcase
+    description: See how others are using Dashy
+    url: https://github.com/Lissy93/dashy/blob/master/docs/showcase.md
+    icon: far fa-grin-hearts
+  - title: Config Guide
+    description: See full list of configuration options
+    url: https://github.com/Lissy93/dashy/blob/master/docs/configuring.md
+    icon: fas fa-wrench
+  - title: Support
+    description: Get help with Dashy, raise a bug, or get in contact
+    url: https://github.com/Lissy93/dashy/blob/master/.github/SUPPORT.md
+    icon: far fa-hands-helping
+  
\ No newline at end of file