forked from gsantner/markor
-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
View-Mode: Prism codeblock copy to clipboard button, update Mermaid a…
…nd dark mode, closes gsantner#2336 closes gsantner#2335 (gsantner#2345)
- Loading branch information
Showing
10 changed files
with
961 additions
and
331 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -262,4 +262,3 @@ | |
.adm-block.adm-warning.adm-collapsed > .adm-heading:after { | ||
color: #fcbb6a; | ||
} | ||
|
Large diffs are not rendered by default.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1 @@ | ||
Mermaid v10.9.1 |
160 changes: 160 additions & 0 deletions
160
app/thirdparty/assets/prism/plugins/copy-to-clipboard/prism-copy-to-clipboard.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,160 @@ | ||
(function () { | ||
|
||
if (typeof Prism === 'undefined' || typeof document === 'undefined') { | ||
return; | ||
} | ||
|
||
if (!Prism.plugins.toolbar) { | ||
console.warn('Copy to Clipboard plugin loaded before Toolbar plugin.'); | ||
|
||
return; | ||
} | ||
|
||
/** | ||
* When the given elements is clicked by the user, the given text will be copied to clipboard. | ||
* | ||
* @param {HTMLElement} element | ||
* @param {CopyInfo} copyInfo | ||
* | ||
* @typedef CopyInfo | ||
* @property {() => string} getText | ||
* @property {() => void} success | ||
* @property {(reason: unknown) => void} error | ||
*/ | ||
function registerClipboard(element, copyInfo) { | ||
element.addEventListener('click', function () { | ||
copyTextToClipboard(copyInfo); | ||
}); | ||
} | ||
|
||
// https://stackoverflow.com/a/30810322/7595472 | ||
|
||
/** @param {CopyInfo} copyInfo */ | ||
function fallbackCopyTextToClipboard(copyInfo) { | ||
var textArea = document.createElement('textarea'); | ||
textArea.value = copyInfo.getText(); | ||
|
||
// Avoid scrolling to bottom | ||
textArea.style.top = '0'; | ||
textArea.style.left = '0'; | ||
textArea.style.position = 'fixed'; | ||
|
||
document.body.appendChild(textArea); | ||
textArea.focus(); | ||
textArea.select(); | ||
|
||
try { | ||
var successful = document.execCommand('copy'); | ||
setTimeout(function () { | ||
if (successful) { | ||
copyInfo.success(); | ||
} else { | ||
copyInfo.error(); | ||
} | ||
}, 1); | ||
} catch (err) { | ||
setTimeout(function () { | ||
copyInfo.error(err); | ||
}, 1); | ||
} | ||
|
||
document.body.removeChild(textArea); | ||
} | ||
/** @param {CopyInfo} copyInfo */ | ||
function copyTextToClipboard(copyInfo) { | ||
if (navigator.clipboard) { | ||
navigator.clipboard.writeText(copyInfo.getText()).then(copyInfo.success, function () { | ||
// try the fallback in case `writeText` didn't work | ||
fallbackCopyTextToClipboard(copyInfo); | ||
}); | ||
} else { | ||
fallbackCopyTextToClipboard(copyInfo); | ||
} | ||
} | ||
|
||
/** | ||
* Selects the text content of the given element. | ||
* | ||
* @param {Element} element | ||
*/ | ||
function selectElementText(element) { | ||
// https://stackoverflow.com/a/20079910/7595472 | ||
window.getSelection().selectAllChildren(element); | ||
} | ||
|
||
/** | ||
* Traverses up the DOM tree to find data attributes that override the default plugin settings. | ||
* | ||
* @param {Element} startElement An element to start from. | ||
* @returns {Settings} The plugin settings. | ||
* @typedef {Record<"copy" | "copy-error" | "copy-success" | "copy-timeout", string | number>} Settings | ||
*/ | ||
function getSettings(startElement) { | ||
/** @type {Settings} */ | ||
var settings = { | ||
'copy': 'Copy', | ||
'copy-error': 'Press Ctrl+C to copy', | ||
'copy-success': 'Copied', | ||
'copy-timeout': 5000 | ||
}; | ||
|
||
var prefix = 'data-prismjs-'; | ||
for (var key in settings) { | ||
var attr = prefix + key; | ||
var element = startElement; | ||
while (element && !element.hasAttribute(attr)) { | ||
element = element.parentElement; | ||
} | ||
if (element) { | ||
settings[key] = element.getAttribute(attr); | ||
} | ||
} | ||
return settings; | ||
} | ||
|
||
Prism.plugins.toolbar.registerButton('copy-to-clipboard', function (env) { | ||
var element = env.element; | ||
|
||
var settings = getSettings(element); | ||
|
||
var linkCopy = document.createElement('button'); | ||
linkCopy.className = 'copy-to-clipboard-button'; | ||
linkCopy.setAttribute('type', 'button'); | ||
var linkSpan = document.createElement('span'); | ||
linkCopy.appendChild(linkSpan); | ||
|
||
setState('copy'); | ||
|
||
registerClipboard(linkCopy, { | ||
getText: function () { | ||
return element.textContent; | ||
}, | ||
success: function () { | ||
setState('copy-success'); | ||
|
||
resetText(); | ||
}, | ||
error: function () { | ||
setState('copy-error'); | ||
|
||
setTimeout(function () { | ||
selectElementText(element); | ||
}, 1); | ||
|
||
resetText(); | ||
} | ||
}); | ||
|
||
return linkCopy; | ||
|
||
function resetText() { | ||
setTimeout(function () { setState('copy'); }, settings['copy-timeout']); | ||
} | ||
|
||
/** @param {"copy" | "copy-error" | "copy-success"} state */ | ||
function setState(state) { | ||
linkSpan.textContent = settings[state]; | ||
linkCopy.setAttribute('data-copy-state', state); | ||
} | ||
}); | ||
}()); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
69 changes: 69 additions & 0 deletions
69
app/thirdparty/assets/prism/plugins/toolbar/prism-toolbar.css
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,69 @@ | ||
div.code-toolbar { | ||
position: relative; | ||
} | ||
|
||
div.code-toolbar > .toolbar { | ||
position: absolute; | ||
z-index: 10; | ||
top: .3em; | ||
right: .2em; | ||
transition: opacity 0.3s ease-in-out; | ||
opacity: 0; | ||
} | ||
|
||
div.code-toolbar:hover > .toolbar { | ||
opacity: 1; | ||
} | ||
|
||
/* Separate line b/c rules are thrown out if selector is invalid. */ | ||
div.code-toolbar:focus-within > .toolbar { | ||
opacity: 1; | ||
} | ||
|
||
div.code-toolbar > .toolbar > .toolbar-item { | ||
display: inline-block; | ||
} | ||
|
||
div.code-toolbar > .toolbar > .toolbar-item > a { | ||
cursor: pointer; | ||
} | ||
|
||
div.code-toolbar > .toolbar > .toolbar-item > button { | ||
background: none; | ||
border: 0; | ||
color: inherit; | ||
font: inherit; | ||
line-height: normal; | ||
overflow: visible; | ||
padding: 0; | ||
-webkit-user-select: none; /* for button */ | ||
} | ||
|
||
div.code-toolbar > .toolbar > .toolbar-item > a, | ||
div.code-toolbar > .toolbar > .toolbar-item > button, | ||
div.code-toolbar > .toolbar > .toolbar-item > span { | ||
color: #bbb; | ||
font-size: 0.8em; | ||
text-transform: none; | ||
background: #f5f2f0; | ||
background: rgba(224, 224, 224, 0.3); | ||
box-shadow: 0 2px 0 0 rgba(0,0,0,0.2); | ||
border-radius: 0.4em; | ||
display: inline-block; | ||
min-width: 75%; | ||
max-height: 1.6em; | ||
padding-left: 0.35em; | ||
padding-right: 0.35em; | ||
padding-top: 0.2em; | ||
padding-bottom: 0.4em; | ||
} | ||
|
||
div.code-toolbar > .toolbar > .toolbar-item > a:hover, | ||
div.code-toolbar > .toolbar > .toolbar-item > a:focus, | ||
div.code-toolbar > .toolbar > .toolbar-item > button:hover, | ||
div.code-toolbar > .toolbar > .toolbar-item > button:focus, | ||
div.code-toolbar > .toolbar > .toolbar-item > span:hover, | ||
/* div.code-toolbar > .toolbar > .toolbar-item > span:focus */ { | ||
color: inherit; | ||
text-decoration: none; | ||
} |
1 change: 1 addition & 0 deletions
1
app/thirdparty/assets/prism/plugins/toolbar/prism-toolbar.min.js
Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters