151 lines
3.4 KiB
Stylus
151 lines
3.4 KiB
Stylus
// ===================
|
||
// 🌗 主题变量定义（仅使用项）
|
||
// ===================
|
||
|
||
:root
|
||
// ai_summary
|
||
--liushen-title-font-color: #0883b7
|
||
--liushen-maskbg: rgba(255, 255, 255, 0.85)
|
||
--liushen-ai-bg: conic-gradient(from 1.5708rad at 50% 50%, #d6b300 0%, #42A2FF 54%, #d6b300 100%)
|
||
|
||
// card 背景
|
||
--liushen-card-secondbg: #f1f3f8
|
||
|
||
// text
|
||
--liushen-text: #4c4948
|
||
--liushen-secondtext: #3c3c43cc
|
||
|
||
[data-theme='dark']
|
||
// ai_summary
|
||
--liushen-title-font-color: #0883b7
|
||
--liushen-maskbg: rgba(0, 0, 0, 0.85)
|
||
--liushen-ai-bg: conic-gradient(from 1.5708rad at 50% 50%, rgba(214, 178, 0, 0.46) 0%, rgba(66, 161, 255, 0.53) 54%, rgba(214, 178, 0, 0.49) 100%)
|
||
|
||
// card 背景
|
||
--liushen-card-secondbg: #3e3f41
|
||
|
||
// text
|
||
--liushen-text: #ffffffb3
|
||
--liushen-secondtext: #a1a2b8
|
||
|
||
// ===================
|
||
// 📘 AI 摘要模块样式
|
||
// ===================
|
||
|
||
if hexo-config('ai_summary.enable')
|
||
.ai-summary
|
||
background-color var(--liushen-maskbg)
|
||
background var(--liushen-card-secondbg)
|
||
border-radius 12px
|
||
padding 8px 8px 12px 8px
|
||
line-height 1.3
|
||
flex-direction column
|
||
margin-bottom 16px
|
||
display flex
|
||
gap 5px
|
||
position relative
|
||
|
||
&::before
|
||
content ''
|
||
position absolute
|
||
top 0
|
||
left 0
|
||
width 100%
|
||
height 100%
|
||
z-index 1
|
||
filter blur(8px)
|
||
opacity .4
|
||
background-image var(--liushen-ai-bg)
|
||
transform scaleX(1) scaleY(.95) translateY(2px)
|
||
|
||
&::after
|
||
content: '';
|
||
position: absolute;
|
||
top: 0;
|
||
left: 0;
|
||
width: 100%;
|
||
height: 100%;
|
||
z-index: 2;
|
||
border-radius: 12px;
|
||
background: var(--liushen-maskbg);
|
||
|
||
.ai-explanation
|
||
z-index 10
|
||
padding 8px 12px
|
||
font-size 15px
|
||
line-height 1.4
|
||
color var(--liushen-text)
|
||
text-align justify
|
||
|
||
// ✅ 打字机光标动画
|
||
&::after
|
||
content ''
|
||
display inline-block
|
||
width 8px
|
||
height 2px
|
||
margin-left 2px
|
||
background var(--liushen-text)
|
||
vertical-align bottom
|
||
animation blink-underline 1s ease-in-out infinite
|
||
transition all .3s
|
||
position relative
|
||
bottom 3px
|
||
|
||
// 平滑滚动动画
|
||
// .char
|
||
// display inline-block
|
||
// opacity 0
|
||
// animation chat-float .5s ease forwards
|
||
|
||
.ai-title
|
||
z-index 10
|
||
font-size 14px
|
||
display flex
|
||
border-radius 8px
|
||
align-items center
|
||
position relative
|
||
padding 0 12px
|
||
cursor default
|
||
user-select none
|
||
|
||
.ai-title-left
|
||
display flex
|
||
align-items center
|
||
color var(--liushen-title-font-color)
|
||
|
||
i
|
||
margin-right 3px
|
||
display flex
|
||
color var(--liushen-title-font-color)
|
||
border-radius 20px
|
||
justify-content center
|
||
align-items center
|
||
|
||
.ai-title-text
|
||
font-weight 500
|
||
|
||
.ai-tag
|
||
color var(--liushen-secondtext)
|
||
font-weight 300
|
||
margin-left auto
|
||
display flex
|
||
align-items center
|
||
justify-content center
|
||
transition .3s
|
||
|
||
// 平滑滚动动画
|
||
// @keyframes chat-float
|
||
// 0%
|
||
// opacity 0
|
||
// transform translateY(20px)
|
||
// 100%
|
||
// opacity 1
|
||
// transform translateY(0)
|
||
|
||
// ✅ 打字机光标闪烁动画
|
||
@keyframes blink-underline
|
||
0%, 100%
|
||
opacity 1
|
||
50%
|
||
opacity 0
|