Merge branch 'main' into 314-fix-search-by-numbers

cigaradvisor/blocks/table/table.css

@@ -0,0 +1,75 @@
+.table {
+  width: 100%;
+  overflow-x: auto;
+}
+
+.table table {
+  width: 100%;
+  max-width: 100%;
+  border-collapse: collapse;
+  font-size: var(--body-font-size-xs);
+}
+
+@media (width >= 600px) {
+  .table table {
+    font-size: var(--body-font-size-s);
+  }
+}
+
+@media (width >= 900px) {
+  .table table {
+    font-size: var(--body-font-size-m);
+  }
+}
+
+.table table thead tr {
+  border-top: 2px solid;
+  border-bottom: 2px solid;
+}
+
+.table table tbody tr {
+  border-bottom: 1px solid;
+}
+
+.table table th {
+  font-weight: 700;
+}
+
+.table table th,
+.table table td {
+  padding: 8px 16px;
+  text-align: left;
+}
+
+/* no header variant */
+.table.no-header table tbody tr {
+  border-top: 1px solid;
+}
+
+/* striped variant */
+.table.striped tbody tr:nth-child(odd) {
+  background-color: var(--overlay-background-color);
+}
+
+/* bordered variant */
+.table.bordered table th,
+.table.bordered table td {
+  border: 1px solid;
+}
+
+/* new styles for anchors */
+.table a {
+  text-decoration: underline;
+  color: var(--subdued-gold);
+}
+
+/* content-sized table */
+.table.contentsized {
+  display: table;
+  width: auto;
+}
+
+.table.contentsized table {
+  width: auto;
+  max-width: none;
+}

cigaradvisor/blocks/table/table.js

@@ -0,0 +1,38 @@
+/*
+ * Table Block
+ * Recreate a table
+ * https://www.hlx.live/developer/block-collection/table
+ */
+
+function buildCell(rowIndex) {
+  const cell = rowIndex
+    ? document.createElement('td')
+    : document.createElement('th');
+  if (!rowIndex) cell.setAttribute('scope', 'col');
+  return cell;
+}
+
+export default async function decorate(block) {
+  const table = document.createElement('table');
+  const thead = document.createElement('thead');
+  const tbody = document.createElement('tbody');
+
+  const header = !block.classList.contains('no-header');
+  if (header) {
+    table.append(thead);
+  }
+  table.append(tbody);
+
+  [...block.children].forEach((child, i) => {
+    const row = document.createElement('tr');
+    if (header && i === 0) thead.append(row);
+    else tbody.append(row);
+    [...child.children].forEach((col) => {
+      const cell = buildCell(header ? i : i + 1);
+      cell.innerHTML = col.innerHTML;
+      row.append(cell);
+    });
+  });
+  block.innerHTML = '';
+  block.append(table);
+}

cigaradvisor/scripts/linking-data.js

@@ -83,12 +83,60 @@ function addBlogPosts() {
   addLdJsonScript(document.querySelector('head'), ldjson);
 }
 
+/**
+ * Determines if the page contains a FAQ section and writes the LD JSON to the head
+ */
+function addFAQLdJson() {
+  const contentDivs = document.querySelectorAll('.default-content-wrapper');
+  // find the content div that contains a FAQ
+  for (let i = 0; i < contentDivs.length; i += 1) {
+    let isFAQPage = false;
+    const h2Elements = contentDivs[i].getElementsByTagName('h2');
+    // Does the div contain a faq section?
+    for (let j = 0; j < h2Elements.length; j += 1) {
+      if (h2Elements[j].id.includes('frequently-asked-questions')) {
+        isFAQPage = true;
+      }
+    }
+    if (isFAQPage) {
+      const ldjson = {
+        '@context': 'http://schema.org/',
+        '@type': 'FAQPage',
+        mainEntity: [],
+      };
+      // questions should be in the h3 elements, with the answers in the following element
+      const h3Elements = contentDivs[i].getElementsByTagName('h3');
+      for (let k = 0; k < h3Elements.length; k += 1) {
+        const QAEntity = {
+          '@type': 'Question',
+          name: h3Elements[k].textContent,
+          acceptedAnswer: {},
+        };
+        if (h3Elements[k].nextElementSibling) {
+          QAEntity.acceptedAnswer = {
+            '@type': 'Answer',
+            text: h3Elements[k].nextElementSibling.textContent,
+          };
+          // add question only if we found the answer
+          ldjson.mainEntity.push(QAEntity);
+        }
+      }
+      addLdJsonScript(document.querySelector('head'), ldjson);
+    }
+  }
+}
+
 export default function addLinkingData() {
   addOrg(document.querySelector('head'));
   if (window.location.pathname === '/cigaradvisor') {
     addBlogPosts();
-  } else if (window.location.pathname === getCategory(window.location.pathname)) {
-    addOrUpdateCollection();
-    window.addEventListener('hashchange', addOrUpdateCollection);
+  } else {
+    const category = getCategory(window.location.pathname);
+    if (window.location.pathname === category) {
+      addOrUpdateCollection();
+      window.addEventListener('hashchange', addOrUpdateCollection);
+    } else if (category) {
+      addFAQLdJson();
+    }
   }
 }