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

Remove highlight-container

Browse Source
This commit is contained in:
Mimi 2020-05-07 21:43:58 +08:00
parent e61c28d009
commit 9527ef6b06
3 changed files with 14 additions and 24 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -1,8 +1,4 @@
.highlight-container {
position: relative;
}
.highlight-container:hover .copy-btn, .highlight-container .copy-btn:focus {
.highlight:hover .copy-btn, .highlight .copy-btn:focus {
opacity: 1;
}
@ -22,7 +18,7 @@
right: 0;
top: 0;
} else if (hexo-config('codeblock.copy_button.style') == 'mac') {
color: white;
color: $highlight-foreground;
font-size: 14px;
right: 0;
top: 2px;
@ -38,12 +34,16 @@
}
if (hexo-config('codeblock.copy_button.style') == 'mac') {
.highlight-container {
.highlight {
background: #21252b;
border-radius: 5px;
box-shadow: 0 10px 30px 0 rgba(0, 0, 0, .4);
padding-top: 30px;
.table-container {
border-radius: 0 0 5px 5px;
}
&::before {
background: #fc625d;
border-radius: 50%;
@ -55,13 +55,5 @@ if (hexo-config('codeblock.copy_button.style') == 'mac') {
position: absolute;
width: 12px;
}
.highlight {
border-radius: 0 0 5px 5px;
.table-container {
border-radius: 0 0 5px 5px;
}
}
}
}

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

@ -28,6 +28,7 @@ code {
.highlight {
@extend $code-block;
position: relative;
*::selection {
background: $highlight-selection;

15
source/js/utils.js
View File

@ -64,15 +64,12 @@ NexT.utils = {
*/
registerCopyCode: function() {
document.querySelectorAll('figure.highlight').forEach(element => {
const box = document.createElement('div');
element.wrap(box);
box.classList.add('highlight-container');
box.insertAdjacentHTML('beforeend', '<div class="copy-btn"><i class="fa fa-clipboard fa-fw"></i></div>');
var button = element.parentNode.querySelector('.copy-btn');
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', event => {
var target = event.currentTarget;
var code = [...target.parentNode.querySelectorAll('.code .line')].map(line => line.innerText).join('\n');
var ta = document.createElement('textarea');
const target = event.currentTarget;
const code = [...target.parentNode.querySelectorAll('.code .line')].map(line => line.innerText).join('\n');
const ta = document.createElement('textarea');
ta.style.top = window.scrollY + 'px'; // Prevent page scrolling
ta.style.position = 'absolute';
ta.style.opacity = '0';
@ -84,7 +81,7 @@ NexT.utils = {
ta.select();
ta.setSelectionRange(0, code.length);
ta.readOnly = false;
var result = document.execCommand('copy');
const result = document.execCommand('copy');
if (CONFIG.copycode.show_result) {
target.querySelector('i').className = result ? 'fa fa-check fa-fw' : 'fa fa-times fa-fw';
}