From 88f16fc75416d981c4a0c5faecc74dc0c8c96ad6 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E6=98=9F=E6=97=A5=E8=AF=AD?= Date: Sat, 17 Feb 2024 18:36:26 +0800 Subject: [PATCH] fix tianli_gpt (#392) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 更换前端为 qxchuckle/Post-Summary-AI 项目 --- _config.yml | 11 +- layout/_plugins/tianli_gpt.ejs | 30 ++- source/css/_plugins/tianli_gpt.styl | 343 ++++++++++++++++------------ 3 files changed, 229 insertions(+), 155 deletions(-) diff --git a/_config.yml b/_config.yml index 75c6228..36eacf6 100755 --- a/_config.yml +++ b/_config.yml @@ -448,15 +448,18 @@ plugins: scale: 1 # 0.1~1 # AI 摘要 - # https://github.com/zhheo/Post-Abstract-AI + # https://github.com/qxchuckle/Post-Summary-AI tianli_gpt: enable: #true - js: https://cdn1.tianli0.top/gh/zhheo/Post-Abstract-AI@0.15.2/tianli_gpt.min.js + js: https://jsd.onmicrosoft.cn/gh/qxchuckle/Post-Summary-AI@6.0/chuckle-post-ai.min.js field: post # all, post, wiki api: 5Q5mpqRK5DkwT1X9Gi5e # tianli_gpt key - limit: 1000 # 设置提交的字数限制，默认为1000字，上限为5000，超过5000字符将被截断，不能为空 + limit: 1000 # 设置提交的字数限制，默认为1000字，上限为5000，超过5000字符将被截断 typingAnimate: true # 打字机动画 - + direct: true # 是否直接显示摘要，否则显示 AI 简介 + recommend: all # all, web # 文章推荐方式，all：匹配数据库内所有文章进行推荐，web：仅当前站内的文章，默认all + shuttle: true # 是否隐藏矩阵穿梭 + # Katex - The fastest math typesetting library for the web # https://katex.org/docs/autorender.html # https://github.com/KaTeX/KaTeX diff --git a/layout/_plugins/tianli_gpt.ejs b/layout/_plugins/tianli_gpt.ejs index b3a7d97..176f433 100644 --- a/layout/_plugins/tianli_gpt.ejs +++ b/layout/_plugins/tianli_gpt.ejs @@ -1,9 +1,23 @@ <% if (['all', page.layout].includes(theme.plugins.tianli_gpt.field)) { %> - - -<% } %> + + + <% } %> + \ No newline at end of file diff --git a/source/css/_plugins/tianli_gpt.styl b/source/css/_plugins/tianli_gpt.styl index d14e64a..0aa78a2 100644 --- a/source/css/_plugins/tianli_gpt.styl +++ b/source/css/_plugins/tianli_gpt.styl @@ -1,153 +1,210 @@ -.post-TianliGPT - --heo-none: #00000000 - --heo-theme = $color-theme - --heo-main: $color-theme - --heo-snackbar-time: 5s - --heo-theme-none: #4259ef01 - --heo-background: var(--site-bg) - --heo-hovertext: var(--text-code) - --heo-secondtext: var(--text) - --heo-scrollbar: var(--block-border) - --heo-secondbg: var(--block) - --heo-card-bg: var(--block) - --heo-card-bg-none: rgba(255, 255, 255, 0) - --heo-card-border: var(--block-border) - --heo-shadow-border: 0 8px 16px -4px #2c2d300c - --style-border: 1px solid var(--heo-card-border) - --style-border-always: 1px solid var(--heo-card-border) +:root + --ai-font-color var(--text-p2) + --ai-post-bg var(--block) + --ai-content-bg var(--site-bg) + --ai-content-border 1px solid var(--block-border) + --ai-border 1px solid var(--block-border) + --ai-tag-bg var(--card) + --ai-cursor var(--text-p1) + --ai-btn-bg var(--card) + --ai-title-color var(--text-p1) + --ai-btn-color var(--text-p2) + --ai-speech-content #fff -.post-TianliGPT - background: var(--block) - border-radius: $border-card - padding: 12px - line-height: 1.3 - border: var(--style-border-always) +#post-ai.post-ai + background var(--ai-post-bg) + border-radius $border-card + padding 10px 12px 11px + line-height 1.3 + border var(--ai-border) + margin-top 10px + margin-bottom 6px + transition all 0.3s + -webkit-transition all 0.3s + -moz-transition all 0.3s + -ms-transition all 0.3s + -o-transition all 0.3s - @media screen and (max-width: 768px) - .post-TianliGPT - margin-top: 22px +#post-ai .ai-title + display flex + color var(--ai-title-color) + border-radius 8px + align-items center + padding 0 6px + position relative -.tianliGPT-title - display: flex - border-radius: 8px - align-items: center - padding: 0 12px - cursor: default - user-select: none +#post-ai .ai-title i + font-weight 800 -.tianliGPT-title-text - font-weight: bold - margin-left: 8px - line-height: 1 - -.tianliGPT-explanation - margin-top: 12px - padding: 8px 12px - background: var(--card) - border-radius: $border-card - border: var(--style-border-always) - font-size: 15px - line-height: 1.4 - display: flex +#post-ai .ai-title-text + font-weight bold + margin-left 8px + font-size 17px -.tianliGPT-suggestions - display: flex - flex-wrap: wrap +#post-ai .ai-tag + font-size 12px + background-color var(--ai-tag-bg) + color var(--ai-btn-color) + border-radius 4px + margin-left auto + line-height 1 + padding 4px 5px + border var(--ai-border) -.tianliGPT-suggestions .tianliGPT-suggestions-item - margin-top: 12px - padding: 8px 12px - background: var(--card) - border-radius: 8px 8px 8px 0 - border: var(--style-border-always) - font-size: 15px - line-height: 1.4 - display: flex - width: fit-content - margin-right: 12px - cursor: pointer - transition: 0.3s - -.tianliGPT-suggestions .tianliGPT-suggestions-item:hover - background: $color-theme - color: var(--text) +#post-ai .ai-explanation + margin-top 10px + padding 8px 12px + background var(--ai-content-bg) + border-radius $border-card + border var(--ai-content-border) + font-size 15.5px + line-height 1.4 + color var(--ai-font-color) -.blinking-cursor - background-color: var(--text-p2) - width: 10px - height: 10px - display: inline-block - border-radius: 50%; - animation: blinking-cursor 0.5s infinite - -webkit-animation: blinking-cursor 0.5s infinite - margin-left: 4px +#post-ai .ai-cursor + display inline-block + border-radius 50% + background var(--ai-cursor) + width: 12px + height: 12px + opacity 0.95 + margin-left 3px + transition all 0.3s + -webkit-transition all 0.3s + -moz-transition all 0.3s + -ms-transition all 0.3s + -o-transition all 0.3s -@keyframes blinking-cursor +#post-ai .ai-btn-box + font-size 15.5px + width 100% + display flex + flex-direction row + flex-wrap wrap + +#post-ai .ai-btn-item + padding 5px 10px + margin 10px 16px 0px 5px + width fit-content + line-height 1 + background var(--ai-btn-bg) + border var(--ai-border) + color var(--ai-btn-color) + border-radius 6px + user-select none + transition all 0.3s + -webkit-transition all 0.3s + -moz-transition all 0.3s + -ms-transition all 0.3s + -o-transition all 0.3s + cursor pointer + +#post-ai .ai-btn-item:hover + background var(--theme-link) + +#post-ai .ai-recommend + display flex + flex-direction row + flex-wrap wrap + +#post-ai .ai-recommend-item + width 50% + margin-top 2px + +#post-ai .ai-recommend-item a + border-bottom 2px solid var(--theme-link) + padding 0 .2em + color var(--theme-link) + font-weight 700 + text-decoration none + transition all 0.3s + -webkit-transition all 0.3s + -moz-transition all 0.3s + -ms-transition all 0.3s + -o-transition all 0.3s + +#post-ai .ai-recommend-item a:hover + background-color var(--theme-link) + border-bottom 2px solid var(--theme-link) + color #fff + border-radius 5px + +@media screen and (max-width: 768px) + #post-ai .ai-btn-box + justify-content center + +#post-ai .ai-title>svg + width 21px + height 21px + +#post-ai .ai-title>svg path + fill var(--ai-font-color) + +#post-ai .ai-Toggle + font-size 12px + border var(--ai-border) + background var(--ai-btn-bg) + color var(--ai-btn-color) + padding 3px 4px + border-radius 4px + margin-left 6px + cursor pointer + -webkit-transition .3s + -moz-transition .3s + -o-transition .3s + -ms-transition .3s + transition .3s + font-weight bolder + pointer-events none + opacity 0 + +#post-ai .ai-Toggle:hover + background $color-theme + +#post-ai .ai-speech-box + width 21px + height 21px + background var(--ai-font-color) + margin-left 7px + border-radius 50% + display flex + flex-direction row + flex-wrap wrap + align-content center + justify-content center + pointer-events none + opacity 0 + -webkit-transition .3s + -moz-transition .3s + -o-transition .3s + -ms-transition .3s + transition .3s + cursor pointer + +#post-ai .ai-speech-content + width 8px + background var(--ai-speech-content) + height 8px + border-radius 50% + -webkit-transition .3s + -moz-transition .3s + -o-transition .3s + -ms-transition .3s + transition .3s + +#post-ai .ai-speech-box:hover .ai-speech-content + background $color-theme + +@keyframes ai_breathe 0% - opacity: 1 - - 40% - opacity: 1 - + transform scale(0.9) + -webkit-transform scale(0.9) + -moz-transform scale(0.9) + -ms-transform scale(0.9) + -o-transform scale(0.9) 50% - opacity: 0 - - 90% - opacity: 0 - - 100% - opacity: 1 - -.tianliGPT-tag - font-size: 12px - background-color: var(--text-p2) - color: var(--card) - font-weight: bold - border-radius: 4px - margin-left: auto - line-height: 1 - padding: 4px - display: flex - align-items: center - justify-content: center - cursor: pointer - transition: 0.3s - -.tianliGPT-tag:hover - background: $color-theme - color: var(--card) - -ins.adsbygoogle - margin: 16px 0 - background: var(--card) - border-radius: 12px - overflow: hidden - border: var(--style-border-always) - -#tianliGPT-Toggle - font-size: 12px - background: var(--theme-link) - color: var(--card) - padding: 4px - border-radius: 4px - margin-left: 6px - transform: scale(0.8) - cursor: pointer - transition: 0.3s - font-weight: bold - -#tianliGPT-Toggle:hover - background: var(--block-hover) - color: var(--card) - -.tianliGPT-title-icon - width: 20px - height: 20px - -.tianliGPT-title-icon svg - width: 20px - height: 20px - fill: var(--text-p2) - -.tianliGPT-title-icon svg path - fill: var(--text-p2) \ No newline at end of file + transform scale(1) + -webkit-transform scale(1) + -moz-transform scale(1) + -ms-transform scale(1) + -o-transform scale(1)