diff --git a/themes/movie/config.js b/themes/movie/config.js index 0bfbc7ca..5fb5046d 100644 --- a/themes/movie/config.js +++ b/themes/movie/config.js @@ -10,7 +10,6 @@ const CONFIG = { MOVIE_ARTICLE_RECOMMEND: true, // 推荐关联内容在文章底部 MOVIE_VIDEO_COMBINE: true, // 聚合视频,开启后一篇文章内的多个含caption的视频会被合并到文章开头,并展示分集按钮 - MOVIE_VIDEO_COMBINE_AUTO: true, //没有caption的视频也加入聚合,并且自动编号 MOVIE_VIDEO_COMBINE_SHOW_PAGE_FORCE: false, // 即使只有一集也显示集数切换按钮 MOVIE_POST_LIST_COVER: true // 列表显示文章封面 diff --git a/themes/movie/index.js b/themes/movie/index.js index b54e1978..35b4a13b 100644 --- a/themes/movie/index.js +++ b/themes/movie/index.js @@ -75,7 +75,7 @@ const LayoutBase = props => { 'relative mx-auto justify-center md:flex items-start py-8 px-2' }> {/* 内容 */} -
+
{ */ const LayoutPostList = props => { return ( - <> +
{siteConfig('POST_LIST_STYLE') === 'page' ? : } - +
) } @@ -155,15 +155,15 @@ const LayoutSlug = props => { const exists = document.querySelectorAll('.video-wrapper') if (exists && exists.length > 0) return - // 创建一个新的容器元素 + // 创建视频区块容器元素 const videoWrapper = document.createElement('div') videoWrapper.className = 'video-wrapper py-1 px-3 bg-gray-100 dark:bg-white dark:text-black mx-auto' - // 创建一个新的容器元素 + // 创建走马灯封装容器元素 const carouselWrapper = document.createElement('div') carouselWrapper.classList.add('notion-carousel-wrapper') - // 创建一个用于保存 figcaption 文本内容的数组 + // 创建分集按钮figcaption文本的数组 const figCaptionValues = [] // 遍历所有 .notion-asset-wrapper 元素 @@ -178,7 +178,7 @@ const LayoutSlug = props => { ) return - if (!figCaption && siteConfig('MOVIE_VIDEO_COMBINE_AUTO', false, CONFIG)) return // 如果没有子元素 figcaption,则不处理该元素 + if (!figCaption) return // 如果没有子元素 figcaption,则不处理该元素 // 获取 figcaption 的文本内容并添加到数组中 const figCaptionValue = figCaption ? figCaption?.textContent?.trim() : `P-${index}` @@ -224,14 +224,16 @@ const LayoutSlug = props => { figCaptionWrapper.appendChild(div) }) - // 将包含 figcaption 值的容器元素添加到 notion-article 的第一个子元素插入 - videoWrapper.appendChild(carouselWrapper) - // 显示分集按钮 ,caption的视频数量大于1个 - if (figCaptionValues.length > 1 || siteConfig('MOVIE_VIDEO_COMBINE_SHOW_PAGE_FORCE', false, CONFIG)) { - videoWrapper.appendChild(figCaptionWrapper) + if (carouselWrapper.children.length > 0) { + // 将包含 figcaption 值的容器元素添加到 notion-article 的第一个子元素插入 + videoWrapper.appendChild(carouselWrapper) + // 显示分集按钮 大于1集才显示 ;或者用户 要求强制显示 + if (figCaptionWrapper.children.length > 1 || siteConfig('MOVIE_VIDEO_COMBINE_SHOW_PAGE_FORCE', false, CONFIG)) { + videoWrapper.appendChild(figCaptionWrapper) + } + // 放入页面 + notionArticle.insertBefore(videoWrapper, notionArticle.firstChild) } - - notionArticle.insertBefore(videoWrapper, notionArticle.firstChild) } setTimeout(() => { @@ -268,7 +270,7 @@ const LayoutSlug = props => { return ( <> {!lock ? ( -
+
{/* 标题 */} {/* 页面元素 */} diff --git a/themes/movie/style.js b/themes/movie/style.js index c619b509..fbfa1dfc 100644 --- a/themes/movie/style.js +++ b/themes/movie/style.js @@ -40,6 +40,11 @@ const Style = () => { .notion-carousel-route div:hover { text-decoration: underline; } + + .notion-carousel div { + height: auto !important; + aspect-ratio: 2/1 !important; + } `} ) }