避免横条遮挡键盘点击

.gitignore

@@ -2,6 +2,7 @@
 node_modules
 package-lock.json
 /dist
+/docs
 
 # local env files
 .env.local

README.md

@@ -12,6 +12,8 @@ EnumKeyboardModel
 - bbq10
 - bbq20
 
+[http://kylebing.cn/tools/bb-keyboard](http://kylebing.cn/tools/bb-keyboard)
+
 
 <img width="1368" alt="Screenshot 2024-04-18 at 16 02 49" src="https://github.com/KyleBing/blackberry-keyboard/assets/12215982/e98b2cc2-ea9a-4cdd-b2ea-12e05aa85b2b">
 <img width="1368" alt="Screenshot 2024-04-18 at 16 02 53" src="https://github.com/KyleBing/blackberry-keyboard/assets/12215982/4c63c26e-4966-4f72-8e5e-74361f5095ee">

src/App.vue

@@ -69,7 +69,7 @@ onMounted(()=> {
     a{
         font-size: 12px;
         text-decoration: underline;
-        color: white;
+        color: transparentize(white,0.6);
     }
 }
 </style>

src/page/Divider/Divider.vue

@@ -26,6 +26,7 @@ const props = defineProps<Props>()
 <style lang="scss" scoped>
 @import "../../scss/plugin";
 .divider{
+    pointer-events: none;
     height: 4px;
     width: 100%;
     background-color: white;

src/page/Divider/Divider9900-0.vue

@@ -11,6 +11,7 @@ import SVG_ICONS from "@/assets/icons/SVG_ICONS.ts";
 <style lang="scss" scoped>
 @import "../../scss/plugin";
 .divider{
+    pointer-events: none;
     position: relative;
     z-index: 100;
     height: 40px;

src/page/Divider/Divider9900-1.vue

@@ -12,6 +12,7 @@ import SVG_ICONS from "@/assets/icons/SVG_ICONS.ts";
 <style lang="scss" scoped>
 @import "../../scss/plugin";
 .divider{
+    pointer-events: none;
     position: relative;
     z-index: 100;
     height: 40px;

src/page/Divider/Divider9900-2.vue

@@ -12,6 +12,7 @@ import SVG_ICONS from "@/assets/icons/SVG_ICONS.ts";
 <style lang="scss" scoped>
 @import "../../scss/plugin";
 .divider{
+    pointer-events: none;
     position: relative;
     z-index: 100;
     height: 40px;

src/page/Divider/Divider9900-3.vue

@@ -12,6 +12,7 @@ import SVG_ICONS from "@/assets/icons/SVG_ICONS.ts";
 <style lang="scss" scoped>
 @import "../../scss/plugin";
 .divider{
+    pointer-events: none;
     position: relative;
     z-index: 100;
     height: 40px;

src/page/Index.vue

@@ -1,15 +1,19 @@
 <template>
     <div>
         <ShoulderKey :is-show-button-name="false"/>
-        <div class="keyboard" :style="keyboardStyle" v-if="currentKeyboardModel === EnumKeyboardModel.bb9900">
+        <div
+            v-if="currentKeyboardModel === EnumKeyboardModel.bb9900"
+            class="keyboard" :style="keyboardStyle" >
             <FunctionKey9900
                 @switchModel="switchModel"
                 :keyboard-model="currentKeyboardModel" />
             <NormalKey9900 :keyboard-model="currentKeyboardModel"/>
             <Divider99003 :keyboard-model="currentKeyboardModel" style="margin-top: -17px;"/>
             <BottomKey style="margin-top: -25px;"/>
         </div>
-        <div class="keyboard" :style="keyboardStyle" v-else>
+        <div
+            v-else
+            class="keyboard" :style="keyboardStyle">
             <FunctionKey
                 @switchModel="switchModel"
                 :keyboard-model="currentKeyboardModel" />

tsconfig.json

@@ -5,7 +5,9 @@
     "module": "ESNext",
     "lib": ["ES2020", "DOM", "DOM.Iterable"],
     "skipLibCheck": true,
-
+    "paths": {
+      "@/*": ["src/*"]
+    },
     /* Bundler mode */
     "moduleResolution": "bundler",
     "allowImportingTsExtensions": true,