From f8938c2f04a57e22f1762540140e0b66cca364f1 Mon Sep 17 00:00:00 2001 From: rofe Date: Tue, 28 Apr 2026 12:01:50 +0200 Subject: [PATCH 1/2] fix: resolve JS lint errors across blocks Co-Authored-By: Claude Opus 4.6 --- blocks/article-header/article-header.js | 14 +++++++------- blocks/featured-articles/featured-articles.js | 14 +++++++------- blocks/fluffyjaws/fluffyjaws-header.js | 7 ++++--- blocks/tags/tags.js | 6 ++---- 4 files changed, 20 insertions(+), 21 deletions(-) diff --git a/blocks/article-header/article-header.js b/blocks/article-header/article-header.js index 9297b68..ce8550a 100644 --- a/blocks/article-header/article-header.js +++ b/blocks/article-header/article-header.js @@ -97,7 +97,7 @@ function loadApplauseButtonLibrary() { const script = document.createElement('script'); script.src = 'https://unpkg.com/applause-button@latest/dist/applause-button.js'; document.head.appendChild(script); - + // Add custom style override after library loads script.onload = () => { const style = document.createElement('style'); @@ -124,7 +124,7 @@ async function buildSharing() { const sharing = document.createElement('div'); const placeholders = await fetchPlaceholders(); sharing.classList.add('article-byline-sharing'); - + // Create applause button const applauseSpan = document.createElement('span'); applauseSpan.classList.add('applause-inline-wrapper'); @@ -134,17 +134,17 @@ async function buildSharing() { applauseButton.setAttribute('multiclap', 'true'); applauseButton.setAttribute('color', '#1473E6'); applauseSpan.appendChild(applauseButton); - + // Create copy link button const copySpan = document.createElement('span'); copySpan.innerHTML = ` ${createSVG('link').outerHTML} `; - + // Assemble sharing section sharing.appendChild(applauseSpan); sharing.appendChild(copySpan); - + sharing.querySelectorAll('[data-href]').forEach((link) => { link.addEventListener('click', openPopup); }); @@ -152,10 +152,10 @@ async function buildSharing() { copyButton.addEventListener('click', () => { copyToClipboard(copyButton); }); - + // Load the applause button library loadApplauseButtonLibrary(); - + return sharing; } diff --git a/blocks/featured-articles/featured-articles.js b/blocks/featured-articles/featured-articles.js index 7f238fa..686a645 100644 --- a/blocks/featured-articles/featured-articles.js +++ b/blocks/featured-articles/featured-articles.js @@ -11,18 +11,18 @@ async function decorateFeaturedArticles(featuredArticlesEl, articlePaths, eager const tagHeader = document.querySelector('.tag-header-container > div'); - for (const articlePath of articlePaths) { - const article = await getBlogArticle(articlePath); + const articles = await Promise.all(articlePaths.map((path) => getBlogArticle(path))); + const { origin } = new URL(window.location.href); + articles.forEach((article, i) => { if (article) { const card = buildArticleCard(article, 'featured-article', eager); - card.classList.add('featured-article-card'); // Ensure the card has the correct class + card.classList.add('featured-article-card'); featuredArticlesEl.append(card); } else { - const { origin } = new URL(window.location.href); // eslint-disable-next-line no-console - console.warn(`Featured article does not exist or is missing in index: ${origin}${articlePath}`); + console.warn(`Featured article does not exist or is missing in index: ${origin}${articlePaths[i]}`); } - } + }); if (tagHeader) { tagHeader.append(featuredArticlesEl); @@ -37,4 +37,4 @@ export default async function decorate(block, blockName, document, eager) { const paths = Array.from(links).map((a) => new URL(a.href).pathname); await decorateFeaturedArticles(block, paths, eager); } -} \ No newline at end of file +} diff --git a/blocks/fluffyjaws/fluffyjaws-header.js b/blocks/fluffyjaws/fluffyjaws-header.js index 37a21fa..1c234bb 100644 --- a/blocks/fluffyjaws/fluffyjaws-header.js +++ b/blocks/fluffyjaws/fluffyjaws-header.js @@ -160,14 +160,15 @@ export default async function decorateArticleHeader(blockEl, blockName, eager) { } // author - const author = bylineContainer && bylineContainer.firstElementChild && bylineContainer.firstElementChild.firstElementChild; + const bylineInfo = bylineContainer && bylineContainer.firstElementChild; + const author = bylineInfo && bylineInfo.firstElementChild; const authorLink = author ? author.querySelector('a') : null; const authorURL = authorLink ? authorLink.href : '#'; const authorName = author ? author.textContent.trim() : 'Author'; if (author) author.classList.add('article-author'); // publication date - const date = bylineContainer && bylineContainer.firstElementChild && bylineContainer.firstElementChild.lastElementChild; + const date = bylineInfo && bylineInfo.lastElementChild; if (date) { date.classList.add('article-date'); validateDate(date); @@ -196,4 +197,4 @@ export default async function decorateArticleHeader(blockEl, blockName, eager) { featureImgContainer.prepend(featureFigEl); if (featureImgContainer.lastElementChild) featureImgContainer.lastElementChild.remove(); } -} \ No newline at end of file +} diff --git a/blocks/tags/tags.js b/blocks/tags/tags.js index 2efd80f..81df42c 100644 --- a/blocks/tags/tags.js +++ b/blocks/tags/tags.js @@ -3,10 +3,8 @@ export default function decorateTags(blockEl) { const container = blockEl.querySelector('p'); container.classList.add('tags-container'); container.textContent = ''; - const target = Array.from(tags).reduce((targets, tag) => { + Array.from(tags).forEach((tag) => { tag.classList.add('button'); container.append(tag); - targets.push(tag.textContent); - return targets; - }, []).join('; '); + }); } From 3e658bca5e34bdf70e6e8a9ce328efff924de527 Mon Sep 17 00:00:00 2001 From: rofe Date: Tue, 28 Apr 2026 12:05:12 +0200 Subject: [PATCH 2/2] fix: resolve CSS lint errors across blocks and styles Co-Authored-By: Claude Opus 4.6 --- blocks/article-feed/article-feed.css | 6 +++--- blocks/article-header/article-header.css | 6 ++++-- blocks/featured-article/featured-article.css | 4 ++-- styles/styles.css | 3 +++ 4 files changed, 12 insertions(+), 7 deletions(-) diff --git a/blocks/article-feed/article-feed.css b/blocks/article-feed/article-feed.css index a4ab848..1c9e8ca 100644 --- a/blocks/article-feed/article-feed.css +++ b/blocks/article-feed/article-feed.css @@ -448,7 +448,7 @@ main .article-feed .load-more { flex-direction: column; background: var(--color-white); border-radius: 8px; - box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08); + box-shadow: 0 2px 8px rgb(0 0 0 / 8%); overflow: hidden; transition: all 0.3s ease; text-decoration: none; @@ -456,7 +456,7 @@ main .article-feed .load-more { } .newsletter-landing main .article-card:hover { - box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15); + box-shadow: 0 4px 16px rgb(0 0 0 / 15%); transform: translateY(-4px); } @@ -500,7 +500,7 @@ main .article-feed .load-more { .newsletter-landing main .article-card-body h3 { font-size: var(--heading-font-size-s); color: var(--color-black); - margin: 0 0 12px 0; + margin: 0 0 12px; line-height: 1.4; display: -webkit-box; -webkit-line-clamp: 2; diff --git a/blocks/article-header/article-header.css b/blocks/article-header/article-header.css index f27c744..d130c73 100644 --- a/blocks/article-header/article-header.css +++ b/blocks/article-header/article-header.css @@ -215,7 +215,9 @@ main .article-byline .article-byline-sharing .applause-inline-wrapper { main .article-byline .article-byline-sharing .applause-inline-wrapper applause-button { margin: 0 !important; padding: 0 !important; - --applause-button-color: #000000; + + --applause-button-color: #000; + display: flex !important; align-items: center !important; width: auto !important; @@ -238,7 +240,7 @@ main .article-byline .article-byline-sharing .applause-inline-wrapper applause-b margin: 0 !important; font-size: 16px !important; font-weight: 600 !important; - color: #000000 !important; + color: #000 !important; line-height: 1 !important; white-space: nowrap !important; } diff --git a/blocks/featured-article/featured-article.css b/blocks/featured-article/featured-article.css index 91275e7..f9000b4 100644 --- a/blocks/featured-article/featured-article.css +++ b/blocks/featured-article/featured-article.css @@ -232,7 +232,7 @@ main .tag-header-container .featured-article-card-body p:not(:first-child) { .newsletter-landing main .featured-article-card { background-color: var(--color-white); border-radius: 8px; - box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1); + box-shadow: 0 2px 8px rgb(0 0 0 / 10%); overflow: hidden; max-width: 1200px; margin: 0 auto; @@ -241,7 +241,7 @@ main .tag-header-container .featured-article-card-body p:not(:first-child) { } .newsletter-landing main .featured-article-card:hover { - box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15); + box-shadow: 0 4px 16px rgb(0 0 0 / 15%); transform: translateY(-2px); transition: all 0.3s ease; } diff --git a/styles/styles.css b/styles/styles.css index a1fbc85..59308a8 100644 --- a/styles/styles.css +++ b/styles/styles.css @@ -594,6 +594,8 @@ main .section.carousel-container { } } +/* stylelint-disable no-descending-specificity -- theme overrides are intentionally ordered by theme */ + /* Fact-box width override */ .fact-box main, .fact-box main .section, @@ -680,3 +682,4 @@ main .section.carousel-container { margin-bottom: 64px; } +/* stylelint-enable no-descending-specificity */