diff --git a/README.md b/README.md index a4d7b70..945a19b 100644 --- a/README.md +++ b/README.md @@ -26,6 +26,7 @@ - 支持文件匹配,新增相应特殊变量 - 内置`文本处理`,`find GUI`,`下载uTools离线插件`,`特殊符号`等多个实用快捷命令,均使用新版本新增功能实现 - 适配暗黑模式,UI改版 + - 支持对文本和 HTML 的输出进行搜索 - 魔改codemirror,代码编辑器增强 - 支持js、py代码格式化 - 新增cmd、applescript代码高亮(原先用的shell的) diff --git a/src/assets/options.js b/src/assets/options.js index f2889d4..d63a630 100644 --- a/src/assets/options.js +++ b/src/assets/options.js @@ -1085,6 +1085,26 @@ programCheck() $("#options").show() } + + // 输出搜索 + let showSearchBox = () => { + if ($('#options').is(':hidden') && $('#out').is(":parent")) { + $('#out').append(`
`) + $('#outputSearch').animate({ opacity: 1, top: '10px', }) + document.getElementById('find-next').onclick = () => { + utools.findInPage($('#outputSearch > input').val()) + } + document.getElementById('find-prev').onclick = () => { + utools.findInPage($('#outputSearch > input').val(), { forward: false }) + } + document.getElementById('find-close').onclick = () => { + utools.stopFindInPage() + $('#outputSearch').animate({ opacity: 0, top: '-30px', }, () => { + $('#outputSearch').remove() + }) + } + } + } // 切换TAGS $("#options").on('click', '.sidebar li', function () { @@ -1156,4 +1176,9 @@ runCurrentCommand() return false }); + + Mousetrap.bind('ctrl+f', () => { + showSearchBox() + return false + }); }() \ No newline at end of file diff --git a/src/assets/style/darkmode.css b/src/assets/style/darkmode.css index b10f014..7db6b69 100644 --- a/src/assets/style/darkmode.css +++ b/src/assets/style/darkmode.css @@ -143,4 +143,15 @@ body .swal2-container.swal2-backdrop-show, body .swal2-container.swal2-noanimati body.swal2-no-backdrop .swal2-container > .swal2-modal { box-shadow: 0 0 10px rgb(48,49,51,0.75) +} + +/*搜索框*/ +#out > #outputSearch { + background: #2d2d2d; +} + +#out > #outputSearch input { + background: #242729; + color: #e4e4e4; + border: 1px solid #403f3f; } \ No newline at end of file diff --git a/src/assets/style/options.css b/src/assets/style/options.css index 11f77fd..20257d7 100644 --- a/src/assets/style/options.css +++ b/src/assets/style/options.css @@ -631,7 +631,7 @@ li.CodeMirror-hint { padding: 3px 4px; } -/*---------------animate.css---------------*/ +/*animate.css*/ @keyframes fadeInDown { 0% { opacity: 0; @@ -694,9 +694,9 @@ li.CodeMirror-hint { animation: fadeOutDown 0.3s; } -/*---------------animate.css---------------*/ +/*animate.css*/ -/*---------------select2---------------*/ +/*select2*/ #options #customize .select2-selection--single, #options #customize .select2-selection--multiple { border-bottom: 1px solid #dbdbdb; @@ -792,9 +792,9 @@ li.CodeMirror-hint { outline: none } -/*---------------select2---------------*/ +/*select2*/ -/*---------------quicktextarea---------------*/ +/*quicktextarea*/ #quicktextarea { z-index: 10; @@ -835,10 +835,34 @@ li.CodeMirror-hint { background: #6ab4f0; } -/*---------------quicktextarea---------------*/ +/*quicktextarea*/ +/*搜索框*/ +#out > #outputSearch { + position: fixed; + opacity: 0; + top: -30px; + right: 10px; + padding: 5px 10px 5px 10px; + background: #ffffff; + box-shadow: 2px 1px 3px 0px black; +} -.darktheme { - background: #282c34; - color: wheat; +#out > #outputSearch input { + height: 20px; + width: 220px; + margin-right: 5px; + border: 1px solid #e4e3e3; + background: #f5f5f5; + outline: none; +} + +#out > #outputSearch input:focus { + border: 1px solid #03A9F4; +} + +#out > #outputSearch > kbd { + cursor: pointer; + margin: 5px; + user-select: none; } \ No newline at end of file