From 465c665900f1522bcc38cfd869c9587ddd1eefbd Mon Sep 17 00:00:00 2001 From: "(quasar) nebula" Date: Wed, 3 Apr 2024 10:18:59 -0300 Subject: content: generatePageLayout: refactor generateSidebarHTML --- src/content/dependencies/generatePageLayout.js | 72 ++++++++++++++------------ 1 file changed, 39 insertions(+), 33 deletions(-) diff --git a/src/content/dependencies/generatePageLayout.js b/src/content/dependencies/generatePageLayout.js index 86a346b..ab1323b 100644 --- a/src/content/dependencies/generatePageLayout.js +++ b/src/content/dependencies/generatePageLayout.js @@ -417,48 +417,54 @@ export default { ]); const generateSidebarHTML = (side, id) => { - const content = slots[side + 'Content']; + const attributes = html.attributes({ + class: 'sidebar-column', + id, + }); + const topClass = slots[side + 'Class']; - const multiple = slots[side + 'Multiple']; - const stickyMode = slots[side + 'StickyMode']; - const wide = slots[side + 'Wide']; - const collapse = slots[side + 'Collapse']; - - let sidebarClasses = []; - let sidebarContent = html.blank(); - - if (!html.isBlank(content)) { - sidebarClasses = ['sidebar', topClass]; - sidebarContent = content; - } else if (multiple) { - sidebarClasses = ['sidebar-multiple', topClass]; - sidebarContent = - multiple - .filter(Boolean) - .map(box => - html.tag('div', {class: 'sidebar'}, - {[html.onlyIfContent]: true}, - {class: box.class}, - box.content)); + if (topClass) { + attributes.add('class', topClass); } - if (html.isBlank(sidebarContent)) { - return html.blank(); + if (slots[side + 'Wide']) { + attributes.add('class', 'wide'); } - return html.tag('div', {class: 'sidebar-column'}, - {id, class: sidebarClasses}, + if (!slots[side + 'Collapse']) { + attributes.add('class', 'no-hide'); + } - wide && - {class: 'wide'}, + const stickyMode = slots[side + 'StickyMode']; + if (stickyMode !== 'static') { + attributes.add('class', `sticky-${stickyMode}`); + } - !collapse && - {class: 'no-hide'}, + let content = slots[side + 'Content']; - stickyMode !== 'static' && - {class: `sticky-${stickyMode}`}, + if (html.isBlank(content)) { + if (!slots[side + 'Multiple']) { + return html.blank(); + } + + const multiple = + slots[side + 'Multiple'].filter(Boolean); + + if (empty(multiple)) { + return html.blank(); + } + + attributes.add('class', 'sidebar-multiple'); + content = + multiple.map(box => + html.tag('div', {class: 'sidebar'}, + {class: box.class}, + box.content)); + } else { + attributes.add('class', 'sidebar'); + } - sidebarContent); + return html.tag('div', attributes, content); } const sidebarLeftHTML = generateSidebarHTML('leftSidebar', 'sidebar-left'); -- cgit 1.3.0-6-gf8a5