github/hexo-theme-next
1
0
Fork 0
mirror of https://github.com/next-theme/hexo-theme-next.git synced 2026-01-17 18:22:33 +00:00
Code Issues Packages Projects Releases Wiki Activity

Optimize prism: support copy_button

Browse Source
This commit is contained in:
Mimi 2020-08-02 00:23:28 +08:00
parent 74ccc182f3
commit 04da779212
4 changed files with 24 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
scripts/events/lib/highlight.js
View File

@ -3,12 +3,18 @@
const fs = require('fs');
const path = require('path');
function resolve(name) {
return path.dirname(require.resolve(`${name}/package.json`));
function resolve(name, file) {
let dir;
try {
dir = path.dirname(require.resolve(`${name}/package.json`));
} catch (error) {
return '';
}
return `${dir}/${file}`;
}
function highlightTheme(name) {
const file = `${resolve('highlight.js')}/styles/${name}.css`;
const file = resolve('highlight.js', `styles/${name}.css`);
const css = fs.readFileSync(file).toString();
let rule = '';
let background = '';
@ -30,8 +36,8 @@ function highlightTheme(name) {
}
function prismTheme(name) {
let file = `${resolve('prismjs')}/themes/${name}.css`;
if (!fs.existsSync(file)) file = `${resolve('prism-themes')}/themes/${name}.css`;
let file = resolve('prismjs', `themes/${name}.css`);
if (!fs.existsSync(file)) file = resolve('prism-themes', `themes/${name}.css`);
return file;
}
@ -49,6 +55,6 @@ module.exports = hexo => {
enable: config.prismjs.enable,
light : prismTheme(theme.codeblock.prism.light),
dark : prismTheme(theme.codeblock.prism.dark),
number: `${resolve('prismjs')}/plugins/line-numbers/prism-line-numbers.css`
number: resolve('prismjs', 'plugins/line-numbers/prism-line-numbers.css')
};
};

2
source/css/_common/scaffolding/highlight/copy-code.styl
View File

@ -1,4 +1,4 @@
.highlight:hover .copy-btn, .highlight .copy-btn:focus {
.highlight:hover .copy-btn, pre:hover .copy-btn {
opacity: 1;
}

11
source/css/_common/scaffolding/highlight/highlight.styl
View File

@ -1,14 +1,14 @@
// Use `@require` to fix issue #67
@require hexo-config('highlight.light.file') if (hexo-config('highlight.enable'));
@require hexo-config('highlight.light.file') if (hexo-config('highlight.enable') && hexo-config('highlight.light.file'));
if (hexo-config('prism.enable')) {
@require hexo-config('prism.light');
@require hexo-config('prism.number');
@require hexo-config('prism.light') if (hexo-config('prism.light'));
@require hexo-config('prism.number') if (hexo-config('prism.number'));
}
if (hexo-config('darkmode')) {
@media (prefers-color-scheme: dark) {
@require hexo-config('highlight.dark.file') if (hexo-config('highlight.enable'));
@require hexo-config('prism.dark') if (hexo-config('prism.enable'));
@require hexo-config('highlight.dark.file') if (hexo-config('highlight.enable') && hexo-config('highlight.dark.file'));
@require hexo-config('prism.dark') if (hexo-config('prism.enable') && hexo-config('prism.dark'));
}
}
@ -117,6 +117,7 @@ pre {
@extend $code-block;
overflow: auto;
padding: 10px;
position: relative;
code {
background: none;

7
source/js/utils.js
View File

@ -71,7 +71,9 @@ NexT.utils = {
* One-click copy code support.
*/
registerCopyCode: function() {
document.querySelectorAll('figure.highlight').forEach(element => {
let figure = document.querySelectorAll('figure.highlight');
if (figure.length === 0) figure = document.querySelectorAll('pre');
figure.forEach(element => {
element.querySelectorAll('.code .line span').forEach(span => {
span.classList.forEach(name => {
span.classList.replace(name, `hljs-${name}`);
@ -81,7 +83,8 @@ NexT.utils = {
element.insertAdjacentHTML('beforeend', '<div class="copy-btn"><i class="fa fa-clipboard fa-fw"></i></div>');
const button = element.querySelector('.copy-btn');
button.addEventListener('click', () => {
const code = [...button.parentNode.querySelectorAll('.code .line')].map(line => line.innerText).join('\n');
const lines = element.querySelector('.code') || element.querySelector('code');
const code = lines.innerText;
const ta = document.createElement('textarea');
ta.style.top = window.scrollY + 'px'; // Prevent page scrolling
ta.style.position = 'absolute';