diff --git a/blocks/article/article.js b/blocks/article/article.js index 9130299..92bdefc 100644 --- a/blocks/article/article.js +++ b/blocks/article/article.js @@ -270,6 +270,13 @@ const decorateCodeBlocks = (block) => { const decorateImages = (block) => { // Wrap images in div for (const image of block.querySelectorAll('img')) { + const pic = image.parentElement; + const parent = pic.parentElement; + // ignore both picture and img tags in tables + if (pic.tagName === 'TD' || parent.tagName === 'TD') { + return; + } + const imageWrapper = document.createElement('div'); // Use data selector to prevent franklin from automatically trying to load a block imageWrapper.setAttribute('data-class', 'image-wrapper'); diff --git a/blocks/table/table.js b/blocks/table/table.js index 9988ba3..9468b57 100644 --- a/blocks/table/table.js +++ b/blocks/table/table.js @@ -21,17 +21,26 @@ function extractColWidths(block) { /** * @param {HTMLElement} block + * @param {string} type */ -function extractColSpans(block) { +function extractColRowSpans(block, type) { const firstRow = block.querySelector('div'); const firstCol = firstRow.querySelector('div'); - if (firstCol.innerText !== 'col-spans') { + if (firstCol.innerText !== `${type}-spans`) { return []; } - const cols = firstCol.nextElementSibling.textContent.split(';').map((row) => row.split(',')); + const spans = firstCol.nextElementSibling.textContent.split(';').map((row) => row.split(',')); firstRow.remove(); - return cols; + return spans; +} + +function extractColSpans(block) { + return extractColRowSpans(block, 'col'); +} + +function extractRowSpans(block) { + return extractColRowSpans(block, 'row'); } async function sheetToDivTable(path) { @@ -75,6 +84,7 @@ async function sheetToDivTable(path) { */ export default async function decorate(block) { const headless = block.classList.contains('headless'); + const rowSpans = extractRowSpans(block); const colSpans = extractColSpans(block); const colWidths = extractColWidths(block); @@ -111,12 +121,18 @@ export default async function decorate(block) { const head = rows.shift(); if (!head) return; - const spans = colSpans.shift() || []; + const cspans = colSpans.shift() || []; + const rspans = rowSpans.shift() || []; + const cells = [...head.querySelectorAll(':scope > div')]; const thead = html` - ${cells.map((cell, i) => `${cell.innerHTML}`).join('\n')} + ${cells.map((cell, i) => { + const cspan = cspans[i] ? ` colspan="${cspans[i]}"` : ''; + const rspan = rspans[i] ? ` rowspan="${rspans[i]}"` : ''; + return `${cell.innerHTML}`; + }).join('\n')}
`.firstElementChild; @@ -129,12 +145,18 @@ export default async function decorate(block) { table.appendChild(tbody); rows.forEach((row) => { - const spans = colSpans.shift() || []; + const cspans = colSpans.shift() || []; + const rspans = rowSpans.shift() || []; + const cells = [...row.querySelectorAll(':scope > div')]; const tr = html` - ${cells.map((cell, i) => `${cell.innerHTML}`).join('\n')} + ${cells.map((cell, i) => { + const cspan = cspans[i] ? ` colspan="${cspans[i]}"` : ''; + const rspan = rspans[i] ? ` rowspan="${rspans[i]}"` : ''; + return `${cell.innerHTML}`; + }).join('\n')}
`.firstElementChild.firstElementChild; tbody.appendChild(tr); diff --git a/scripts/scripts.js b/scripts/scripts.js index af03250..eab000b 100644 --- a/scripts/scripts.js +++ b/scripts/scripts.js @@ -33,7 +33,8 @@ const SITE_REPO_OWNER = 'hlxsites'; const SITE_REPO_NAME = 'prisma-cloud-docs-website'; const DOCS_REPO_OWNER = 'hlxsites'; const DOCS_REPO_NAME = 'prisma-cloud-docs'; -const PROD_DOMAIN = 'https://docs-preview.prismacloud.io'; +const STAGE_DOMAIN = 'https://docs-preview.prismacloud.io'; +const PROD_DOMAIN = 'https://docs.prismacloud.io'; window.hlx.RUM_GENERATION = SITE_REPO_NAME; // add your RUM generation information here @@ -47,6 +48,7 @@ export const WEB_ORIGINS = { // dev: `https://main--${SITE_REPO_NAME}--${SITE_REPO_OWNER}.hlx.page`, preview: `https://main--${SITE_REPO_NAME}--${SITE_REPO_OWNER}.hlx.page`, publish: `https://main--${SITE_REPO_NAME}--${SITE_REPO_OWNER}.hlx.live`, + stage: STAGE_DOMAIN, prod: PROD_DOMAIN, }; @@ -55,6 +57,7 @@ export const DOCS_ORIGINS = { // dev: `https://main--${DOCS_REPO_NAME}--${DOCS_REPO_OWNER}.hlx.page`, preview: `https://main--${DOCS_REPO_NAME}--${DOCS_REPO_OWNER}.hlx.page`, publish: `https://main--${DOCS_REPO_NAME}--${DOCS_REPO_OWNER}.hlx.live`, + stage: STAGE_DOMAIN, prod: PROD_DOMAIN, }; @@ -68,10 +71,11 @@ export function isMobile() { function getEnv() { const { hostname } = window.location; - if (['localhost', '127.0.0.1'].includes(hostname)) return 'dev'; + if (PROD_DOMAIN.endsWith(hostname)) return 'prod'; + if (STAGE_DOMAIN.endsWith(hostname)) return 'stage'; if (hostname.endsWith('hlx.page')) return 'preview'; if (hostname.endsWith('hlx.live')) return 'publish'; - return 'prod'; + return 'dev'; } const addClasses = (element, classes) => {