diff --git a/examples/scripts/index-demo.js b/examples/scripts/index-demo.js
index 111e2de0..8c0580d5 100644
--- a/examples/scripts/index-demo.js
+++ b/examples/scripts/index-demo.js
@@ -179,7 +179,7 @@ var basicConfig = {
'|',
'formula',
{
- insert: ['image', 'audio', 'video', 'link', 'hr', 'br', 'code', 'formula', 'toc', 'table', 'pdf', 'word'],
+ insert: ['image', 'audio', 'video', 'link', 'hr', 'br', 'code', 'inlineCode', 'formula', 'toc', 'table', 'pdf', 'word'],
},
'graph',
'customMenuTable',
@@ -216,7 +216,7 @@ var basicConfig = {
// serviceUrl: 'http://localhost:3001',
// injectPayload: {
// thumb_media_id: 'ft7IwCi1eukC6lRHzmkYuzeMmVXWbU3JoipysW2EZamblyucA67wdgbYTix4X377',
- // author: 'Cherry Markdown',
+ // author: 'Cherry Markdown',
// },
// }
// ],
diff --git a/src/sass/ch-icon.scss b/src/sass/ch-icon.scss
index cd5418ce..59b37e24 100644
--- a/src/sass/ch-icon.scss
+++ b/src/sass/ch-icon.scss
@@ -108,4 +108,6 @@
.ch-icon-justifyRight:before { content: "\EA6F" }
.ch-icon-chevronsLeft:before { content: "\EA70" }
.ch-icon-chevronsRight:before { content: "\EA71" }
-.ch-icon-trendingUp:before { content: "\EA72" }
\ No newline at end of file
+.ch-icon-trendingUp:before { content: "\EA72" }
+.ch-icon-inlineCode:before { content: "\EA73" }
+.ch-icon-codeBlock:before { content: "\EA74" }
\ No newline at end of file
diff --git a/src/sass/components/shortcut_key_config.scss b/src/sass/components/shortcut_key_config.scss
index 7b3f3b49..f84e8b22 100644
--- a/src/sass/components/shortcut_key_config.scss
+++ b/src/sass/components/shortcut_key_config.scss
@@ -32,6 +32,9 @@
.shortcut-key-config-panel-kbd {
display: flex;
gap: 10px;
+ min-width: 120px;
+ justify-content: right;
+
.keyboard-key {
border-radius: 3px;
border-style: solid;
@@ -43,7 +46,7 @@
vertical-align: middle;
line-height: 20px;
margin: 4px;
- width: 10px;
+ min-width: 16px;
text-align: center;
}
}
diff --git a/src/sass/icons/uEA73-inlineCode.svg b/src/sass/icons/uEA73-inlineCode.svg
new file mode 100644
index 00000000..9c124fc6
--- /dev/null
+++ b/src/sass/icons/uEA73-inlineCode.svg
@@ -0,0 +1,18 @@
+
+
+
diff --git a/src/sass/icons/uEA74-codeBlock.svg b/src/sass/icons/uEA74-codeBlock.svg
new file mode 100644
index 00000000..b2fe6397
--- /dev/null
+++ b/src/sass/icons/uEA74-codeBlock.svg
@@ -0,0 +1 @@
+
diff --git a/src/toolbars/HookCenter.js b/src/toolbars/HookCenter.js
index e3b3e0a3..c7d2ce96 100644
--- a/src/toolbars/HookCenter.js
+++ b/src/toolbars/HookCenter.js
@@ -41,6 +41,7 @@ import FullScreen from './hooks/FullScreen';
import Undo from './hooks/Undo';
import Redo from './hooks/Redo';
import Code from './hooks/Code';
+import InlineCode from './hooks/InlineCode';
import CodeTheme from './hooks/CodeTheme';
import Export from './hooks/Export';
import Settings from './hooks/Settings';
@@ -99,6 +100,7 @@ const HookList = {
quickTable: QuickTable,
togglePreview: TogglePreview,
code: Code,
+ inlineCode: InlineCode,
codeTheme: CodeTheme,
export: Export,
settings: Settings,
diff --git a/src/toolbars/hooks/Code.js b/src/toolbars/hooks/Code.js
index 476ba151..7fcd2ca8 100644
--- a/src/toolbars/hooks/Code.js
+++ b/src/toolbars/hooks/Code.js
@@ -24,7 +24,7 @@ export default class Code extends MenuBase {
*/
constructor($cherry) {
super($cherry);
- this.setName('code', 'code');
+ this.setName('code', 'codeBlock');
this.shortcutKeyMap = {
[`${CONTROL_KEY}-${getKeyCode('k')}`]: {
hookName: this.name,
diff --git a/src/toolbars/hooks/InlineCode.js b/src/toolbars/hooks/InlineCode.js
new file mode 100644
index 00000000..4127b344
--- /dev/null
+++ b/src/toolbars/hooks/InlineCode.js
@@ -0,0 +1,53 @@
+/**
+ * Copyright (C) 2021 THL A29 Limited, a Tencent company.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import MenuBase from '@/toolbars/MenuBase';
+import { CONTROL_KEY } from '@/utils/shortcutKey';
+/**
+ * 插入行内代码的按钮
+ */
+export default class InlineCode extends MenuBase {
+ constructor($cherry) {
+ super($cherry);
+ this.setName('inlineCode', 'inlineCode');
+ this.shortcutKeyMap = {
+ [`${CONTROL_KEY}-Backquote`]: {
+ hookName: this.name,
+ aliasName: this.$cherry.locale[this.name],
+ },
+ };
+ }
+
+ /**
+ * 响应点击事件
+ * @param {string} selection 被用户选中的文本内容
+ * @param {string} shortKey 快捷键参数,本函数不处理这个参数
+ * @returns {string} 回填到编辑器光标位置/选中文本区域的内容
+ */
+ onClick(selection, shortKey = '') {
+ if (!selection) {
+ this.registerAfterClickCb(() => this.setLessSelection('`', '`'));
+ return '``';
+ }
+
+ if (!selection.includes('\n')) {
+ this.registerAfterClickCb(() => this.setLessSelection('`', '`'));
+ return `\`${selection}\``;
+ }
+
+ const arr = selection.split('\n').map((item) => `\`${item}\``);
+ return arr.join('\n');
+ }
+}