@ebscn/ui 1.0.3-beta.13 → 1.0.3-beta.16

package/es/components/stock-count-keyboard/stock-count-keyboard.css

@@ -1,9 +1,14 @@
 html[data-prefers-color-scheme='dark'] .ebscn-stock-count-keyboard-delete {
-  background: url(../../assets/images/delete_dark.png) var(--ebscn-color-functionkey-background) no-repeat center;
+  background: url(../../assets/images/delete_dark.png) var(--ebscn-color-keyboard-fckey-bg) no-repeat center;
   background-size: 24px 24px;
+  background-color: var(--ebscn-color-keyboard-fckey-bg);
+}
+html[data-prefers-color-scheme='dark'] .ebscn-stock-count-keyboard-delete:active {
+  background-color: var(--ebscn-color-keyboard-fckey-bg-active);
 }
 .ebscn-stock-count-keyboard {
   display: none;
+  box-sizing: border-box;
   position: fixed;
   z-index: 999;
   bottom: 0;
@@ -20,12 +25,14 @@ html[data-prefers-color-scheme='dark'] .ebscn-stock-count-keyboard-delete {
 .ebscn-stock-count-keyboard-key,
 .ebscn-stock-count-keyboard-confirmKey {
   border-radius: 4.17px;
-  width: calc(20% - 7.5px);
+  width: calc(20% - 8px);
   margin: 3px;
-  height: 48px;
+  height: 46px;
   text-align: center;
   line-height: 48px;
   font-weight: 400;
+  border: 0.5px solid #888;
+  border-color: var(--ebscn-color-keyboard-key-border);
 }
 .ebscn-stock-count-keyboard-key {
   font-size: 23px;
@@ -33,24 +40,30 @@ html[data-prefers-color-scheme='dark'] .ebscn-stock-count-keyboard-delete {
   background: var(--ebscn-color-keyboard-key-bg);
 }
 .ebscn-stock-count-keyboard-key:active {
-  background: var(--ebscn-color-keyboard-active-background);
+  background-color: #e5e5e5;
+  background-color: var(--ebscn-color-keyboard-key-bg-active);
 }
 .ebscn-stock-count-keyboard-option {
+  font-size: 18px;
   font-size: var(--ebscn-font-size-10);
   color: var(--ebscn-color-text);
-  background-color: var(--ebscn-color-functionkey-background);
+  background-color: var(--ebscn-color-keyboard-fckey-bg);
+  border: 0.5px solid #888;
+  border-color: var(--ebscn-color-keyboard-fckey-border);
 }
 .ebscn-stock-count-keyboard-option:active {
-  font-size: var(--ebscn-font-size-10);
-  background-color: var(--ebscn-color-keyboard-active-background);
+  background-color: #252525;
+  background-color: var(--ebscn-color-keyboard-fckey-bg-active);
 }
 .ebscn-stock-count-keyboard-delete {
-  background: url(../../assets/images/delete.png) var(--ebscn-color-functionkey-background) no-repeat center;
-  background-size: 24px 24px;
+  background: url(../../assets/images/delete.png) var(--ebscn-color-keyboard-fckey-bg) no-repeat center;
+  background-size: 25px 25px;
 }
 .ebscn-stock-count-keyboard-delete:active {
-  background: url(../../assets/images/delete.png) var(--ebscn-color-keyboard-active-background) no-repeat center;
-  background-size: 24px 24px;
+  background: url(../../assets/images/delete.png) var(--ebscn-color-keyboard-key-bg-active) no-repeat center;
+  background-size: 25px 25px;
+  background-color: #252525;
+  background-color: var(--ebscn-color-keyboard-fckey-bg-active);
 }
 .ebscn-stock-count-keyboard-confirmKey {
   background-color: var(--ebscn-color-primary);
@@ -58,7 +71,7 @@ html[data-prefers-color-scheme='dark'] .ebscn-stock-count-keyboard-delete {
   color: var(--ebscn-color-white);
 }
 .ebscn-stock-count-keyboard-confirmKey:active {
-  background-color: #D03B21;
+  background-color: #d13c21;
 }
 @supports (bottom: env(safe-area-inset-bottom)) or (constant(safe-area-inset-bottom)) {
   .ebscn-stock-count-keyboard {

package/es/components/stock-keyboard/alphabet-keyboard.css

@@ -1,17 +1,32 @@
 html[data-prefers-color-scheme='dark'] .ebscn-alphabet-keyboard-extra-keybord {
   background: url(../../assets/images/keybord_keybord_dark.png) no-repeat center;
-  background-color: var(--ebscn-color-functionkey-background);
-  background-size: 24px 24px;
+  background-size: 25px 25px;
+  background-color: var(--ebscn-color-keyboard-fckey-bg);
+}
+html[data-prefers-color-scheme='dark'] .ebscn-alphabet-keyboard-extra-keybord:active {
+  background-color: var(--ebscn-color-keyboard-fckey-bg-active);
 }
 html[data-prefers-color-scheme='dark'] .ebscn-alphabet-keyboard-extra-delete {
   background: url(../../assets/images/delete_dark.png) no-repeat center;
-  background-color: var(--ebscn-color-functionkey-background);
-  background-size: 24px 24px;
+  background-size: 25px 25px;
+  background-color: var(--ebscn-color-keyboard-fckey-bg);
+}
+html[data-prefers-color-scheme='dark'] .ebscn-alphabet-keyboard-extra-delete:active {
+  background-color: var(--ebscn-color-keyboard-fckey-bg-active);
 }
 html[data-prefers-color-scheme='dark'] .ebscn-alphabet-keyboard-extra-shift {
   background: url(../../assets/images/keybord_shift_dark.png) no-repeat center;
-  background-color: var(--ebscn-color-functionkey-background);
-  background-size: 24px 24px;
+  background-size: 25px 25px;
+  background-color: var(--ebscn-color-keyboard-fckey-bg);
+}
+html[data-prefers-color-scheme='dark'] .ebscn-alphabet-keyboard-extra-shift:active {
+  background-color: var(--ebscn-color-keyboard-fckey-bg-active);
+}
+html[data-prefers-color-scheme='dark'] .ebscn-alphabet-keyboard-extra-shift-big {
+  background: url(../../assets/images/keybord_shift2_dark.png) no-repeat center;
+  background-color: #adb3bd;
+  background-color: var(--ebscn-color-keyboard-fckey-bg);
+  background-size: 25px 25px;
 }
 .ebscn-alphabet-keyboard-extra {
   position: relative;
@@ -23,40 +38,37 @@ html[data-prefers-color-scheme='dark'] .ebscn-alphabet-keyboard-extra-shift {
   background-color: #fff;
   background-color: var(--ebscn-color-keyboard-bg);
 }
-.ebscn-alphabet-keyboard-extra-darkkey {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  width: 11.2%;
-  height: 42px;
-  border-radius: 5px;
-  background-color: #adb3bd;
-  background-color: var(--ebscn-color-functionkey-background);
-  font-size: var(--ebscn-font-size-9);
-}
-.ebscn-alphabet-keyboard-extra-darkkey:active {
-  background-color: #e5e5e5;
-  background-color: var(--ebscn-color-keyboard-active-background);
-}
 .ebscn-alphabet-keyboard-extra-shift {
   margin-right: 3.73%;
   background: url(../../assets/images/keybord_shift.png) no-repeat center;
   background-color: #adb3bd;
-  background-color: var(--ebscn-color-functionkey-background);
+  background-color: var(--ebscn-color-keyboard-fckey-bg);
   background-size: 17px 17px;
+  border: 0.5px solid #888;
+  border-color: var(--ebscn-color-keyboard-key-border);
+}
+.ebscn-alphabet-keyboard-extra-shift-big {
+  background: url(../../assets/images/keybord_shift2.png) no-repeat center;
+  background-color: #adb3bd;
+  background-color: var(--ebscn-color-keyboard-fckey-bg);
+  background-size: 25px 25px;
 }
 .ebscn-alphabet-keyboard-extra-delete {
   margin-left: 2.26%;
   background: url(../../assets/images/delete.png) no-repeat center;
   background-color: #adb3bd;
-  background-color: var(--ebscn-color-functionkey-background);
-  background-size: 24px 24px;
+  background-color: var(--ebscn-color-keyboard-fckey-bg);
+  background-size: 25px 25px;
+  border: 0.5px solid #888;
+  border-color: var(--ebscn-color-keyboard-key-border);
 }
 .ebscn-alphabet-keyboard-extra-keybord {
   background: url(../../assets/images/keybord_keybord.png) no-repeat center;
   background-color: #adb3bd;
-  background-color: var(--ebscn-color-functionkey-background);
-  background-size: 24px 18px;
+  background-color: var(--ebscn-color-keyboard-fckey-bg);
+  background-size: 25px 18px;
+  border: 0.5px solid #888;
+  border-color: var(--ebscn-color-keyboard-key-border);
 }
 .ebscn-alphabet-keyboard-extra-space {
   display: flex;
@@ -68,10 +80,12 @@ html[data-prefers-color-scheme='dark'] .ebscn-alphabet-keyboard-extra-shift {
   font-size: 16px;
   background-color: #fff;
   background: var(--ebscn-color-keyboard-key-bg);
+  border: 0.5px solid #888;
+  border-color: var(--ebscn-color-keyboard-key-border);
 }
 .ebscn-alphabet-keyboard-extra-space:active {
-  background-color: #eee;
-  background-color: var(--ebscn-color-border);
+  background-color: #e5e5e5;
+  background-color: var(--ebscn-color-keyboard-key-bg-active);
 }
 .ebscn-alphabet-keyboard-extra .ebscn-alphabet-keyboard-extra-firstline,
 .ebscn-alphabet-keyboard-extra .ebscn-alphabet-keyboard-extra-secondline,
@@ -80,7 +94,7 @@ html[data-prefers-color-scheme='dark'] .ebscn-alphabet-keyboard-extra-shift {
   display: flex;
   justify-content: space-between;
   width: 100%;
-  padding-top: 3%;
+  padding-top: calc(3% - 1px);
 }
 .ebscn-alphabet-keyboard-extra .ebscn-alphabet-keyboard-extra-firstline-key,
 .ebscn-alphabet-keyboard-extra .ebscn-alphabet-keyboard-extra-secondline-key,
@@ -89,8 +103,9 @@ html[data-prefers-color-scheme='dark'] .ebscn-alphabet-keyboard-extra-shift {
   display: flex;
   align-items: center;
   justify-content: center;
+  flex: 1;
   width: 8.4%;
-  height: 42px;
+  height: 40px;
   background-color: #fff;
   background: var(--ebscn-color-keyboard-key-bg);
   border-radius: 5px;
@@ -99,31 +114,46 @@ html[data-prefers-color-scheme='dark'] .ebscn-alphabet-keyboard-extra-shift {
   text-align: center;
   color: #333;
   color: var(--ebscn-color-text);
-  margin-right: 1.6%;
+  margin: 0 3px;
+  border: 0.5px solid #888;
+  border-color: var(--ebscn-color-keyboard-key-border);
 }
 .ebscn-alphabet-keyboard-extra .ebscn-alphabet-keyboard-extra-firstline-key:active,
 .ebscn-alphabet-keyboard-extra .ebscn-alphabet-keyboard-extra-secondline-key:active,
 .ebscn-alphabet-keyboard-extra .ebscn-alphabet-keyboard-extra-thirdline-key:active,
 .ebscn-alphabet-keyboard-extra .ebscn-alphabet-keyboard-extra-firthline-key:active {
-  background-color: #eee;
-  background-color: var(--ebscn-color-border);
+  background-color: #e5e5e5;
+  background-color: var(--ebscn-color-keyboard-key-bg-active);
 }
-.ebscn-alphabet-keyboard-extra .ebscn-alphabet-keyboard-extra-firstline {
-  padding-left: 0.8%;
-  padding-right: 0.8%;
+.ebscn-alphabet-keyboard-extra-darkkey {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 11.2%;
+  height: 42px;
+  border-radius: 5px;
+  background-color: #adb3bd;
+  background-color: var(--ebscn-color-keyboard-fckey-bg);
+  font-size: var(--ebscn-font-size-9);
+  border: 0.5px solid #888;
+  border-color: var(--ebscn-color-keyboard-fckey-border);
+}
+.ebscn-alphabet-keyboard-extra-darkkey:active {
+  background-color: #252525;
+  background-color: var(--ebscn-color-keyboard-fckey-bg-active);
 }
 .ebscn-alphabet-keyboard-extra .ebscn-alphabet-keyboard-extra-secondline {
   padding-left: 5.73%;
   padding-right: 5.73%;
 }
 .ebscn-alphabet-keyboard-extra .ebscn-alphabet-keyboard-extra-thirdline {
-  padding-left: 0.8%;
-  padding-right: 0.8%;
+  padding-left: 3px;
+  padding-right: 3px;
 }
 .ebscn-alphabet-keyboard-extra .ebscn-alphabet-keyboard-extra-firthline {
-  padding-left: 0.8%;
-  padding-right: 0.8%;
-  padding-bottom: 1.06%;
+  padding-left: 3px;
+  padding-right: 3px;
+  padding-bottom: 6px;
 }
 .ebscn-alphabet-keyboard-extra .ebscn-alphabet-keyboard-extra-firthline-confirm {
   display: flex;
@@ -139,9 +169,11 @@ html[data-prefers-color-scheme='dark'] .ebscn-alphabet-keyboard-extra-shift {
   text-align: center;
   color: #fff;
   line-height: 22.5px;
+  border: 0.5px solid #888;
+  border-color: var(--ebscn-color-keyboard-key-border);
 }
 .ebscn-alphabet-keyboard-extra .ebscn-alphabet-keyboard-extra-firthline-confirm:active {
-  background-color: #D03B21;
+  background-color: #d13c21;
 }
 .ebscn-alphabet-keyboard-extra .ebscn-alphabet-keyboard-extra-firthline img {
   height: 20%;

package/es/components/stock-keyboard/alphabet-keyboard.js

@@ -1,5 +1,4 @@
-import { useRef, useState } from "react";
-import React from "react";
+import React, { useRef, useState } from 'react';
 import { withNativeProps } from '../../utils/native-props';
 import { mergeProps } from '../../utils/with-default-props';
 var classPrefix = 'ebscn-alphabet-keyboard-extra';
@@ -76,12 +75,11 @@ export function AlphabetKeyboard(p) {
   }, (isBig == false ? thirdKeys : thirdKeysBig).map(function (item, index) {
     return React.createElement("div", {
       key: item || index,
-      className: item == '↑' ? "".concat(classPrefix, "-darkkey ").concat(classPrefix, "-shift") : item == '×' ? "".concat(classPrefix, "-darkkey ").concat(classPrefix, "-delete") : "".concat(classPrefix, "-thirdline-key"),
+      className: item == '↑' && isBig ? "".concat(classPrefix, "-darkkey ").concat(classPrefix, "-shift ").concat(classPrefix, "-shift-big") : item == '↑' ? "".concat(classPrefix, "-darkkey ").concat(classPrefix, "-shift") : item == '×' ? "".concat(classPrefix, "-darkkey ").concat(classPrefix, "-delete") : "".concat(classPrefix, "-thirdline-key"),
       onClick: function () {
         if (visible) {
           onKeyPress(item);
         }
-        ;
       }
     }, imgKeys.includes(item) ? '' : item);
   })), React.createElement("div", {

package/es/components/stock-keyboard/stock-keyboard.css

@@ -1,6 +1,10 @@
 html[data-prefers-color-scheme='dark'] .ebscn-stock-keyboard-bottom .ebscn-stock-keyboard-right-delete {
-  background: url(../../assets/images/delete_dark.png) var(--ebscn-color-functionkey-background) no-repeat center;
-  background-size: 24px 24px;
+  background: url(../../assets/images/delete_dark.png) var(--ebscn-color-keyboard-fckey-bg) no-repeat center;
+  background-size: 25px 25px;
+  background-color: var(--ebscn-color-keyboard-fckey-bg);
+}
+html[data-prefers-color-scheme='dark'] .ebscn-stock-keyboard-bottom .ebscn-stock-keyboard-right-delete:active {
+  background-color: var(--ebscn-color-keyboard-fckey-bg-active);
 }
 .ebscn-stock-keyboard {
   transform: translateY(101%);
@@ -10,14 +14,14 @@ html[data-prefers-color-scheme='dark'] .ebscn-stock-keyboard-bottom .ebscn-stock
   flex-direction: row;
   z-index: 999;
   width: 100%;
-  height: 252px;
+  height: 262px;
   transition: all 0.5s;
   align-content: flex-start;
   background-color: #fff;
   background-color: var(--ebscn-color-keyboard-bg);
 }
 .ebscn-stock-keyboard-top {
-  padding: 11px 19px 0 11px;
+  padding: 11px 19px 6px 11px;
   background-color: #fff;
   background-color: var(--ebscn-color-background);
   display: flex;
@@ -27,19 +31,31 @@ html[data-prefers-color-scheme='dark'] .ebscn-stock-keyboard-bottom .ebscn-stock
 }
 .ebscn-stock-keyboard-top-item {
   margin-right: 24px;
+  padding-bottom: 2px;
   color: #666;
   color: var(--ebscn-color-text-secondary);
   line-height: 21px;
+  border-bottom: 2px solid transparent;
 }
 .ebscn-stock-keyboard-top-item-active {
-  color: #e84225;
-  color: var(--ebscn-color-primary);
+  position: relative;
+}
+.ebscn-stock-keyboard-top-item-active::after {
+  content: "";
+  position: absolute;
+  bottom: -2px;
+  left: 8px;
+  width: 14px;
+  /* 固定宽度 */
+  height: 2px;
+  background: var(--ebscn-color-primary);
+  border-radius: 1px;
 }
 .ebscn-stock-keyboard-bottom {
   display: flex;
 }
 .ebscn-stock-keyboard-bottom .ebscn-stock-keyboard-right {
-  background-color: #d2d5d8;
+  background-color: #d3d5d8;
   background-color: var(--ebscn-color-keyboard-bg);
   display: flex;
   flex-wrap: wrap;
@@ -53,17 +69,16 @@ html[data-prefers-color-scheme='dark'] .ebscn-stock-keyboard-bottom .ebscn-stock
   background-color: var(--ebscn-color-primary);
   color: #fff;
 }
-.ebscn-stock-keyboard-bottom .ebscn-stock-keyboard-right-key,
-.ebscn-stock-keyboard-bottom .ebscn-stock-keyboard-right-confirmKey {
-  width: calc(25% - 7.5px);
+.ebscn-stock-keyboard-bottom .ebscn-stock-keyboard-right-key {
+  width: calc(25% - 8.5px);
   margin: 6px 3px 0 3px;
-  border-radius: 4.17px;
-  height: 48px;
-  line-height: 48px;
+  border-radius: 4px;
+  height: 46px;
+  line-height: 46px;
   text-align: center;
   font-weight: 400;
-}
-.ebscn-stock-keyboard-bottom .ebscn-stock-keyboard-right-key {
+  border: 0.5px solid #888;
+  border-color: var(--ebscn-color-keyboard-key-border);
   color: #333;
   color: var(--ebscn-color-text);
   font-size: 23px;
@@ -72,53 +87,54 @@ html[data-prefers-color-scheme='dark'] .ebscn-stock-keyboard-bottom .ebscn-stock
 }
 .ebscn-stock-keyboard-bottom .ebscn-stock-keyboard-right-key:active {
   background-color: #e5e5e5;
-  background-color: var(--ebscn-color-keyboard-active-background);
+  background-color: var(--ebscn-color-keyboard-key-bg-active);
 }
 .ebscn-stock-keyboard-bottom .ebscn-stock-keyboard-right-option {
-  font-size: 18px;
-  font-size: var(--ebscn-font-size-10);
+  font-size: 19px;
+  font-size: var(--ebscn-font-size-11);
   color: #333;
   color: var(--ebscn-color-text);
   background-color: #adb3bd;
-  background-color: var(--ebscn-color-functionkey-background);
+  background-color: var(--ebscn-color-keyboard-fckey-bg);
+  border-color: var(--ebscn-color-keyboard-fckey-border);
 }
 .ebscn-stock-keyboard-bottom .ebscn-stock-keyboard-right-option:active {
-  font-size: 18px;
-  font-size: var(--ebscn-font-size-10);
-  background-color: #e5e5e5;
-  background-color: var(--ebscn-color-keyboard-active-background);
+  background-color: #252525;
+  background-color: var(--ebscn-color-keyboard-fckey-bg-active);
 }
 .ebscn-stock-keyboard-bottom .ebscn-stock-keyboard-right-delete {
   background: url(../../assets/images/delete.png) no-repeat center;
   background-color: #adb3bd;
-  background-color: var(--ebscn-color-functionkey-background);
-  background-size: 24px 24px;
+  background-color: var(--ebscn-color-keyboard-fckey-bg);
+  background-size: 25px 25px;
+  border-color: var(--ebscn-color-keyboard-fckey-border);
 }
 .ebscn-stock-keyboard-bottom .ebscn-stock-keyboard-right-delete:active {
   background: url(../../assets/images/delete.png) no-repeat center;
-  background-color: #e5e5e5;
-  background-color: var(--ebscn-color-keyboard-active-background);
-  background-size: 24px 24px;
+  background-color: #252525;
+  background-color: var(--ebscn-color-keyboard-fckey-bg-active);
+  background-size: 25px 25px;
 }
 .ebscn-stock-keyboard-bottom .ebscn-stock-keyboard-right-confirmKey {
-  font-size: 18px;
-  font-size: var(--ebscn-font-size-10);
+  font-size: 19px;
+  font-size: var(--ebscn-font-size-11);
   width: calc(25% - 7.5px);
   background-color: #e84225;
   background-color: var(--ebscn-color-primary);
+  border-color: var(--ebscn-color-keyboard-fckey-border);
 }
 .ebscn-stock-keyboard-bottom .ebscn-stock-keyboard-right-confirmKey:active {
-  background-color: #D03B21;
+  background-color: #d13c21;
   color: #fff;
   color: var(--ebscn-color-white);
 }
 .ebscn-stock-keyboard-bottom .ebscn-stock-keyboard-right-bottom-option {
-  font-size: 18px;
-  font-size: var(--ebscn-font-size-10);
+  font-size: 19px;
+  font-size: var(--ebscn-font-size-11);
 }
 .ebscn-stock-keyboard-bottom .ebscn-stock-keyboard-left {
   width: 20%;
-  background-color: #d2d5d8;
+  background-color: #d3d5d8;
   background-color: var(--ebscn-color-keyboard-bg);
 }
 .ebscn-stock-keyboard-bottom .ebscn-stock-keyboard-left-key {
@@ -126,7 +142,7 @@ html[data-prefers-color-scheme='dark'] .ebscn-stock-keyboard-bottom .ebscn-stock
   align-items: center;
   justify-content: center;
   border-radius: 4.17px;
-  height: 48px;
+  height: 46px;
   margin: 6px 3px 6px 6px;
   font-size: 18px;
   font-size: var(--ebscn-font-size-10);
@@ -134,17 +150,19 @@ html[data-prefers-color-scheme='dark'] .ebscn-stock-keyboard-bottom .ebscn-stock
   text-align: center;
   color: #333;
   color: var(--ebscn-color-text);
-  line-height: 48px;
+  line-height: 46px;
   background-color: #adb3bd;
-  background-color: var(--ebscn-color-functionkey-background);
+  background-color: var(--ebscn-color-keyboard-fckey-bg);
+  border: 0.5px solid #888;
+  border-color: var(--ebscn-color-keyboard-fckey-border);
 }
 .ebscn-stock-keyboard-bottom .ebscn-stock-keyboard-left-key:active {
-  background-color: #e5e5e5;
-  background: var(--ebscn-color-keyboard-active-background);
+  background-color: #252525;
+  background: var(--ebscn-color-keyboard-fckey-bg-active);
 }
 @supports (bottom: env(safe-area-inset-bottom)) or (constant(safe-area-inset-bottom)) {
   .ebscn-stock-keyboard {
-    height: calc(252px + env(safe-area-inset-bottom));
-    height: calc(252px + constant(safe-area-inset-bottom));
+    height: calc(262px + env(safe-area-inset-bottom));
+    height: calc(262px + constant(safe-area-inset-bottom));
   }
 }

package/es/components/stock-keyboard/stock-keyboard.js

@@ -1,9 +1,8 @@
-import cns from "classnames";
-import { useEffect, useRef, useState } from "react";
-import React from "react";
+import cns from 'classnames';
+import React, { useEffect, useRef, useState } from 'react';
 import { withNativeProps } from '../../utils/native-props';
 import { mergeProps } from '../../utils/with-default-props';
-import { AlphabetKeyboard } from "./alphabet-keyboard";
+import { AlphabetKeyboard } from './alphabet-keyboard';
 var classPrefix = 'ebscn-stock-keyboard';
 var defaultProps = {
   visible: false
@@ -94,7 +93,7 @@ export function StockKeyboard(p) {
     className: "".concat(classPrefix, "-top-item")
   }, "\u4E2D\u6587")), keyboardType === 1 ? React.createElement("div", {
     className: "".concat(classPrefix, "-bottom")
-  }, "            ", React.createElement("div", {
+  }, ' ', React.createElement("div", {
     className: "".concat(classPrefix, "-left")
   }, leftKeys.map(function (item, index) {
     return React.createElement("div", {
@@ -111,7 +110,7 @@ export function StockKeyboard(p) {
   }, keys.map(function (item, index) {
     return React.createElement("div", {
       key: item || index,
-      className: cns(item !== '确定' ? "".concat(classPrefix, "-right-key") : "".concat(classPrefix, "-right-confirmKey"), item === 'ABC' || item === '002' ? "".concat(classPrefix, "-right-bottom-option") : '', typeof item !== 'number' && item !== 'ABC' && item !== '002' && item.length && item !== '.' && item !== '确定' ? "".concat(classPrefix, "-right-option") : item == '确定' ? "".concat(classPrefix, "-right-confirmKey") : "".concat(classPrefix, "-right-number-key"), item === 'X' && "".concat(classPrefix, "-right-delete")),
+      className: cns("".concat(classPrefix, "-right-key"), item !== '确定' ? '' : "".concat(classPrefix, "-right-key ").concat(classPrefix, "-right-confirmKey"), item === 'ABC' || item === '002' ? "".concat(classPrefix, "-right-bottom-option") : '', typeof item !== 'number' && item !== 'ABC' && item !== '002' && item.length && item !== '.' && item !== '确定' ? "".concat(classPrefix, "-right-option") : item == '确定' ? "".concat(classPrefix, "-right-confirmKey") : "".concat(classPrefix, "-right-number-key"), item === 'X' && "".concat(classPrefix, "-right-delete")),
       onClick: function () {
         if (visible) {
           onKeyPress(item);

package/es/components/switch/switch.css

@@ -44,7 +44,7 @@
   height: calc(var(--height) - 2 * var(--border-width));
   border-radius: calc(var(--height) - 2 * var(--border-width));
   box-sizing: border-box;
-  background: #E9E9EA;
+  background: #d8d8d8;
   z-index: 1;
   transition: all 200ms;
   transform: scale(1);
@@ -62,7 +62,6 @@
   top: var(--border-width);
   left: var(--border-width);
   transition: all 200ms;
-  box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.2), 0 2px 11.5px 0 rgba(0, 0, 0, 0.08), -1px 2px 2px 0 rgba(0, 0, 0, 0.1);
   color: var(--ebscn-color-primary);
 }
 .ebscn-switch-inner {
@@ -95,7 +94,7 @@
   opacity: 0.4;
 }
 .ebscn-switch.ebscn-switch-disabled:before {
-  background-color: #f4f4f4;
+  background-color: #e9e9ea;
 }
 .ebscn-switch-spin-icon {
   width: 14px;

package/es/components/tabs/tabs.css

@@ -12,6 +12,7 @@
   position: relative;
 }
 .ebscn-tabs-tab-list {
+  padding: 0 6px;
   display: flex;
   flex-wrap: nowrap;
   justify-content: flex-start;
@@ -24,7 +25,7 @@
   display: none;
 }
 .ebscn-tabs-tab-wrapper {
-  padding: 0 12px;
+  padding: 0 10px;
 }
 .ebscn-tabs-tab-wrapper-stretch {
   flex: auto;
@@ -35,12 +36,13 @@
   width: -webkit-min-content;
   width: min-content;
   margin: 0 auto;
-  font-size: var(--title-font-size);
+  font-size: 16px;
   position: relative;
   cursor: pointer;
   color: var(--ebscn-color-text-secondary);
 }
 .ebscn-tabs-tab-active {
+  font-weight: 500;
   color: var(--active-title-color);
 }
 .ebscn-tabs-tab-disabled {

package/es/components/tabs/tabs.js

@@ -122,13 +122,13 @@ export var Tabs = function (p) {
     var x = 0;
     var width = 0;
     if (props.activeLineMode === 'auto') {
-      x = activeTabLeft;
+      x = activeTabLeft - 6;
       width = activeTabWidth;
     } else if (props.activeLineMode === 'full') {
-      x = activeTabWrapperLeft;
+      x = activeTabWrapperLeft - 6;
       width = activeTabWrapperWidth;
     } else {
-      x = activeTabLeft + (activeTabWidth - activeLineWidth) / 2;
+      x = activeTabLeft + (activeTabWidth - activeLineWidth) / 2 - 6;
     }
     if (isRTL) {
       /**
@@ -242,7 +242,7 @@ export var Tabs = function (p) {
     ref: activeLineRef,
     className: "".concat(classPrefix, "-tab-line"),
     style: {
-      width: props.activeLineMode === 'fixed' ? 'var(--fixed-active-line-width, 15px)' : width,
+      width: props.activeLineMode === 'fixed' ? 'var(--fixed-active-line-width, 14px)' : width,
       x: x
     }
   }), panes.map(function (pane) {

package/es/global/global.css

@@ -21,7 +21,7 @@
   --ebscn-color-warning: #ff8f1f;
   --ebscn-color-danger: #ff3141;
   --ebscn-color-yellow: #ff9f18;
-  --ebscn-color-wathet: #FDECE9;
+  --ebscn-color-wathet: #fef4f2;
   --ebscn-color-text: #333333;
   --ebscn-color-text-secondary: #666666;
   --ebscn-color-weak: #999999;
@@ -30,7 +30,7 @@
   --ebscn-color-background: #ffffff;
   --ebscn-color-highlight: var(--ebscn-color-danger);
   --ebscn-color-white: #ffffff;
-  --ebscn-color-box: #f5f5f5;
+  --ebscn-color-box: #f8f9fc;
   --ebscn-color-text-light-solid: var(--ebscn-color-white);
   --ebscn-color-text-dark-solid: #000000;
   --ebscn-color-fill-content: var(--ebscn-color-box);
@@ -45,10 +45,13 @@
   --ebscn-color-golden: #b47816;
   --ebscn-color-grey: rgba(0, 0, 0, 0.7);
   --ebscn-color-split-line: #EBEBEB;
-  --ebscn-color-keyboard-bg: #d2d5d8;
+  --ebscn-color-keyboard-bg: #d3d5d8;
   --ebscn-color-keyboard-key-bg: #fff;
-  --ebscn-color-functionkey-background: #adb3bd;
-  --ebscn-color-keyboard-active-background: #e5e5e5;
+  --ebscn-color-keyboard-fckey-bg: #adb3bd;
+  --ebscn-color-keyboard-key-bg-active: #e5e5e5;
+  --ebscn-color-keyboard-fckey-bg-active: #9ba1aa;
+  --ebscn-color-keyboard-fckey-border: #888;
+  --ebscn-color-keyboard-key-border: #888;
 }
 html[data-prefers-color-scheme='dark'] {
   --ebscn-color-blue: #4c7cf1;
@@ -70,8 +73,11 @@ html[data-prefers-color-scheme='dark'] {
   --ebscn-color-split-line: #2B2B2B;
   --ebscn-color-keyboard-bg: #1a1a1a;
   --ebscn-color-keyboard-key-bg: #474747;
-  --ebscn-color-functionkey-background: #292929;
-  --ebscn-color-keyboard-active-background: #323232;
+  --ebscn-color-keyboard-fckey-bg: #292929;
+  --ebscn-color-keyboard-key-bg-active: #323232;
+  --ebscn-color-keyboard-fckey-bg-active: #252525;
+  --ebscn-color-keyboard-fckey-border: #111;
+  --ebscn-color-keyboard-key-border: #333;
 }
 :root {
   -webkit-tap-highlight-color: rgba(0, 0, 0, 0);