diff --git a/libs/blocks/share/share.css b/libs/blocks/share/share.css index eb80bbd129..e61f51d8e5 100644 --- a/libs/blocks/share/share.css +++ b/libs/blocks/share/share.css @@ -124,10 +124,14 @@ .share.inline { margin: 0 auto; - text-align: center; + text-align: unset; padding: 8px 0 16px; } +.share.inline .tracking-header { + margin-bottom: 1em; +} + .share.inline p.icon-container { justify-content: flex-start; margin: 0; diff --git a/libs/blocks/share/share.js b/libs/blocks/share/share.js index 5badf5fafb..c8f0d39bb5 100644 --- a/libs/blocks/share/share.js +++ b/libs/blocks/share/share.js @@ -56,7 +56,6 @@ export default async function decorate(block) { 'pinterest', 'reddit', ]; - block.innerHTML = ''; const clipboardSupport = !!navigator.clipboard; if (clipboardSupport) platforms.push('clipboard'); const svgs = await getSVGsfromFile( @@ -101,8 +100,13 @@ export default async function decorate(block) { return null; } }; - if (!block.classList.contains('inline')) { - const heading = toSentenceCase(await replaceKey('share-this-page', config)); + const authoredContent = block.innerText.trim() !== ''; + if (authoredContent) { + const rows = block.querySelectorAll(':scope > div'); + rows[0].classList.add('tracking-header'); + } else if (!authoredContent && !block.classList.contains('inline')) { + const heading = toSentenceCase(await replaceKey('share-this-page', config)); + block.innerHTML = ''; block.append(createTag('p', { class: 'tracking-header' }, heading)); } const container = createTag('p', { class: 'icon-container' }); diff --git a/libs/blocks/share/share.svg b/libs/blocks/share/share.svg index 29fc982f2e..53a5ecc825 100644 --- a/libs/blocks/share/share.svg +++ b/libs/blocks/share/share.svg @@ -10,7 +10,14 @@ - + + + + +