keyboard.min.css

.key-board{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);width:1535px;height:auto;border-radius:45px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;z-index:3000}.key-board .key-board-container{width:100%;height:100%;border-radius:45px;background:#ededed;box-shadow:0 0 20px rgba(0,0,0,.16);display:flex;flex-direction:column;align-items:center}.key-board .key-board-container .key-board-area{margin:50px 0;width:1435px;height:513px;background:#e0e0e0;border-radius:31px}.key-board .key-board-drag-handle{cursor:move;position:absolute;bottom:-50px;right:20px;background-image:url(https://www.cmappax.com/editorResource/keyboard/dragCH.svg);background-repeat:no-repeat;background-size:cover;background-position:50%;width:430px;height:75px;z-index:-1;display:flex;font-size:20px;font-weight:500;line-height:100px;letter-spacing:2px;text-indent:75px}.key-board .key-board-drag-handle span{max-width:300px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.key-board .key-board-drag-handle svg{position:absolute;right:55px;top:65%;transform:translateY(-50%);width:30px;height:30px}.key-board-modal{position:fixed;left:0;right:0;top:0;bottom:0;background:#000;opacity:.5;z-index:2999}.move-bottom-to-top-enter-active{-webkit-animation:moveFromTop .6s ease both;animation:moveFromTop .6s ease both}.move-bottom-to-top-leave-active{-webkit-animation:moveToTop .6s ease both;animation:moveToTop .6s ease both}@-webkit-keyframes moveFromTop{0%{transform:translate(-50%,100%)}}@keyframes moveFromTop{0%{transform:translate(-50%,100%)}}@-webkit-keyframes moveToTop{to{transform:translate(-50%,100%)}}@keyframes moveToTop{to{transform:translate(-50%,100%)}}.key-board-result[data-v-06151340]{width:1435px;height:139px;border-bottom:1px solid #707070;display:flex;flex-direction:column;align-items:center}.key-board-result .key-board-code-show[data-v-06151340]{margin-top:25px;width:100%;height:40px;background:#f5f5f5;border-radius:25px;font-size:32px;font-weight:400;line-height:40px;text-indent:12px}.key-board-result .key-board-result-show[data-v-06151340]{width:100%;display:flex;align-items:center;flex-wrap:nowrap;flex:1}.key-board-result .key-board-result-show .key-board-result-show-container[data-v-06151340]{display:flex;align-items:center;height:100%;width:95%;max-width:95%;overflow:hidden}.key-board-result .key-board-result-show .key-board-result-show-container span[data-v-06151340]{white-space:nowrap;font-size:40px;font-family:SimHei;font-weight:400;line-height:54px}.key-board-result .key-board-result-show .key-board-result-show-container span+span[data-v-06151340]{margin-left:40px}.key-board-result .key-board-result-show .key-board-result-show-more[data-v-06151340]{height:45px;flex:1;border-left:1px solid #707070;display:flex;flex-direction:column;align-items:center}.key-board-result .key-board-result-show .key-board-result-show-more span[data-v-06151340]{width:0;height:0;border:16px solid;border-color:transparent}.key-board-result .key-board-result-show .key-board-result-show-more span[data-v-06151340]:first-child{transform:translateY(-11px) rotate(180deg)}.key-board-result .key-board-result-show .key-board-result-show-more span[data-v-06151340]:nth-child(2){transform:translateY(-5px)}.svg-icon{fill:none!important}.key-board-button{padding:0;width:90px;height:90px;border-radius:50%;font-size:35px;text-align:center;font-weight:400;line-height:90px;outline:none;border:none;transition:all .35s;display:flex;justify-content:center;align-items:center}.key-board-button label{font-size:35px!important}.key-board-button svg{width:30px;height:30px}.key-board-button.key-board-button-close svg{width:50px;height:50px}.key-board-button.key-board-button-active svg,.key-board-button:hover svg{fill:none!important;stroke:#f5f5f5!important}.key-board-button.key-board-button-delete{width:230px;height:90px;border-radius:45px}.key-board-button.key-board-button-delete svg{width:65px;height:28px}.key-board-button.key-board-button-back svg{width:45px;height:45px}.key-board-button.key-board-button-change2lang,.key-board-button.key-board-button-change2num{width:135px;height:90px;border-radius:45px}.key-board-button.key-board-button-space{flex:1;height:90px;border-radius:45px}.key-board-button.key-board-button-change2lang,.key-board-button.key-board-button-change2num{font-size:30px}.default-key-board[data-v-a231d35c]{width:100%;height:100%;display:flex;flex-direction:column;align-items:center}.default-key-board .line[data-v-a231d35c]{height:90px;margin-top:10px;display:flex;align-items:center;justify-content:space-between;width:1350px}.default-key-board .line.line1[data-v-a231d35c]{margin-top:50px}.default-key-board .line.line2[data-v-a231d35c]{width:1210px}.default-key-board .line.line4[data-v-a231d35c]{margin-top:40px}.default-key-board .line.line4 .key-board-button+.key-board-button[data-v-a231d35c]{margin-left:40px}.hand-write-board[data-v-215b6372]{width:100%;height:100%;display:flex;align-items:center}.hand-write-board .paint-board[data-v-215b6372]{margin:0 35px;width:1185px;height:450px;background:#ededed;border-radius:30px}.hand-write-board .paint-board canvas[data-v-215b6372]{width:100%;height:100%}.hand-write-board .hand-write-board-opers[data-v-215b6372]{flex:1;height:450px;display:flex;flex-direction:column;justify-content:space-between}.hand-write-board .hand-write-board-opers .key-board-button[data-v-215b6372]{width:135px;height:90px;border-radius:45px}