biss/hexo-theme-butterfly
1
0
Fork 0
mirror of https://github.com/jerryc127/hexo-theme-butterfly.git synced 2026-04-10 21:17:07 +08:00
Code Issues Packages Projects Releases Wiki Activity

update

Browse Source
This commit is contained in:
Jerry
2026-01-15 23:28:14 +08:00
parent 2c5e8c7cbb
commit e4597deded
2 changed files with 21 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
layout/includes/third-party/math/mermaid.pug vendored
View File

@@ -61,14 +61,19 @@ script.
const serializer = new XMLSerializer() const serializer = new XMLSerializer()
const svgSource = serializer.serializeToString(clone) const svgSource = serializer.serializeToString(clone)
const blob = new Blob([svgSource], { type: 'image/svg+xml;charset=utf-8' }) const htmlSource = `<!doctype html><html><head><meta charset="utf-8" />
<style>
html, body { width: 100%; height: 100%; margin: 0; display: flex; align-items: center; justify-content: center; background: ${bg}; }
svg { max-width: 100%; max-height: 100%; height: auto; width: auto; }
</style>
</head><body>${svgSource}</body></html>`
const blob = new Blob([htmlSource], { type: 'text/html;charset=utf-8' })
const url = URL.createObjectURL(blob) const url = URL.createObjectURL(blob)
window.open(url, '_blank', 'noopener') window.open(url, '_blank', 'noopener')
setTimeout(() => URL.revokeObjectURL(url), 30000) setTimeout(() => URL.revokeObjectURL(url), 30000)
} }
const attachMermaidViewerButton = wrap => { const attachMermaidViewerButton = wrap => {
const originalSvg = wrap.__mermaidOriginalSvg
let btn = wrap.querySelector('.mermaid-open-btn') let btn = wrap.querySelector('.mermaid-open-btn')
if (!btn) { if (!btn) {
btn = document.createElement('button') btn = document.createElement('button')
@@ -83,7 +88,7 @@ script.
btn.addEventListener('click', e => { btn.addEventListener('click', e => {
e.preventDefault() e.preventDefault()
e.stopPropagation() e.stopPropagation()
const svg = originalSvg || wrap.querySelector('svg') const svg = wrap.__mermaidOriginalSvg || wrap.querySelector('svg')
if (!svg) return if (!svg) return
const initViewBox = wrap.__mermaidInitViewBox const initViewBox = wrap.__mermaidInitViewBox
if (typeof svg === 'string') { if (typeof svg === 'string') {

26
source/css/_layout/third-party.styl
View File

@@ -67,29 +67,29 @@ if hexo-config('mermaid.enable')
.mermaid-wrap .mermaid-wrap
position: relative position: relative
margin: 0 0 20px margin: 0 0 20px
text-align: center
background: var(--card-bg) background: var(--card-bg)
text-align: center
.mermaid-open-btn .mermaid-open-btn
position: absolute position: absolute
top: 8px top: 8px
right: 8px right: 8px
z-index: 2 z-index: 2
display: flex
justify-content: center
align-items: center
padding: 0
width: 34px width: 34px
height: 25px height: 25px
padding: 0
border: none border: none
border-radius: 20% border-radius: 20%
display: flex background: #D3D3D3
align-items: center box-shadow: 0 4px 10px rgba(0, 0, 0, .15)
justify-content: center color: #fff
font-size: 0 font-size: 0
line-height: 1 line-height: 1
background: #D3D3D3
color: #fff
cursor: pointer cursor: pointer
box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15) transition: background .2s ease, transform .2s ease
transition: background 0.2s ease, transform 0.2s ease
i i
font-size: 16px font-size: 16px
@@ -97,16 +97,16 @@ if hexo-config('mermaid.enable')
&:hover, &:hover,
&:focus-visible &:focus-visible
transform: translateY(-1px)
background: #C0C0C0
outline: none outline: none
background: #C0C0C0
transform: translateY(-1px)
& > svg & > svg
height: 100%
max-width: 100% max-width: 100%
height: 100%
cursor: grab cursor: grab
touch-action: none
user-select: none user-select: none
touch-action: none
&:active &:active
cursor: grabbing cursor: grabbing