fix: 自定义按键布局

src/components/scroll.vue

@@ -87,7 +87,7 @@ function draw() {
 /**
  * 计算元素总长度
  */
-async function calHeight(first: boolean) {
+async function calHeight(first: boolean = false) {
     if (!first) {
         await sleep(20);
     }
@@ -207,6 +207,7 @@ onMounted(async () => {
 
     window.addEventListener('resize', resize);
     await calHeight(true);
+    await calHeight();
     draw();
 });
 

src/core/main/init/settings.tsx

@@ -38,9 +38,14 @@ function BooleanSetting(props: SettingComponentProps) {
     };
 
     return (
-        <div>
+        <div class="editor-boolean">
             <span>当前 {item.value ? '开启' : '关闭'}</span>
-            <Button type="primary" size="large" onClick={changeValue}>
+            <Button
+                class="boolean-button"
+                type="primary"
+                size="large"
+                onClick={changeValue}
+            >
                 {item.value ? '开启' : '关闭'}设置
             </Button>
         </div>
@@ -55,7 +60,7 @@ function NumberSetting(props: SettingComponentProps) {
     };
 
     return (
-        <div>
+        <div class="editor-number">
             <span> 修改设置： </span>
             <InputNumber
                 class="number-input"
@@ -81,10 +86,10 @@ function showSpecialSetting(id: string, vBind?: any) {
 }
 
 function HotkeySetting(props: SettingComponentProps) {
-    // todo: hotkey.vue
     return (
-        <div>
+        <div style="display: flex; justify-content: center">
             <Button
+                style="font-size: 75%"
                 type="primary"
                 size="large"
                 onClick={() =>
@@ -102,8 +107,9 @@ function HotkeySetting(props: SettingComponentProps) {
 function ToolbarSetting(props: SettingComponentProps) {
     // todo: toolSetting.vue
     return (
-        <div>
+        <div style="display: flex; justify-content: center">
             <Button
+                style="font-size: 75%"
                 type="primary"
                 size="large"
                 onClick={() => showSpecialSetting('toolSetting')}

src/ui/hotkey.vue

@@ -193,14 +193,14 @@ onUnmounted(() => {
 }
 
 .hotkey-group-one {
-    margin: 2px 0;
+    margin: 0 0 4px 0;
 }
 
 .hotkey-one {
     display: flex;
     flex-direction: row;
     justify-content: space-between;
-    margin: 2% 3%;
+    margin: 0 3% 2% 3%;
     white-space: nowrap;
 }
 

src/ui/settings.vue

@@ -261,15 +261,7 @@ onUnmounted(() => {
     height: 100%;
 }
 
-.setting-info {
-    width: 25vw;
-
-    .info-divider {
-        border-color: #fff4;
-        margin: 2% 0;
-    }
-
-    .editor-boolean {
+.setting-info::v-deep(.editor-boolean) {
     display: flex;
     flex-direction: row;
     justify-content: space-around;
@@ -279,14 +271,9 @@ onUnmounted(() => {
     .boolean-button {
         font-size: 75%;
     }
-    }
+}
 
-    .info-text {
-        font-size: 85%;
-        min-height: 30%;
-    }
-
-    .editor-number {
+.setting-info::v-deep(.editor-number) {
     display: flex;
     flex-direction: row;
     justify-content: space-around;
@@ -297,6 +284,19 @@ onUnmounted(() => {
         font-size: 80%;
         width: 40%;
     }
+}
+
+.setting-info {
+    width: 25vw;
+
+    .info-divider {
+        border-color: #fff4;
+        margin: 2% 0;
+    }
+
+    .info-text {
+        font-size: 85%;
+        min-height: 30%;
     }
 }