From 0ef1f62d8ba9dbe4cc33622b20b997ddf4e5c16f Mon Sep 17 00:00:00 2001 From: guozejun Date: Sat, 7 May 2022 15:16:46 +0800 Subject: [PATCH] rich editore optimize Signed-off-by: guozejun --- .gitignore | 3 +- .../src/main/ets/components/CusDialogComp.ets | 12 +- .../src/main/resources/rawfile/editor.html | 42 +++---- .../main/resources/rawfile/editor_style.css | 108 +++++++++--------- 4 files changed, 83 insertions(+), 82 deletions(-) diff --git a/.gitignore b/.gitignore index 39187eb..d2e1429 100644 --- a/.gitignore +++ b/.gitignore @@ -1,4 +1,5 @@ /node_modules /local.properties /.idea -**/build \ No newline at end of file +**/build +/signature diff --git a/common/component/src/main/ets/components/CusDialogComp.ets b/common/component/src/main/ets/components/CusDialogComp.ets index 5fccc14..8422c1f 100644 --- a/common/component/src/main/ets/components/CusDialogComp.ets +++ b/common/component/src/main/ets/components/CusDialogComp.ets @@ -584,8 +584,8 @@ export struct EditContentDialog { Slider({ value: this.inSetValue, min: 0, - max: 60, - step: 10, + max: 16, + step: 4, style: SliderStyle.InSet }) .blockColor($r("app.color.color_ffffff")) @@ -595,7 +595,7 @@ export struct EditContentDialog { .showTips(false) .onChange((value: number, mode: SliderChangeMode) => { this.inSetValue = value - this.fontSize = value + 20 + this.fontSize = value + 12 this.confirm("javascript:RICH_EDITOR.execFontSize('" + this.fontSize + "')") LogUtil.info(TAG, 'value:' + value + 'mode:' + mode.toString()) }) @@ -889,8 +889,8 @@ export struct EditContentDialogPortrait { Slider({ value: this.inSetValue, min: 0, - max: 60, - step: 10, + max: 16, + step: 4, style: SliderStyle.InSet }) .blockColor($r("app.color.color_ffffff")) @@ -900,7 +900,7 @@ export struct EditContentDialogPortrait { .showTips(false) .onChange((value: number, mode: SliderChangeMode) => { this.inSetValue = value - this.fontSize = value + 20 + this.fontSize = value + 12 this.confirm("javascript:RICH_EDITOR.execFontSize('" + this.fontSize + "')") LogUtil.info(TAG, 'value:' + value + 'mode:' + mode.toString()) }) diff --git a/common/resources/src/main/resources/rawfile/editor.html b/common/resources/src/main/resources/rawfile/editor.html index b1d03d8..2f8ff4d 100644 --- a/common/resources/src/main/resources/rawfile/editor.html +++ b/common/resources/src/main/resources/rawfile/editor.html @@ -1,24 +1,24 @@ - - - "editorJs" - - - - - -
-
- - + + + "editorJs" + + + + + +
+
+ + diff --git a/common/resources/src/main/resources/rawfile/editor_style.css b/common/resources/src/main/resources/rawfile/editor_style.css index b93ea42..06b9eb8 100644 --- a/common/resources/src/main/resources/rawfile/editor_style.css +++ b/common/resources/src/main/resources/rawfile/editor_style.css @@ -14,76 +14,76 @@ */ html { - height: 100%; - font-family: sans-serif; - webkit-text-size-adjust: 100%; + height: 100%; + font-family: sans-serif; + -webkit-text-size-adjust: 100%; } body { - overflow: scroll; - display: table; - table-layout: fixed; - width: 100%; - min-height: 100%; - color: #333333; - margin: 0; + overflow: scroll; + display: table; + table-layout: fixed; + width: 100%; + min-height: 100%; + color: #333333; + margin: 0; } #editorjs { - padding-left: 24px; - padding-right: 24px; - width: 100%; - display: table-cell; - outline: 0px solid transparent; - background-repeat: no-repeat; - background-position: center; - background-size: cover; - color: #333333; - font-size: 40px; + padding-left: 24px; + padding-right: 24px; + width: 100%; + display: table-cell; + outline: 0px solid transparent; + background-repeat: no-repeat; + background-position: center; + background-size: cover; + color: #333333; + font-size: 16px; } #editorjs[placeholder]:empty:not(:focus):before { - content: attr(placeholder); - font-size: 40px; - color: #9b9b9b; + content: attr(placeholder); + font-size: 16px; + color: #9b9b9b; } .note-checkbox:checked { - background: #F88805; - border: 2px solid #F88805; - outline: none; - margin-left: 0px; - margin-right: 0px; - opacity: 1; + background: #F88805; + border: 2px solid #F88805; + outline: none; + margin-left: 0px; + margin-right: 0px; + opacity: 1; } .note-checkbox { - width: 23px; - height: 23px; - background-color: #ffffff; - border: 2px solid #555555; - webkit-border-radius: 50%; - webkit-appearance: none; - webkit-user-select: none; - border-radius: 50%; - font-size: 0.8rem; - margin-left: 0px; - margin-top: 10px; - margin-right: 0px; - margin-bottom: 0px; - outline: none; - padding: 0; - position: relative; - display: inline-block; - webkit-transition: background-color ease 0.1s; - transition: background-color ease 0.1s; - vertical-align: top; - cursor: default; - user-select: none; + width: 20px; + height: 20px; + background-color: #ffffff; + border: 2px solid #555555; + -webkit-border-radius: 50%; + -webkit-appearance: none; + -webkit-user-select: none; + border-radius: 50%; + font-size: 0.8rem; + margin-left: 0px; + margin-top: 0px; + margin-right: 4px; + margin-bottom: 9px; + outline: none; + padding: 0; + position: relative; + display: inline-block; + -webkit-transition: background-color ease 0.1s; + transition: background-color ease 0.1s; + vertical-align: top; + cursor: default; + user-select: none; } .note-checkbox:checked+span { - text-decoration: line-through; - color: #F88805; - opacity: 0.4; + text-decoration: line-through; + color: #F88805; + opacity: 0.4; } -- Gitee