Issue 960 allow accordions (#381)

* Fixed Structure breaking issue * Update blog-left-nav.js --------- Co-authored-by: Kanaksinh <[email protected]>
hlxsites · May 13, 2024 · 4cd4a5c · 4cd4a5c
1 parent 721ae4a
commit 4cd4a5c
Show file tree

Hide file tree

Showing 2 changed files with 18 additions and 5 deletions.
diff --git a/blocks/blog-left-nav/blog-left-nav.js b/blocks/blog-left-nav/blog-left-nav.js
@@ -61,21 +61,28 @@ function anchorTagSocialMediaCreation(socialMedia) {
 
 export default function decorate(block) {
   // find the article content div
-  const articleContent = document.querySelector('.article-content');
+  const articleContent = document.querySelector('.tags-container');
+  articleContent.classList.add('article-content');
   const contentDivs = articleContent.querySelectorAll(':scope > div');
 
-  const articleContentWrapper = createTag('div', { class: 'article-content-wrapper' });
+  const articleContentWrapper = createTag('div', {
+    class: 'article-content-wrapper',
+  });
   contentDivs.forEach((div) => {
     articleContentWrapper.append(div);
   });
 
-  const articleMainWrapper = createTag('div', { class: 'article-main-wrapper' });
+  const articleMainWrapper = createTag('div', {
+    class: 'article-main-wrapper',
+  });
   articleMainWrapper.append(block);
   articleMainWrapper.append(articleContentWrapper);
   articleContent.textContent = '';
   articleContent.append(articleMainWrapper);
 
-  const blogContentLink = createTag('div', { class: 'blog-content-links' });
+  const blogContentLink = createTag('div', {
+    class: 'blog-content-links',
+  });
   blogContentLink.setAttribute('id', 'blog-content-link');
   block.textContent = '';
   block.append(blogContentLink);
@@ -87,7 +94,9 @@ export default function decorate(block) {
   });
 
   const socialLinks = ['linkedin', 'twitter', 'facebook', 'share'];
-  const socialShareLinks = createTag('div', { class: 'social-share-links' });
+  const socialShareLinks = createTag('div', {
+    class: 'social-share-links',
+  });
   socialShareLinks.setAttribute('id', 'social-share-links-id');
 
   socialLinks.forEach((item) => {

diff --git a/styles/styles.css b/styles/styles.css
@@ -713,6 +713,10 @@ main .section > div:last-child {
   padding-top: var(--spacer-element-05);
 }
 
+.section.article-content .article-main-wrapper .accordion {
+  margin-right: 0;
+}
+
 .columns.row-header div > div > h2,
 .section.section-header > div:nth-child(1) > h1,
 .section.section-header > div:nth-child(1) > h2 {