From 96140563404dc57d272df4658422f9b37c1d203b Mon Sep 17 00:00:00 2001
From: rgravitvl <ravitvl83@gmail.com>
Date: Thu, 30 Nov 2023 19:29:02 +0530
Subject: [PATCH 01/14] create product category list

---
 blocks/product-category-list/miniCard.js      | 33 +++++++
 .../product-category-list.js                  | 96 +++++++++++++++++++
 2 files changed, 129 insertions(+)
 create mode 100644 blocks/product-category-list/miniCard.js
 create mode 100644 blocks/product-category-list/product-category-list.js

diff --git a/blocks/product-category-list/miniCard.js b/blocks/product-category-list/miniCard.js
new file mode 100644
index 000000000..f5cc6cf79
--- /dev/null
+++ b/blocks/product-category-list/miniCard.js
@@ -0,0 +1,33 @@
+import { makePublicUrl } from '../../scripts/scripts.js';
+import { createOptimizedPicture } from '../../scripts/lib-franklin.js';
+import {
+  li, a, p, div, h2,
+} from '../../scripts/dom-builder.js';
+
+export default function createCard(product, firstCard = false) {
+  const cardTitle = article.title.indexOf('| Danaher Life Sciences') > -1
+    ? article.title.split('| Danaher Life Sciences')[0]
+    : article.title.trim();
+  const cardImage = createOptimizedPicture(article.image, article.title, firstCard, [{ media: '(min-width: 1024px)', width: '320' }, { media: '(min-width: 640px)', width: '520' }, { width: '420' }]);
+  cardImage.querySelector('img').className = 'mb-2 h-48 w-full object-cover';
+
+  const cardWrapper = a(
+    { href: makePublicUrl(article.path), title: article.title },
+    cardImage,
+    h2(
+      {
+        class:
+          '!px-6 !text-lg !font-semibold !text-danahergray-900 !mb-4 !line-clamp-3 !h-20 !break-words',
+      },
+      cardTitle + '→',
+    ),
+  );
+
+  return li(
+    {
+      class:
+        'w-full flex flex-col col-span-1 relative mx-auto justify-center transform transition duration-500 border hover:scale-105 shadow-lg rounded-lg overflow-hidden bg-white max-w-xl',
+    },
+    cardWrapper,
+  );
+}
diff --git a/blocks/product-category-list/product-category-list.js b/blocks/product-category-list/product-category-list.js
new file mode 100644
index 000000000..4b7f20fa0
--- /dev/null
+++ b/blocks/product-category-list/product-category-list.js
@@ -0,0 +1,96 @@
+import ffetch from '../../scripts/ffetch.js';
+import {
+  ul, li, a, p, div, span, h4,
+} from '../../scripts/dom-builder.js';
+import { makePublicUrl, imageHelper } from '../../scripts/scripts.js';
+import { toClassName } from '../../scripts/lib-franklin.js';
+
+const getSelectionFromUrl = (field) => toClassName(new URLSearchParams(window.location.search).get(field)) || '';
+
+function createCard(product, firstCard = false) {
+  const cardWrapper = a(
+    { href: makePublicUrl(product.path), title: product.title },
+    imageHelper(product.image, product.title, firstCard),
+    h4(
+      {
+        class: '!px-7 !text-lg !font-semibold !text-danahergray-900 !line-clamp-3 !break-words !h-14',
+      },
+      product.title + '→',
+    ),
+  );
+  return li({
+    class:
+        'w-full flex flex-col col-span-1 relative mx-auto justify-center transform transition duration-500 border hover:scale-105 shadow-lg rounded-lg overflow-hidden bg-white max-w-xl',
+  }, cardWrapper);
+}
+
+const createFilters = (products, activeTag) => {
+  // collect tag filters
+  const allOpCo = products.map((item) => item.opco.replace(/,\s*/g, ',').split(','));
+  const opCos = new Set([].concat(...allOpCo));
+  opCos.delete('');
+
+  // render tag cloud
+  const newUrl = new URL(window.location);
+  newUrl.searchParams.delete('tag');
+  newUrl.searchParams.delete('page');
+  const tags = div(
+    { class: 'flex flex-wrap gap-2 mb-4' },
+    a(
+      {
+        class:
+          'text-center my-2 inline-block rounded-full px-4 py-2 font-semibold bg-d text-danaherpurple-500 bg-danaherpurple-50 hover:bg-gray-100 hover:text-gray-500',
+        href: newUrl.toString(),
+      },
+      'View All',
+    ),
+  );
+  [...opCos].sort().forEach((opco) => {
+    newUrl.searchParams.set('tag', toClassName(opco).toLowerCase());
+    const tagAnchor = a(
+      {
+        class:
+          'text-center my-2 inline-block rounded-full px-4 py-2 font-semibold bg-d hover:bg-gray-100 hover:text-gray-500',
+        href: newUrl.toString(),
+      },
+      opco,
+    );
+    if (toClassName(opco).toLowerCase() === activeTag) {
+      tagAnchor.classList.add('bg-danaherpurple-500', 'text-white');
+      tagAnchor.setAttribute('aria-current', 'tag');
+    } else {
+      tagAnchor.classList.add('text-danaherpurple-500', 'bg-danaherpurple-50');
+    }
+    tags.append(tagAnchor);
+  });
+  return tags;
+};
+
+export default async function decorate(block) {
+  block.parentElement.parentElement.classList.add('!pb-0');
+
+  let products = await ffetch('/us/en/products-index.json')
+    .filter(({ title }) => title !== '')
+    .all();
+
+  products = products.sort((item1, item2) => item1.title.localeCompare(item2.title));
+
+  const activeTagFilter = getSelectionFromUrl('tag');
+  if (activeTagFilter) {
+    filteredArticles = articles.filter(
+      (item) => toClassName(item.opcos).toLowerCase().indexOf(activeTagFilter) > -1,
+    );
+  }
+
+  const cardList = ul({
+    class:
+          'container grid max-w-7xl w-full mx-auto gap-6 grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 px-4 py-4 sm:px-0 justify-items-center mt-3 mb-3',
+  });
+
+  products.forEach((product, index) => {
+    cardList.append(createCard(product, index === 0));
+  });
+  const filterTags = createFilters(products, activeTagFilter);
+  block.textContent = '';
+  block.append(filterTags, cardList);
+}

From 7b1c785bb846594aa9b6e518f26f645270d9f899 Mon Sep 17 00:00:00 2001
From: rgravitvl <ravitvl83@gmail.com>
Date: Thu, 30 Nov 2023 23:12:18 +0530
Subject: [PATCH 02/14] updated product cards and teasers

---
 blocks/mini-teasers/mini-teasers.js           |  9 ++-
 blocks/product-category-list/filter.js        | 47 ++++++++++++
 blocks/product-category-list/miniCard.js      | 36 ++++-----
 .../product-category-list.js                  | 76 ++-----------------
 styles/styles.css                             | 49 ++++++++++++
 5 files changed, 121 insertions(+), 96 deletions(-)
 create mode 100644 blocks/product-category-list/filter.js

diff --git a/blocks/mini-teasers/mini-teasers.js b/blocks/mini-teasers/mini-teasers.js
index ddf5fdfea..b897d0600 100644
--- a/blocks/mini-teasers/mini-teasers.js
+++ b/blocks/mini-teasers/mini-teasers.js
@@ -1,10 +1,13 @@
 import { decorateModals } from '../../scripts/scripts.js';
+import {
+  div,
+} from '../../scripts/dom-builder.js';
 
 export default function decorate(block) {
-  block.parentNode.prepend(document.createElement('hr'));
+  block.parentNode.prepend(div({ class: 'border-t border-solid border-black' }));
   block.classList.add(...'grid max-w-7xl w-full mx-auto gap-6 grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 px-4 sm:px-0 my-16'.split(' '));
   [...block.children].forEach((element) => {
-    element.classList.add(...'items-start mr-20 lg:mr-40'.split(' '));
+    element.classList.add(...'items-start pl-8 lg:pl-0 mr-20 lg:mr-40'.split(' '));
     element.querySelector('img')?.classList.add('py-1');
     element.querySelector('h3')?.classList.add(...'text-lg p-0 my-1 sm:text-lg font-medium'.split(' '));
     const link = element.querySelector('a');
@@ -14,7 +17,7 @@ export default function decorate(block) {
       if (link.href.endsWith('#RequestAQuote')) link.classList.add('show-modal-btn');
     }
   });
-  block.parentNode.append(document.createElement('hr'));
+  block.parentNode.append(div({ class: 'border-t border-solid border-black' }));
   block.parentNode.classList.add('py-6');
   decorateModals(block);
 }
diff --git a/blocks/product-category-list/filter.js b/blocks/product-category-list/filter.js
new file mode 100644
index 000000000..c3b6eaf0e
--- /dev/null
+++ b/blocks/product-category-list/filter.js
@@ -0,0 +1,47 @@
+import {
+  a, div,
+} from '../../scripts/dom-builder.js';
+import { toClassName } from '../../scripts/lib-franklin.js';
+
+const createFilters = (items, activeTag) => {
+  // collect tag filters
+  const allTags = items.map((item) => item.opco.replace(/,\s*/g, ',').split(','));
+  const filterTags = new Set([].concat(...allTags));
+  filterTags.delete('');
+
+  // render tag cloud
+  const newUrl = new URL(window.location);
+  newUrl.searchParams.delete('tag');
+  newUrl.searchParams.delete('page');
+  const tags = div(
+    { class: 'flex flex-wrap gap-2 mt-10 mb-4' },
+    a(
+      {
+        class:
+            'text-center my-2 inline-block rounded-full px-4 py-1 text-sm font-bold bg-d text-danaherpurple-500 bg-danaherpurple-50 hover:bg-gray-100 hover:text-gray-500',
+        href: newUrl.toString(),
+      },
+      'View All',
+    ),
+  );
+  [...filterTags].sort().forEach((tag) => {
+    newUrl.searchParams.set('tag', toClassName(tag).toLowerCase());
+    const tagAnchor = a(
+      {
+        class:
+            'text-center my-2 inline-block rounded-full px-4 py-1 text-sm font-bold bg-d hover:bg-gray-100 hover:text-gray-500',
+        href: newUrl.toString(),
+      },
+      tag,
+    );
+    if (toClassName(tag).toLowerCase() === activeTag) {
+      tagAnchor.classList.add('bg-danaherpurple-500', 'text-white');
+      tagAnchor.setAttribute('aria-current', 'tag');
+    } else {
+      tagAnchor.classList.add('text-danaherpurple-500', 'bg-danaherpurple-50');
+    }
+    tags.append(tagAnchor);
+  });
+  return tags;
+};
+export default createFilters;
diff --git a/blocks/product-category-list/miniCard.js b/blocks/product-category-list/miniCard.js
index f5cc6cf79..51844b7b5 100644
--- a/blocks/product-category-list/miniCard.js
+++ b/blocks/product-category-list/miniCard.js
@@ -1,33 +1,23 @@
-import { makePublicUrl } from '../../scripts/scripts.js';
-import { createOptimizedPicture } from '../../scripts/lib-franklin.js';
 import {
-  li, a, p, div, h2,
+  li, a, h4,
 } from '../../scripts/dom-builder.js';
+import { makePublicUrl, imageHelper } from '../../scripts/scripts.js';
 
 export default function createCard(product, firstCard = false) {
-  const cardTitle = article.title.indexOf('| Danaher Life Sciences') > -1
-    ? article.title.split('| Danaher Life Sciences')[0]
-    : article.title.trim();
-  const cardImage = createOptimizedPicture(article.image, article.title, firstCard, [{ media: '(min-width: 1024px)', width: '320' }, { media: '(min-width: 640px)', width: '520' }, { width: '420' }]);
-  cardImage.querySelector('img').className = 'mb-2 h-48 w-full object-cover';
-
   const cardWrapper = a(
-    { href: makePublicUrl(article.path), title: article.title },
-    cardImage,
-    h2(
+    { href: makePublicUrl(product.path), title: product.title },
+    imageHelper(product.image, product.title, firstCard),
+    h4(
       {
-        class:
-          '!px-6 !text-lg !font-semibold !text-danahergray-900 !mb-4 !line-clamp-3 !h-20 !break-words',
+        class: '!text-sm !font-normal !text-danahergray-900 !line-clamp-3 !break-words !h-14',
       },
-      cardTitle + '→',
+      `${product.title}→`,
     ),
   );
-
-  return li(
-    {
-      class:
-        'w-full flex flex-col col-span-1 relative mx-auto justify-center transform transition duration-500 border hover:scale-105 shadow-lg rounded-lg overflow-hidden bg-white max-w-xl',
-    },
-    cardWrapper,
-  );
+  const card = li({
+    class:
+        'w-52 lg:w-44 h-52 flex flex-col col-span-1 relative mx-auto justify-center transform transition duration-500 border-l border-black hover:scale-105 overflow-hidden bg-white max-w-xl pl-6 pr-6 lg:pr-0',
+  }, cardWrapper);
+  card.querySelector('img').className = 'mb-2 h-24 w-full object-cover';
+  return card;
 }
diff --git a/blocks/product-category-list/product-category-list.js b/blocks/product-category-list/product-category-list.js
index 4b7f20fa0..859158912 100644
--- a/blocks/product-category-list/product-category-list.js
+++ b/blocks/product-category-list/product-category-list.js
@@ -1,90 +1,26 @@
 import ffetch from '../../scripts/ffetch.js';
-import {
-  ul, li, a, p, div, span, h4,
-} from '../../scripts/dom-builder.js';
-import { makePublicUrl, imageHelper } from '../../scripts/scripts.js';
+import { ul } from '../../scripts/dom-builder.js';
+
 import { toClassName } from '../../scripts/lib-franklin.js';
+import createFilters from './filter.js';
+import createCard from './miniCard.js';
 
 const getSelectionFromUrl = (field) => toClassName(new URLSearchParams(window.location.search).get(field)) || '';
 
-function createCard(product, firstCard = false) {
-  const cardWrapper = a(
-    { href: makePublicUrl(product.path), title: product.title },
-    imageHelper(product.image, product.title, firstCard),
-    h4(
-      {
-        class: '!px-7 !text-lg !font-semibold !text-danahergray-900 !line-clamp-3 !break-words !h-14',
-      },
-      product.title + '→',
-    ),
-  );
-  return li({
-    class:
-        'w-full flex flex-col col-span-1 relative mx-auto justify-center transform transition duration-500 border hover:scale-105 shadow-lg rounded-lg overflow-hidden bg-white max-w-xl',
-  }, cardWrapper);
-}
-
-const createFilters = (products, activeTag) => {
-  // collect tag filters
-  const allOpCo = products.map((item) => item.opco.replace(/,\s*/g, ',').split(','));
-  const opCos = new Set([].concat(...allOpCo));
-  opCos.delete('');
-
-  // render tag cloud
-  const newUrl = new URL(window.location);
-  newUrl.searchParams.delete('tag');
-  newUrl.searchParams.delete('page');
-  const tags = div(
-    { class: 'flex flex-wrap gap-2 mb-4' },
-    a(
-      {
-        class:
-          'text-center my-2 inline-block rounded-full px-4 py-2 font-semibold bg-d text-danaherpurple-500 bg-danaherpurple-50 hover:bg-gray-100 hover:text-gray-500',
-        href: newUrl.toString(),
-      },
-      'View All',
-    ),
-  );
-  [...opCos].sort().forEach((opco) => {
-    newUrl.searchParams.set('tag', toClassName(opco).toLowerCase());
-    const tagAnchor = a(
-      {
-        class:
-          'text-center my-2 inline-block rounded-full px-4 py-2 font-semibold bg-d hover:bg-gray-100 hover:text-gray-500',
-        href: newUrl.toString(),
-      },
-      opco,
-    );
-    if (toClassName(opco).toLowerCase() === activeTag) {
-      tagAnchor.classList.add('bg-danaherpurple-500', 'text-white');
-      tagAnchor.setAttribute('aria-current', 'tag');
-    } else {
-      tagAnchor.classList.add('text-danaherpurple-500', 'bg-danaherpurple-50');
-    }
-    tags.append(tagAnchor);
-  });
-  return tags;
-};
-
 export default async function decorate(block) {
   block.parentElement.parentElement.classList.add('!pb-0');
 
   let products = await ffetch('/us/en/products-index.json')
     .filter(({ title }) => title !== '')
+    .filter(({ image }) => image !== '')
     .all();
 
   products = products.sort((item1, item2) => item1.title.localeCompare(item2.title));
 
   const activeTagFilter = getSelectionFromUrl('tag');
-  if (activeTagFilter) {
-    filteredArticles = articles.filter(
-      (item) => toClassName(item.opcos).toLowerCase().indexOf(activeTagFilter) > -1,
-    );
-  }
-
   const cardList = ul({
     class:
-          'container grid max-w-7xl w-full mx-auto gap-6 grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 px-4 py-4 sm:px-0 justify-items-center mt-3 mb-3',
+          'container grid max-w-7xl w-full mx-auto gap-6 grid-cols-1 sm:grid-cols-3 lg:grid-cols-6 px-4 py-4 sm:px-0 justify-items-center mt-3 mb-3',
   });
 
   products.forEach((product, index) => {
diff --git a/styles/styles.css b/styles/styles.css
index 2baf7aed3..cf08e8c58 100644
--- a/styles/styles.css
+++ b/styles/styles.css
@@ -2423,6 +2423,10 @@ main .default-content-wrapper ul {
     margin-top: 0px;
 }
 
+.mt-10 {
+    margin-top: 2.5rem;
+}
+
 .mt-2 {
     margin-top: 0.5rem;
 }
@@ -2564,6 +2568,10 @@ main .default-content-wrapper ul {
     height: 83.333333%;
 }
 
+.h-52 {
+    height: 13rem;
+}
+
 .h-6 {
     height: 1.5rem;
 }
@@ -2649,6 +2657,10 @@ main .default-content-wrapper ul {
     width: 1.25rem;
 }
 
+.w-52 {
+    width: 13rem;
+}
+
 .w-6 {
     width: 1.5rem;
 }
@@ -3077,6 +3089,10 @@ main .default-content-wrapper ul {
     border-bottom-width: 1px;
 }
 
+.border-l {
+    border-left-width: 1px;
+}
+
 .border-t {
     border-top-width: 1px;
 }
@@ -3089,6 +3105,15 @@ main .default-content-wrapper ul {
     border-top-width: 8px;
 }
 
+.border-solid {
+    border-style: solid;
+}
+
+.border-black {
+    --tw-border-opacity: 1;
+    border-color: rgb(0 0 0 / var(--tw-border-opacity));
+}
+
 .border-danaherpurple-500 {
     --tw-border-opacity: 1;
     border-color: rgb(117 35 255 / var(--tw-border-opacity));
@@ -3443,6 +3468,10 @@ main .default-content-wrapper ul {
     padding-left: 1.25rem;
 }
 
+.pl-6 {
+    padding-left: 1.5rem;
+}
+
 .pl-8 {
     padding-left: 2rem;
 }
@@ -3459,6 +3488,10 @@ main .default-content-wrapper ul {
     padding-right: 0.75rem;
 }
 
+.pr-6 {
+    padding-right: 1.5rem;
+}
+
 .pt-0 {
     padding-top: 0px;
 }
@@ -4042,6 +4075,10 @@ main .default-content-wrapper ul {
         grid-template-columns: repeat(2, minmax(0, 1fr));
     }
 
+    .sm\:grid-cols-3 {
+        grid-template-columns: repeat(3, minmax(0, 1fr));
+    }
+
     .sm\:flex-row {
         flex-direction: row;
     }
@@ -4329,6 +4366,10 @@ main .default-content-wrapper ul {
         grid-template-columns: repeat(4, minmax(0, 1fr));
     }
 
+    .lg\:grid-cols-6 {
+        grid-template-columns: repeat(6, minmax(0, 1fr));
+    }
+
     .lg\:grid-rows-2 {
         grid-template-rows: repeat(2, minmax(0, 1fr));
     }
@@ -4378,10 +4419,18 @@ main .default-content-wrapper ul {
         padding-bottom: 0.25rem;
     }
 
+    .lg\:pl-0 {
+        padding-left: 0px;
+    }
+
     .lg\:pl-2 {
         padding-left: 0.5rem;
     }
 
+    .lg\:pr-0 {
+        padding-right: 0px;
+    }
+
     .lg\:pt-4 {
         padding-top: 1rem;
     }

From 7169dc1232b84a01ba598a65314acd0c4cef6297 Mon Sep 17 00:00:00 2001
From: rgravitvl <ravitvl83@gmail.com>
Date: Thu, 30 Nov 2023 23:37:42 +0530
Subject: [PATCH 03/14] updated the filters

---
 blocks/product-category-list/product-category-list.js | 11 +++++++++--
 1 file changed, 9 insertions(+), 2 deletions(-)

diff --git a/blocks/product-category-list/product-category-list.js b/blocks/product-category-list/product-category-list.js
index 859158912..b29480d72 100644
--- a/blocks/product-category-list/product-category-list.js
+++ b/blocks/product-category-list/product-category-list.js
@@ -13,17 +13,24 @@ export default async function decorate(block) {
   let products = await ffetch('/us/en/products-index.json')
     .filter(({ title }) => title !== '')
     .filter(({ image }) => image !== '')
+    .filter(({ opco }) => opco !== '')
     .all();
 
+  const activeTagFilter = getSelectionFromUrl('tag');
+  let filteredProducts = products;
   products = products.sort((item1, item2) => item1.title.localeCompare(item2.title));
+  if (activeTagFilter) {
+    filteredProducts = products.filter(
+      (item) => toClassName(item.opco).toLowerCase().indexOf(activeTagFilter) > -1,
+    );
+  }
 
-  const activeTagFilter = getSelectionFromUrl('tag');
   const cardList = ul({
     class:
           'container grid max-w-7xl w-full mx-auto gap-6 grid-cols-1 sm:grid-cols-3 lg:grid-cols-6 px-4 py-4 sm:px-0 justify-items-center mt-3 mb-3',
   });
 
-  products.forEach((product, index) => {
+  filteredProducts.forEach((product, index) => {
     cardList.append(createCard(product, index === 0));
   });
   const filterTags = createFilters(products, activeTagFilter);

From 51295a6d02e94cd02a25339ee7b812071ac42eb2 Mon Sep 17 00:00:00 2001
From: rgravitvl <ravitvl83@gmail.com>
Date: Thu, 30 Nov 2023 23:38:04 +0530
Subject: [PATCH 04/14] removed opco filter

---
 blocks/product-category-list/product-category-list.js | 1 -
 1 file changed, 1 deletion(-)

diff --git a/blocks/product-category-list/product-category-list.js b/blocks/product-category-list/product-category-list.js
index b29480d72..34cd2c921 100644
--- a/blocks/product-category-list/product-category-list.js
+++ b/blocks/product-category-list/product-category-list.js
@@ -13,7 +13,6 @@ export default async function decorate(block) {
   let products = await ffetch('/us/en/products-index.json')
     .filter(({ title }) => title !== '')
     .filter(({ image }) => image !== '')
-    .filter(({ opco }) => opco !== '')
     .all();
 
   const activeTagFilter = getSelectionFromUrl('tag');

From b679326827293832daeedbfb530fefd87b8fc0ed Mon Sep 17 00:00:00 2001
From: rgravitvl <ravitvl83@gmail.com>
Date: Fri, 1 Dec 2023 10:07:23 +0530
Subject: [PATCH 05/14] updated the border width

---
 blocks/mini-teasers/mini-teasers.js      |  4 ++--
 blocks/product-category-list/miniCard.js |  2 +-
 styles/styles.css                        | 12 ++++++++----
 styles/tailwind.css                      |  8 ++++++++
 4 files changed, 19 insertions(+), 7 deletions(-)

diff --git a/blocks/mini-teasers/mini-teasers.js b/blocks/mini-teasers/mini-teasers.js
index b897d0600..a996f3e25 100644
--- a/blocks/mini-teasers/mini-teasers.js
+++ b/blocks/mini-teasers/mini-teasers.js
@@ -4,7 +4,7 @@ import {
 } from '../../scripts/dom-builder.js';
 
 export default function decorate(block) {
-  block.parentNode.prepend(div({ class: 'border-t border-solid border-black' }));
+  block.parentNode.prepend(div({ class: 'border-t-0-5 border-solid border-black' }));
   block.classList.add(...'grid max-w-7xl w-full mx-auto gap-6 grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 px-4 sm:px-0 my-16'.split(' '));
   [...block.children].forEach((element) => {
     element.classList.add(...'items-start pl-8 lg:pl-0 mr-20 lg:mr-40'.split(' '));
@@ -17,7 +17,7 @@ export default function decorate(block) {
       if (link.href.endsWith('#RequestAQuote')) link.classList.add('show-modal-btn');
     }
   });
-  block.parentNode.append(div({ class: 'border-t border-solid border-black' }));
+  block.parentNode.append(div({ class: 'border-t-0-5 border-solid border-black' }));
   block.parentNode.classList.add('py-6');
   decorateModals(block);
 }
diff --git a/blocks/product-category-list/miniCard.js b/blocks/product-category-list/miniCard.js
index 51844b7b5..7e655dfdd 100644
--- a/blocks/product-category-list/miniCard.js
+++ b/blocks/product-category-list/miniCard.js
@@ -16,7 +16,7 @@ export default function createCard(product, firstCard = false) {
   );
   const card = li({
     class:
-        'w-52 lg:w-44 h-52 flex flex-col col-span-1 relative mx-auto justify-center transform transition duration-500 border-l border-black hover:scale-105 overflow-hidden bg-white max-w-xl pl-6 pr-6 lg:pr-0',
+        'w-52 lg:w-44 h-52 flex flex-col col-span-1 relative mx-auto justify-center transform transition duration-500 border-l-0-5 border-black hover:scale-105 overflow-hidden bg-white max-w-xl pl-6 pr-6 lg:pr-0',
   }, cardWrapper);
   card.querySelector('img').className = 'mb-2 h-24 w-full object-cover';
   return card;
diff --git a/styles/styles.css b/styles/styles.css
index cf08e8c58..a95bae93c 100644
--- a/styles/styles.css
+++ b/styles/styles.css
@@ -1742,6 +1742,14 @@ main .section {
     border-bottom-right-radius: 0.25rem;
 }
 
+.border-l-0-5 {
+    border-left-width: 0.5px;
+  }
+
+.border-t-0-5 {
+    border-top-width: 0.5px;
+  }
+
 /* START OF CORE STYLES */
 
 .btn-primary-purple {
@@ -3089,10 +3097,6 @@ main .default-content-wrapper ul {
     border-bottom-width: 1px;
 }
 
-.border-l {
-    border-left-width: 1px;
-}
-
 .border-t {
     border-top-width: 1px;
 }
diff --git a/styles/tailwind.css b/styles/tailwind.css
index df1dcb4e7..8a4dd7d5a 100644
--- a/styles/tailwind.css
+++ b/styles/tailwind.css
@@ -135,6 +135,14 @@
     @apply rounded-tr rounded-br;
   }
 
+  .border-l-0-5 {
+    border-left-width: 0.5px;
+  }
+
+  .border-t-0-5 {
+    border-top-width: 0.5px;
+  }
+
   /* START OF CORE STYLES */
   .btn-primary-purple {
     @apply text-white bg-danaherpurple-500 hover:bg-danaherpurple-800 border-danaherpurple-500 hover:border-danaherpurple-800;

From 81bcb949faa88aeda826000581e441ce7fb5382f Mon Sep 17 00:00:00 2001
From: rgravitvl <ravitvl83@gmail.com>
Date: Fri, 1 Dec 2023 16:56:11 +0530
Subject: [PATCH 06/14] updated the filters

---
 blocks/columns/columns.js                             | 2 +-
 blocks/product-category-list/miniCard.js              | 5 +++--
 blocks/product-category-list/product-category-list.js | 7 +++++--
 3 files changed, 9 insertions(+), 5 deletions(-)

diff --git a/blocks/columns/columns.js b/blocks/columns/columns.js
index 16686b73c..178725a99 100644
--- a/blocks/columns/columns.js
+++ b/blocks/columns/columns.js
@@ -3,7 +3,7 @@ export default function decorate(block) {
     block.parentElement.parentElement.classList.add(...'px-0 lg:px-8 !py-4 md:!py-10'.split(' '));
   }
   if (block.parentElement.className.includes('columns-wrapper')) {
-    block.parentElement.classList.add(...'max-w-7xl w-full mx-auto bg-danaherlightblue-50'.split(' '));
+    block.parentElement.classList.add(...'max-w-7xl w-full mx-auto'.split(' '));
   }
   const cols = [...block.firstElementChild.children];
   block.classList.add(`columns-${cols.length}-cols`);
diff --git a/blocks/product-category-list/miniCard.js b/blocks/product-category-list/miniCard.js
index 7e655dfdd..cf912d9de 100644
--- a/blocks/product-category-list/miniCard.js
+++ b/blocks/product-category-list/miniCard.js
@@ -1,5 +1,5 @@
 import {
-  li, a, h4,
+  li, a, h4, span,
 } from '../../scripts/dom-builder.js';
 import { makePublicUrl, imageHelper } from '../../scripts/scripts.js';
 
@@ -11,7 +11,8 @@ export default function createCard(product, firstCard = false) {
       {
         class: '!text-sm !font-normal !text-danahergray-900 !line-clamp-3 !break-words !h-14',
       },
-      `${product.title}→`,
+      product.title,
+      span({ class: 'text-lg font-semibold text-danaherpurple-500' }, '→'),
     ),
   );
   const card = li({
diff --git a/blocks/product-category-list/product-category-list.js b/blocks/product-category-list/product-category-list.js
index 34cd2c921..46ffe9cad 100644
--- a/blocks/product-category-list/product-category-list.js
+++ b/blocks/product-category-list/product-category-list.js
@@ -11,8 +11,11 @@ export default async function decorate(block) {
   block.parentElement.parentElement.classList.add('!pb-0');
 
   let products = await ffetch('/us/en/products-index.json')
-    .filter(({ title }) => title !== '')
-    .filter(({ image }) => image !== '')
+    .filter(({ fullCategory }) => fullCategory.split('|').length === 1)
+    .filter(({ fullCategory }) => fullCategory !== '')
+    .filter(({ path }) => !path.includes('/topics'))
+    .filter(({ path }) => !path.includes('/product-coveo'))
+    .filter(({ path }) => !path.includes('/brands'))
     .all();
 
   const activeTagFilter = getSelectionFromUrl('tag');

From 9bc19dab71f89d9df2885a7f15671ae8e908247e Mon Sep 17 00:00:00 2001
From: rgravitvl <ravitvl83@gmail.com>
Date: Fri, 1 Dec 2023 16:58:43 +0530
Subject: [PATCH 07/14] updated the title height

---
 blocks/product-category-list/miniCard.js | 2 +-
 styles/styles.css                        | 4 ++++
 2 files changed, 5 insertions(+), 1 deletion(-)

diff --git a/blocks/product-category-list/miniCard.js b/blocks/product-category-list/miniCard.js
index cf912d9de..274e37975 100644
--- a/blocks/product-category-list/miniCard.js
+++ b/blocks/product-category-list/miniCard.js
@@ -9,7 +9,7 @@ export default function createCard(product, firstCard = false) {
     imageHelper(product.image, product.title, firstCard),
     h4(
       {
-        class: '!text-sm !font-normal !text-danahergray-900 !line-clamp-3 !break-words !h-14',
+        class: '!text-sm !font-normal !text-danahergray-900 !line-clamp-3 !break-words !h-16',
       },
       product.title,
       span({ class: 'text-lg font-semibold text-danaherpurple-500' }, '→'),
diff --git a/styles/styles.css b/styles/styles.css
index a95bae93c..2572d6f65 100644
--- a/styles/styles.css
+++ b/styles/styles.css
@@ -2516,6 +2516,10 @@ main .default-content-wrapper ul {
     height: 3.5rem !important;
 }
 
+.\!h-16 {
+    height: 4rem !important;
+}
+
 .\!h-20 {
     height: 5rem !important;
 }

From 3984a454febdc50bf564b89e08cb96789ff1ca90 Mon Sep 17 00:00:00 2001
From: rgravitvl <ravitvl83@gmail.com>
Date: Fri, 1 Dec 2023 17:08:16 +0530
Subject: [PATCH 08/14] removed line clamp in title

---
 blocks/product-category-list/miniCard.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/blocks/product-category-list/miniCard.js b/blocks/product-category-list/miniCard.js
index 274e37975..7eb039a58 100644
--- a/blocks/product-category-list/miniCard.js
+++ b/blocks/product-category-list/miniCard.js
@@ -9,7 +9,7 @@ export default function createCard(product, firstCard = false) {
     imageHelper(product.image, product.title, firstCard),
     h4(
       {
-        class: '!text-sm !font-normal !text-danahergray-900 !line-clamp-3 !break-words !h-16',
+        class: '!text-sm !font-normal !text-danahergray-900 !break-words !h-16',
       },
       product.title,
       span({ class: 'text-lg font-semibold text-danaherpurple-500' }, '→'),

From 1588264dc3aa33fe29eba18c8987a62b3f2bae19 Mon Sep 17 00:00:00 2001
From: rgravitvl <ravitvl83@gmail.com>
Date: Fri, 1 Dec 2023 18:09:40 +0530
Subject: [PATCH 09/14] updated opco to brand

---
 blocks/product-category-list/filter.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/blocks/product-category-list/filter.js b/blocks/product-category-list/filter.js
index c3b6eaf0e..92ec71081 100644
--- a/blocks/product-category-list/filter.js
+++ b/blocks/product-category-list/filter.js
@@ -5,7 +5,7 @@ import { toClassName } from '../../scripts/lib-franklin.js';
 
 const createFilters = (items, activeTag) => {
   // collect tag filters
-  const allTags = items.map((item) => item.opco.replace(/,\s*/g, ',').split(','));
+  const allTags = items.map((item) => item.brand.replace(/,\s*/g, ',').split(','));
   const filterTags = new Set([].concat(...allTags));
   filterTags.delete('');
 

From 3e817e2997039e5782fccce591f65f596fafe1a6 Mon Sep 17 00:00:00 2001
From: rgravitvl <ravitvl83@gmail.com>
Date: Fri, 1 Dec 2023 21:29:27 +0530
Subject: [PATCH 10/14] updated for review comments

---
 blocks/product-category-list/filter.js        |  7 ++---
 blocks/product-category-list/miniCard.js      | 24 -----------------
 .../product-category-list.js                  | 27 ++++++++++++++++---
 3 files changed, 27 insertions(+), 31 deletions(-)
 delete mode 100644 blocks/product-category-list/miniCard.js

diff --git a/blocks/product-category-list/filter.js b/blocks/product-category-list/filter.js
index 92ec71081..198e9e95f 100644
--- a/blocks/product-category-list/filter.js
+++ b/blocks/product-category-list/filter.js
@@ -3,12 +3,13 @@ import {
 } from '../../scripts/dom-builder.js';
 import { toClassName } from '../../scripts/lib-franklin.js';
 
-const createFilters = (items, activeTag) => {
+const createFilters = (items, activeTag, tagName) => {
   // collect tag filters
-  const allTags = items.map((item) => item.brand.replace(/,\s*/g, ',').split(','));
+  const allTags = items.map((item) => item[tagName].replace(/,\s*/g, ',').split(','));
   const filterTags = new Set([].concat(...allTags));
   filterTags.delete('');
-
+  filterTags.delete('Blog'); // filter out generic blog tag
+  filterTags.delete('News'); // filter out generic news tag
   // render tag cloud
   const newUrl = new URL(window.location);
   newUrl.searchParams.delete('tag');
diff --git a/blocks/product-category-list/miniCard.js b/blocks/product-category-list/miniCard.js
deleted file mode 100644
index 7eb039a58..000000000
--- a/blocks/product-category-list/miniCard.js
+++ /dev/null
@@ -1,24 +0,0 @@
-import {
-  li, a, h4, span,
-} from '../../scripts/dom-builder.js';
-import { makePublicUrl, imageHelper } from '../../scripts/scripts.js';
-
-export default function createCard(product, firstCard = false) {
-  const cardWrapper = a(
-    { href: makePublicUrl(product.path), title: product.title },
-    imageHelper(product.image, product.title, firstCard),
-    h4(
-      {
-        class: '!text-sm !font-normal !text-danahergray-900 !break-words !h-16',
-      },
-      product.title,
-      span({ class: 'text-lg font-semibold text-danaherpurple-500' }, '→'),
-    ),
-  );
-  const card = li({
-    class:
-        'w-52 lg:w-44 h-52 flex flex-col col-span-1 relative mx-auto justify-center transform transition duration-500 border-l-0-5 border-black hover:scale-105 overflow-hidden bg-white max-w-xl pl-6 pr-6 lg:pr-0',
-  }, cardWrapper);
-  card.querySelector('img').className = 'mb-2 h-24 w-full object-cover';
-  return card;
-}
diff --git a/blocks/product-category-list/product-category-list.js b/blocks/product-category-list/product-category-list.js
index 46ffe9cad..9d4fa17d4 100644
--- a/blocks/product-category-list/product-category-list.js
+++ b/blocks/product-category-list/product-category-list.js
@@ -1,12 +1,31 @@
 import ffetch from '../../scripts/ffetch.js';
-import { ul } from '../../scripts/dom-builder.js';
-
+import { ul, li, a, h4, span } from '../../scripts/dom-builder.js';
+import { makePublicUrl, imageHelper } from '../../scripts/scripts.js';
 import { toClassName } from '../../scripts/lib-franklin.js';
 import createFilters from './filter.js';
-import createCard from './miniCard.js';
 
 const getSelectionFromUrl = (field) => toClassName(new URLSearchParams(window.location.search).get(field)) || '';
 
+function createCard(product, firstCard = false) {
+  const cardWrapper = a(
+    { href: makePublicUrl(product.path), title: product.title },
+    imageHelper(product.image, product.title, firstCard),
+    h4(
+      {
+        class: '!text-sm !font-normal !text-danahergray-900 !break-words !h-16',
+      },
+      product.title,
+      span({ class: 'text-lg font-semibold text-danaherpurple-500' }, '→'),
+    ),
+  );
+  const card = li({
+    class:
+        'w-52 lg:w-44 h-52 flex flex-col col-span-1 relative mx-auto justify-center transform transition duration-500 border-l-0-5 border-black hover:scale-105 overflow-hidden bg-white max-w-xl pl-6 pr-6 lg:pr-0',
+  }, cardWrapper);
+  card.querySelector('img').className = 'mb-2 h-24 w-full object-cover';
+  return card;
+}
+
 export default async function decorate(block) {
   block.parentElement.parentElement.classList.add('!pb-0');
 
@@ -35,7 +54,7 @@ export default async function decorate(block) {
   filteredProducts.forEach((product, index) => {
     cardList.append(createCard(product, index === 0));
   });
-  const filterTags = createFilters(products, activeTagFilter);
+  const filterTags = createFilters(products, activeTagFilter, 'brand');
   block.textContent = '';
   block.append(filterTags, cardList);
 }

From 23de43576090ad523e0eeca8fe672ba261dab48c Mon Sep 17 00:00:00 2001
From: rgravitvl <ravitvl83@gmail.com>
Date: Mon, 4 Dec 2023 10:44:05 +0530
Subject: [PATCH 11/14] added a space for arrow

---
 blocks/product-category-list/product-category-list.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/blocks/product-category-list/product-category-list.js b/blocks/product-category-list/product-category-list.js
index 9d4fa17d4..dd36d1461 100644
--- a/blocks/product-category-list/product-category-list.js
+++ b/blocks/product-category-list/product-category-list.js
@@ -15,7 +15,7 @@ function createCard(product, firstCard = false) {
         class: '!text-sm !font-normal !text-danahergray-900 !break-words !h-16',
       },
       product.title,
-      span({ class: 'text-lg font-semibold text-danaherpurple-500' }, '→'),
+      span({ class: 'text-lg font-semibold text-danaherpurple-500' }, ' →'),
     ),
   );
   const card = li({

From 95c71e75e93c3928e2065535e6f3bf18903cc806 Mon Sep 17 00:00:00 2001
From: rgravitvl <ravitvl83@gmail.com>
Date: Mon, 4 Dec 2023 14:45:41 +0530
Subject: [PATCH 12/14] fixed lint issues

---
 blocks/product-category-list/product-category-list.js | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/blocks/product-category-list/product-category-list.js b/blocks/product-category-list/product-category-list.js
index dd36d1461..557428a26 100644
--- a/blocks/product-category-list/product-category-list.js
+++ b/blocks/product-category-list/product-category-list.js
@@ -1,5 +1,7 @@
 import ffetch from '../../scripts/ffetch.js';
-import { ul, li, a, h4, span } from '../../scripts/dom-builder.js';
+import {
+  ul, li, a, h4, span,
+} from '../../scripts/dom-builder.js';
 import { makePublicUrl, imageHelper } from '../../scripts/scripts.js';
 import { toClassName } from '../../scripts/lib-franklin.js';
 import createFilters from './filter.js';

From ca1aaa7f13e98da9b25c492e393246b1015fc42c Mon Sep 17 00:00:00 2001
From: rgravitvl <ravitvl83@gmail.com>
Date: Tue, 5 Dec 2023 17:38:02 +0530
Subject: [PATCH 13/14] fixed filter issue

---
 blocks/product-category-list/product-category-list.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/blocks/product-category-list/product-category-list.js b/blocks/product-category-list/product-category-list.js
index 557428a26..a1a7462ef 100644
--- a/blocks/product-category-list/product-category-list.js
+++ b/blocks/product-category-list/product-category-list.js
@@ -44,7 +44,7 @@ export default async function decorate(block) {
   products = products.sort((item1, item2) => item1.title.localeCompare(item2.title));
   if (activeTagFilter) {
     filteredProducts = products.filter(
-      (item) => toClassName(item.opco).toLowerCase().indexOf(activeTagFilter) > -1,
+      (item) => toClassName(item.brand).toLowerCase().indexOf(activeTagFilter) > -1,
     );
   }
 

From 9ffdf6e24810a90e7a71106033b0b0a1ba2355ed Mon Sep 17 00:00:00 2001
From: rgravitvl <ravitvl83@gmail.com>
Date: Tue, 5 Dec 2023 21:19:08 +0530
Subject: [PATCH 14/14] reduced the width of card

---
 blocks/product-category-list/product-category-list.js | 2 +-
 styles/styles.css                                     | 4 ++++
 2 files changed, 5 insertions(+), 1 deletion(-)

diff --git a/blocks/product-category-list/product-category-list.js b/blocks/product-category-list/product-category-list.js
index a1a7462ef..3fb798ac2 100644
--- a/blocks/product-category-list/product-category-list.js
+++ b/blocks/product-category-list/product-category-list.js
@@ -22,7 +22,7 @@ function createCard(product, firstCard = false) {
   );
   const card = li({
     class:
-        'w-52 lg:w-44 h-52 flex flex-col col-span-1 relative mx-auto justify-center transform transition duration-500 border-l-0-5 border-black hover:scale-105 overflow-hidden bg-white max-w-xl pl-6 pr-6 lg:pr-0',
+        'w-52 lg:w-40 h-52 flex flex-col col-span-1 relative mx-auto justify-center transform transition duration-500 border-l-0-5 border-black hover:scale-105 overflow-hidden bg-white max-w-xl pl-6 pr-6 lg:pr-0',
   }, cardWrapper);
   card.querySelector('img').className = 'mb-2 h-24 w-full object-cover';
   return card;
diff --git a/styles/styles.css b/styles/styles.css
index a934993a6..3087ef413 100644
--- a/styles/styles.css
+++ b/styles/styles.css
@@ -4382,6 +4382,10 @@ main .default-content-wrapper ul {
         width: 5rem;
     }
 
+    .lg\:w-40 {
+        width: 10rem;
+    }
+
     .lg\:w-44 {
         width: 11rem;
     }