diff options
author | (quasar) nebula <qznebula@protonmail.com> | 2023-04-15 20:17:01 -0300 |
---|---|---|
committer | (quasar) nebula <qznebula@protonmail.com> | 2023-04-15 20:17:01 -0300 |
commit | 0f89605c24a1d60284d4c08664ba2fcd1a8982b7 (patch) | |
tree | fd242dff8a4aef932cf785811e82a9cf57a1e700 /src/content/dependencies/generateStickyHeadingContainer.js | |
parent | 0c471738994f0cb4fd87fa53ed9f61ab50dbb82a (diff) |
content: generateStickyHeadingContainer
Diffstat (limited to 'src/content/dependencies/generateStickyHeadingContainer.js')
-rw-r--r-- | src/content/dependencies/generateStickyHeadingContainer.js | 39 |
1 files changed, 39 insertions, 0 deletions
diff --git a/src/content/dependencies/generateStickyHeadingContainer.js b/src/content/dependencies/generateStickyHeadingContainer.js new file mode 100644 index 00000000..c08ca08d --- /dev/null +++ b/src/content/dependencies/generateStickyHeadingContainer.js @@ -0,0 +1,39 @@ +export default { + extraDependencies: ['html'], + + generate({html}) { + return html.template({ + annotation: `generateStickyHeadingContainer`, + + slots: { + title: {type: 'html'}, + cover: {type: 'html'}, + }, + + content(slots) { + const hasCover = !html.isBlank(slots.cover); + + return html.tag('div', + { + class: [ + 'content-sticky-heading-container', + hasCover && 'has-cover', + ], + }, + [ + html.tag('div', {class: 'content-sticky-heading-row'}, [ + html.tag('h1', slots.title), + + hasCover && + html.tag('div', {class: 'content-sticky-heading-cover-container'}, + html.tag('div', {class: 'content-sticky-heading-cover'}, + slots.cover.slot('displayMode', 'thumbnail'))) + ]), + + html.tag('div', {class: 'content-sticky-subheading-row'}, + html.tag('h2', {class: 'content-sticky-subheading'})), + ]); + }, + }); + }, +}; |