From 9527ef6b06bf22ca0b0b63293eecc8000bb5ecab Mon Sep 17 00:00:00 2001 From: Mimi <1119186082@qq.com> Date: Thu, 7 May 2020 21:43:58 +0800 Subject: [PATCH] Remove highlight-container --- .../scaffolding/highlight/copy-code.styl | 22 ++++++------------- .../scaffolding/highlight/highlight.styl | 1 + source/js/utils.js | 15 +++++-------- 3 files changed, 14 insertions(+), 24 deletions(-) diff --git a/source/css/_common/scaffolding/highlight/copy-code.styl b/source/css/_common/scaffolding/highlight/copy-code.styl index 9fdd98784..f187b66f2 100644 --- a/source/css/_common/scaffolding/highlight/copy-code.styl +++ b/source/css/_common/scaffolding/highlight/copy-code.styl @@ -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; - } - } } } diff --git a/source/css/_common/scaffolding/highlight/highlight.styl b/source/css/_common/scaffolding/highlight/highlight.styl index eb74a189d..6b1a8472f 100644 --- a/source/css/_common/scaffolding/highlight/highlight.styl +++ b/source/css/_common/scaffolding/highlight/highlight.styl @@ -28,6 +28,7 @@ code { .highlight { @extend $code-block; + position: relative; *::selection { background: $highlight-selection; diff --git a/source/js/utils.js b/source/js/utils.js index aa3877750..e7bd7c62a 100644 --- a/source/js/utils.js +++ b/source/js/utils.js @@ -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', '
'); - var button = element.parentNode.querySelector('.copy-btn'); + element.insertAdjacentHTML('beforeend', '
'); + 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'; }