update theme
This commit is contained in:
@@ -622,7 +622,7 @@ search:
|
||||
share:
|
||||
# Choose: sharejs / addtoany
|
||||
# Leave it empty if you don't need share
|
||||
use: sharejs
|
||||
use: web_share
|
||||
|
||||
# Share.js
|
||||
# https://github.com/overtrue/share.js
|
||||
@@ -1185,7 +1185,7 @@ inject:
|
||||
- <script src="https://cdn.jsdmirror.com/npm/aplayer/dist/APlayer.min.js"></script>
|
||||
- <script src="https://cdn.jsdmirror.com/npm/meting/dist/Meting.min.js"></script>
|
||||
- <script src="https://cdn.jsdmirror.com/gh/bishshi/welcomemessage/txmap.js"></script>
|
||||
- <script src="https://cdn.jsdmirror.com/gh/bishshi/rightmenu/rightmenu.js"></script>
|
||||
- <script src="https://cdn.jsdmirror.com/gh/bishshi/rightmenu@1.2/rightmenu.js"></script>
|
||||
- <script src="https://cdn.jsdmirror.com/gh/bishshi/sidecalendar/calendar.js"></script>
|
||||
- <script src="https://cdn.jsdmirror.com/npm/chinese-lunar@0.1.4/lib/chinese-lunar.js"></script>
|
||||
- <script src="https://cdn.jsdmirror.com/npm/instantsearch.js@4.56.0"></script>
|
||||
|
||||
@@ -6,4 +6,6 @@ if use
|
||||
when 'addtoany'
|
||||
!=partial('includes/third-party/share/addtoany', {}, {cache: true})
|
||||
when 'sharejs'
|
||||
include ./share-js.pug
|
||||
include ./share-js.pug
|
||||
when 'web_share'
|
||||
include ./web_share.pug
|
||||
53
themes/butterfly/layout/includes/third-party/share/web_share.pug
vendored
Normal file
53
themes/butterfly/layout/includes/third-party/share/web_share.pug
vendored
Normal file
@@ -0,0 +1,53 @@
|
||||
//- web_share.pug
|
||||
|
||||
style.
|
||||
#web-share-btn {
|
||||
background: var(--btn-bg);
|
||||
color: var(--btn-color);
|
||||
border: none;
|
||||
padding: 0.5rem 1rem;
|
||||
border-radius: 8px;
|
||||
cursor: pointer;
|
||||
transition: all 0.3s;
|
||||
}
|
||||
#web-share-btn:hover {
|
||||
background: var(--btn-hover-color);
|
||||
}
|
||||
|
||||
#web-share-component
|
||||
button#web-share-btn(title='分享本文')
|
||||
i.fas.fa-share-alt
|
||||
span= ' ' + _p('分享')
|
||||
|
||||
script.
|
||||
(() => {
|
||||
const setupWebShare = () => {
|
||||
const btn = document.getElementById('web-share-btn')
|
||||
if (!btn) return
|
||||
|
||||
// 点击事件处理
|
||||
btn.addEventListener('click', async () => {
|
||||
if (navigator.share) {
|
||||
try {
|
||||
await navigator.share({
|
||||
title: '!{page.title || config.title}',
|
||||
text: '!{truncate(strip_html(page.content), {length: 100})}',
|
||||
url: window.location.href
|
||||
})
|
||||
} catch (err) {
|
||||
console.log('分享取消或失败', err)
|
||||
}
|
||||
} else {
|
||||
// 降级处理:比如弹出提示或复制链接
|
||||
const shareData = window.location.href
|
||||
navigator.clipboard.writeText(shareData).then(() => {
|
||||
btf.snackbarShow('系统不支持分享,已将链接复制到剪贴板')
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
// 考虑到 Butterfly 的 Pjax 跳转,需要重新绑定
|
||||
setupWebShare()
|
||||
document.addEventListener('pjax:complete', setupWebShare)
|
||||
})()
|
||||
@@ -1,14 +1,12 @@
|
||||
[data-theme=light] {
|
||||
--fontcolor: #363636;
|
||||
--text: rgba(60, 60, 67, 0.6);
|
||||
--btn-bg: #edf0f7;
|
||||
--bg: #edf0f7;
|
||||
}
|
||||
|
||||
[data-theme=dark] {
|
||||
--fontcolor: #F7F7FA;
|
||||
--text: #a1a2b8;
|
||||
--btn-bg: #30343f;
|
||||
--bg: #30343f;
|
||||
}
|
||||
div#poem_sentence{
|
||||
@@ -42,4 +40,28 @@ div#poem_dynasty{
|
||||
background: var(-btn-bg);
|
||||
color: var(--fontcolor);
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
#card-poem{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding: 0.5rem!important;
|
||||
min-height: 130px;
|
||||
background: linear-gradient(-45deg, rgba(255, 255, 255, .7),
|
||||
rgba(255, 255, 255, .8),
|
||||
rgba(255, 255, 255, .8),
|
||||
rgba(255, 255, 255, .7))!important;
|
||||
backdrop-filter: blur(10px);
|
||||
}
|
||||
|
||||
[data-theme=dark] #card-poem{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding: 0.5rem!important;
|
||||
min-height: 130px;
|
||||
background: linear-gradient(-45deg, rgba(24, 40, 72, .7),
|
||||
rgba(35, 37, 58, .8),
|
||||
rgba(35, 37, 58, .8),
|
||||
rgba(24, 40, 72, .7))!important;
|
||||
backdrop-filter: blur(10px);
|
||||
}
|
||||
@@ -54,12 +54,17 @@
|
||||
}
|
||||
}
|
||||
|
||||
/* 重点修改:bber-talk 的磨砂玻璃背景 */
|
||||
#bber-talk {
|
||||
/* border-radius: 8px; */
|
||||
/* background: var(--card-bg); */
|
||||
/* box-shadow: none; */
|
||||
/* 统一磨砂玻璃效果 */
|
||||
background: linear-gradient(-45deg, rgba(255, 255, 255, .7), rgba(255, 255, 255, .8), rgba(255, 255, 255, .8), rgba(255, 255, 255, .7)) !important;
|
||||
backdrop-filter: blur(10px);
|
||||
-webkit-backdrop-filter: blur(10px);
|
||||
|
||||
border-radius: 12px; /* 给哔哔栏加一点圆角,更符合玻璃质感 */
|
||||
border: 1px solid rgba(255, 255, 255, 0.3); /* 增加边缘高光 */
|
||||
|
||||
box-sizing: border-box;
|
||||
/* transition: all .3s ease-in-out; */
|
||||
cursor: pointer;
|
||||
width: 100%;
|
||||
min-height: 50px;
|
||||
@@ -68,6 +73,18 @@
|
||||
align-items: center;
|
||||
overflow: hidden;
|
||||
font-weight: 700;
|
||||
transition: all .3s ease-in-out;
|
||||
}
|
||||
|
||||
/* 暗黑模式适配 */
|
||||
[data-theme=dark] #bber-talk {
|
||||
background: linear-gradient(-45deg, rgba(24, 40, 72, .7), rgba(35, 37, 58, .8), rgba(35, 37, 58, .8), rgba(24, 40, 72, .7)) !important;
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
|
||||
#bber-talk:hover {
|
||||
transform: translateY(-2px); /* 悬停微动,增加交互感 */
|
||||
box-shadow: 0 8px 20px rgba(0,0,0,0.1);
|
||||
}
|
||||
|
||||
#bber-talk,
|
||||
@@ -120,4 +137,4 @@
|
||||
text-align: center;
|
||||
margin-right: 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -23,8 +23,7 @@
|
||||
rgba(255, 255, 255, 0.0),
|
||||
rgba(255, 255, 255, 0.3),
|
||||
rgba(255, 255, 255, 0.6),
|
||||
rgba(255, 255, 255, 0.7)),
|
||||
url('/config/img/dog.jpg'); /* 鼠标悬停时显示的背景图片 */
|
||||
rgba(255, 255, 255, 0.7)); /* 鼠标悬停时显示的背景图片 */
|
||||
background-size: cover;
|
||||
background-repeat: no-repeat;
|
||||
opacity: 0.5;
|
||||
@@ -37,8 +36,7 @@
|
||||
rgba(24, 40, 72, .1),
|
||||
rgba(35, 37, 58, .3),
|
||||
rgba(35, 37, 58, .6),
|
||||
rgba(24, 40, 72, .7)),
|
||||
url('/config/img/dog.jpg'); /* 鼠标悬停时显示的背景图片 */
|
||||
rgba(24, 40, 72, .7)); /* 鼠标悬停时显示的背景图片 */
|
||||
background-size: cover;
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
@@ -150,31 +148,6 @@
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
/* 古诗词卡片 */
|
||||
#card-poem{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding: 0.5rem!important;
|
||||
min-height: 130px;
|
||||
background: linear-gradient(-45deg, rgba(255, 255, 255, .7),
|
||||
rgba(255, 255, 255, .8),
|
||||
rgba(255, 255, 255, .8),
|
||||
rgba(255, 255, 255, .7))!important;
|
||||
backdrop-filter: blur(10px);
|
||||
}
|
||||
|
||||
[data-theme=dark] #card-poem{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding: 0.5rem!important;
|
||||
min-height: 130px;
|
||||
background: linear-gradient(-45deg, rgba(24, 40, 72, .7),
|
||||
rgba(35, 37, 58, .8),
|
||||
rgba(35, 37, 58, .8),
|
||||
rgba(24, 40, 72, .7))!important;
|
||||
backdrop-filter: blur(10px);
|
||||
}
|
||||
|
||||
/*文章页面*/
|
||||
.layout>#post {
|
||||
background: linear-gradient(-45deg, rgba(255, 255, 255, .7),
|
||||
|
||||
Reference in New Issue
Block a user