@xysfe/actui
Version:
A fantastic mobile ui lib implement by Vue
1 lines • 19 kB
CSS
.act-popup{position:fixed;left:0;right:0;top:0;bottom:0;max-width:100vw;content:"viewport-units-buggyfill; max-width: 100vw"}.act-popup-container,.act-popup-mask{position:absolute;width:100%;height:100%}.act-popup-mask{overflow:hidden}.act-popup-mask:before{content:".";display:block;width:1px;height:1px;background-color:rgba(0,0,0,.1);margin-left:-10px}.act-popup-container{-webkit-transform:translate(100%,100%);transform:translate(100%,100%)}.act-popup-content{position:absolute;top:0;left:0;width:100%;box-sizing:border-box;-webkit-transform:translate(-100%,-100%);transform:translate(-100%,-100%)}.act-popup-center .act-popup-content{position:absolute;top:-50%;left:-50%;width:auto;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}.act-popup-top-radius{border-top-left-radius:12px;border-top-right-radius:12px}.act-popup-top-radius.act-popup-content{overflow:hidden}.act-loading[data-v-027695fc]{overflow:hidden}[class*=loading-cont-][data-v-027695fc]{color:inherit;box-sizing:content-box;pointer-events:none;margin:0 auto}.loading-cont-cir1[data-v-027695fc]{border-left-color:currentcolor;border-right-color:currentcolor;border-radius:50%;-webkit-animation:1s loading-cir1-data-v-027695fc linear infinite;animation:1s loading-cir1-data-v-027695fc linear infinite}@-webkit-keyframes loading-cir1-data-v-027695fc{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes loading-cir1-data-v-027695fc{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}.act-loading[data-v-1e0cc706]{overflow:hidden}[class*=loading-cont-][data-v-1e0cc706]{color:inherit;box-sizing:content-box;pointer-events:none;margin:0 auto}.loading-cont-cir2[data-v-1e0cc706]{position:relative;border-radius:100%;-webkit-animation:1s loading-cir2-data-v-1e0cc706 linear infinite;animation:1s loading-cir2-data-v-1e0cc706 linear infinite}@-webkit-keyframes loading-cir2-data-v-1e0cc706{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes loading-cir2-data-v-1e0cc706{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}.act-loading[data-v-4106ba04]{overflow:hidden}.act-loading .act-loading-wrap[data-v-4106ba04]{border-radius:3px;-webkit-transition:color .3s,border .3s;transition:color .3s,border .3s}[class*=loading-cont-][data-v-4106ba04]{color:inherit;box-sizing:content-box;pointer-events:none;margin:0 auto}.loading-cont-cir3[data-v-4106ba04]{position:relative;border-radius:50%;-webkit-animation:1s loading-cir3-data-v-4106ba04 linear infinite;animation:1s loading-cir3-data-v-4106ba04 linear infinite}.loading-cont-cir3 .cir3-mask[data-v-4106ba04]{display:block;position:absolute;border-radius:50%;opacity:.5}@-webkit-keyframes loading-cir3-data-v-4106ba04{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes loading-cir3-data-v-4106ba04{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}.act-loading[data-v-6400ad02]{overflow:hidden}[class*=loading-cont-][data-v-6400ad02]{color:inherit;box-sizing:content-box;pointer-events:none}.loading-cont-cir4[data-v-6400ad02],.loading-cont-cir4[data-v-6400ad02]:after,.loading-cont-cir4[data-v-6400ad02]:before{border-radius:50%;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation:loading-cir4-data-v-6400ad02 1.2s infinite ease-in-out;animation:loading-cir4-data-v-6400ad02 1.2s infinite ease-in-out}.loading-cont-cir4[data-v-6400ad02]{color:currentcolor;position:relative;-webkit-transform:translateZ(0);transform:translateZ(0);-webkit-animation-delay:-.16s;animation-delay:-.16s;top:-1em;margin:0 auto}.loading-cont-cir4[data-v-6400ad02]:before{right:100%;-webkit-animation-delay:-.32s;animation-delay:-.32s}.loading-cont-cir4[data-v-6400ad02]:after{left:100%}.loading-cont-cir4[data-v-6400ad02]:after,.loading-cont-cir4[data-v-6400ad02]:before{content:"";display:block;position:absolute;top:0;width:inherit;height:inherit}@-webkit-keyframes loading-cir4-data-v-6400ad02{0%,80%,to{box-shadow:0 1.1em 0 -1em}40%{box-shadow:0 1.1em 0 -.2em}}@keyframes loading-cir4-data-v-6400ad02{0%,80%,to{box-shadow:0 1.1em 0 -1em}40%{box-shadow:0 1.1em 0 -.2em}}.act-loading[data-v-86faa000]{overflow:hidden}[class*=loading-cont-][data-v-86faa000]{color:inherit;box-sizing:content-box;pointer-events:none}.loading-cont-cir5[data-v-86faa000]{position:relative;border-radius:50%;box-shadow:0 1em 0 -.2em currentcolor;-webkit-animation:loading-cir5-data-v-86faa000 .5s ease-in-out alternate infinite;animation:loading-cir5-data-v-86faa000 .5s ease-in-out alternate infinite;-webkit-animation-delay:.16s;animation-delay:.16s;top:-1em;margin:0 auto}.loading-cont-cir5[data-v-86faa000]:after,.loading-cont-cir5[data-v-86faa000]:before{content:"";position:absolute;width:inherit;height:inherit;border-radius:inherit;box-shadow:inherit;-webkit-animation:inherit;animation:inherit}.loading-cont-cir5[data-v-86faa000]:before{left:-.8em;-webkit-animation-delay:.32s;animation-delay:.32s}.loading-cont-cir5[data-v-86faa000]:after{right:-.8em;-webkit-animation-delay:0s;animation-delay:0s}@-webkit-keyframes loading-cir5-data-v-86faa000{0%{box-shadow:0 1.4em 0 -.2em currentcolor}to{box-shadow:0 .8em 0 -.2em currentcolor}}@keyframes loading-cir5-data-v-86faa000{0%{box-shadow:0 1.4em 0 -.2em currentcolor}to{box-shadow:0 .8em 0 -.2em currentcolor}}.act-xysloading-path[data-v-073ac538]{stroke-dasharray:134.8 5000;stroke-dashoffset:134.8;-webkit-animation:dash-logo-data-v-073ac538 3.6s linear infinite;animation:dash-logo-data-v-073ac538 3.6s linear infinite}@-webkit-keyframes dash-logo-data-v-073ac538{0%{stroke-dashoffset:134.8}15%,45%{stroke-dashoffset:0}56%,to{stroke-dashoffset:-134.8}}@keyframes dash-logo-data-v-073ac538{0%{stroke-dashoffset:134.8}15%,45%{stroke-dashoffset:0}56%,to{stroke-dashoffset:-134.8}}.act-xysloading-path-oval-middle[data-v-073ac538]{stroke-dasharray:0 44.1;stroke-dashoffset:0;-webkit-animation:dash-oval-middle-data-v-073ac538 3.6s linear infinite;animation:dash-oval-middle-data-v-073ac538 3.6s linear infinite}@-webkit-keyframes dash-oval-middle-data-v-073ac538{0%,56%{visibility:hidden}56.1%{stroke-dasharray:4,40.1;stroke-dashoffset:0;stroke-linecap:round;visibility:visible}59.9%{stroke-dasharray:4,40.1;stroke-dashoffset:-40.1;stroke-linecap:round}60%,to{stroke-dasharray:0,44.1;stroke-dashoffset:-44.1;stroke-linecap:butt;visibility:hidden}}@keyframes dash-oval-middle-data-v-073ac538{0%,56%{visibility:hidden}56.1%{stroke-dasharray:4,40.1;stroke-dashoffset:0;stroke-linecap:round;visibility:visible}59.9%{stroke-dasharray:4,40.1;stroke-dashoffset:-40.1;stroke-linecap:round}60%,to{stroke-dasharray:0,44.1;stroke-dashoffset:-44.1;stroke-linecap:butt;visibility:hidden}}.act-xysloading-circle[data-v-073ac538]{stroke-width:7;fill:none;-webkit-animation:dash-circle-data-v-073ac538 3.6s linear infinite;animation:dash-circle-data-v-073ac538 3.6s linear infinite}@-webkit-keyframes dash-circle-data-v-073ac538{0%,60%{stroke-dasharray:0,226;stroke-dashoffset:0;stroke-linecap:butt;visibility:hidden}60.1%{stroke-dasharray:0,226;stroke-dashoffset:0;stroke-linecap:round;visibility:visible}70%{stroke-dasharray:70,156;stroke-dashoffset:-80;stroke-linecap:round}80%{stroke-dasharray:2,224;stroke-dashoffset:-226;stroke-linecap:round}90%{stroke-dasharray:70,196;stroke-dashoffset:-339;stroke-linecap:round}94.9%{stroke-dasharray:0,226;stroke-dashoffset:-400;stroke-linecap:round}95%,to{stroke-dasharray:0,226;stroke-dashoffset:-400;stroke-linecap:butt;visibility:hidden}}@keyframes dash-circle-data-v-073ac538{0%,60%{stroke-dasharray:0,226;stroke-dashoffset:0;stroke-linecap:butt;visibility:hidden}60.1%{stroke-dasharray:0,226;stroke-dashoffset:0;stroke-linecap:round;visibility:visible}70%{stroke-dasharray:70,156;stroke-dashoffset:-80;stroke-linecap:round}80%{stroke-dasharray:2,224;stroke-dashoffset:-226;stroke-linecap:round}90%{stroke-dasharray:70,196;stroke-dashoffset:-339;stroke-linecap:round}94.9%{stroke-dasharray:0,226;stroke-dashoffset:-400;stroke-linecap:round}95%,to{stroke-dasharray:0,226;stroke-dashoffset:-400;stroke-linecap:butt;visibility:hidden}}.act-xysloading-path-oval-end[data-v-073ac538]{stroke-dasharray:0 54.4;stroke-dashoffset:0;-webkit-animation:dash-oval-end-data-v-073ac538 3.6s linear infinite;animation:dash-oval-end-data-v-073ac538 3.6s linear infinite}@-webkit-keyframes dash-oval-end-data-v-073ac538{0%,95%{stroke-dasharray:0,54.4;stroke-dashoffset:0;stroke-linecap:butt;visibility:hidden}95.1%{stroke-dasharray:4,50.4;stroke-dashoffset:0;stroke-linecap:round;visibility:visible}99.9%{stroke-dasharray:4,50.4;stroke-dashoffset:-40.1;stroke-linecap:round}to{stroke-dasharray:0,54.4;stroke-dashoffset:-54.4;stroke-linecap:butt;visibility:hidden}}@keyframes dash-oval-end-data-v-073ac538{0%,95%{stroke-dasharray:0,54.4;stroke-dashoffset:0;stroke-linecap:butt;visibility:hidden}95.1%{stroke-dasharray:4,50.4;stroke-dashoffset:0;stroke-linecap:round;visibility:visible}99.9%{stroke-dasharray:4,50.4;stroke-dashoffset:-40.1;stroke-linecap:round}to{stroke-dasharray:0,54.4;stroke-dashoffset:-54.4;stroke-linecap:butt;visibility:hidden}}.act-loading[data-v-4884e2ea]{overflow:hidden}[class*=loading-cont-][data-v-4884e2ea]{color:inherit;box-sizing:content-box;pointer-events:none}.loading-cont-line[data-v-4884e2ea]{position:relative;background:currentcolor;-webkit-animation:loading-line-data-v-4884e2ea .7s ease-in-out infinite;animation:loading-line-data-v-4884e2ea .7s ease-in-out infinite;-webkit-animation-delay:.4s;animation-delay:.4s;top:50%;left:50%;-webkit-transform:translate3D(-50%,-50%,0);transform:translate3D(-50%,-50%,0)}.loading-cont-line[data-v-4884e2ea]:after,.loading-cont-line[data-v-4884e2ea]:before{content:"";position:absolute;width:inherit;height:inherit;background:inherit;-webkit-animation:inherit;animation:inherit}.loading-cont-line[data-v-4884e2ea]:before{right:.4em;-webkit-animation-delay:.2s;animation-delay:.2s}.loading-cont-line[data-v-4884e2ea]:after{left:.4em;-webkit-animation-delay:.6s;animation-delay:.6s}@-webkit-keyframes loading-line-data-v-4884e2ea{0%,to{box-shadow:0 0 0 currentcolor,0 0 0 currentcolor}50%{box-shadow:0 -.25em 0 currentcolor,0 .25em 0 currentcolor}}@keyframes loading-line-data-v-4884e2ea{0%,to{box-shadow:0 0 0 currentcolor,0 0 0 currentcolor}50%{box-shadow:0 -.25em 0 currentcolor,0 .25em 0 currentcolor}}.act-jigsaw-content[data-v-5fc92995]{background-color:#fff;padding:18px;position:absolute;width:78%;max-width:675px;left:50%;top:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);border-radius:12px}.act-jigsaw-title[data-v-5fc92995]{text-align:center;color:#000;font-size:19px}.act-jigsaw-desc[data-v-5fc92995]{font-size:12px;color:#999;text-align:center;font-weight:400;padding:2px 0 10px}.act-jigsaw-close[data-v-5fc92995]{width:40px;height:40px;position:absolute;right:0;top:0;-webkit-transform:rotate(45deg);transform:rotate(45deg)}.act-jigsaw-close[data-v-5fc92995]:after,.act-jigsaw-close[data-v-5fc92995]:before{content:"";background-color:#b5b8bd;position:absolute;border-radius:2px}.act-jigsaw-close[data-v-5fc92995]:before{width:14px;height:2px;left:50%;top:50%;margin-left:-7px;margin-top:-1px}.act-jigsaw-close[data-v-5fc92995]:after{width:2px;height:14px;left:50%;top:50%;margin-left:-1px;margin-top:-7px}.act-jigsaw-content[data-v-2b8c450e]{background-color:#fff;padding:18px;position:absolute;width:78%;max-width:675px;left:50%;top:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);border-radius:12px}.act-jigsaw-content.act-pc[data-v-2b8c450e]{width:338px}.act-jigsaw-content.act-pc .act-jigsaw-title[data-v-2b8c450e]{font-weight:400;font-size:21px}.act-jigsaw-content.act-pc .act-jigsaw-desc[data-v-2b8c450e]{font-size:15px;padding:5px 0 18px}.act-jigsaw-content.act-pc .jigsaw .slider-img[data-v-2b8c450e]{border-radius:4px}.act-jigsaw-title[data-v-2b8c450e]{text-align:center;color:#000;font-size:19px}.act-jigsaw-desc[data-v-2b8c450e]{font-size:12px;color:#999;text-align:center;font-weight:400;padding:2px 0 10px}.act-jigsaw-close[data-v-2b8c450e]{width:40px;height:40px;position:absolute;right:0;top:0;-webkit-transform:rotate(45deg);transform:rotate(45deg)}.act-jigsaw-close[data-v-2b8c450e]:after,.act-jigsaw-close[data-v-2b8c450e]:before{content:"";background-color:#b5b8bd;position:absolute;border-radius:2px}.act-jigsaw-close[data-v-2b8c450e]:before{width:14px;height:2px;left:50%;top:50%;margin-left:-7px;margin-top:-1px}.act-jigsaw-close[data-v-2b8c450e]:after{width:2px;height:14px;left:50%;top:50%;margin-left:-1px;margin-top:-7px}.act-jigsaw[data-v-6ac6a5a2]{position:relative}.act-jigsaw .act-jigsaw-img[data-v-6ac6a5a2]{position:relative;width:100%;height:0;padding-bottom:57.35%;background-color:#e4e4e4}.act-jigsaw .slider-img[data-v-6ac6a5a2]{width:100%;height:100%;position:absolute;left:0;top:0}.act-jigsaw .img-loading[data-v-6ac6a5a2]{position:absolute;left:50%;top:50%;z-index:4;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}.act-jigsaw .icon-refresh[data-v-6ac6a5a2]{width:30px;height:30px}.act-jigsaw .img-error[data-v-6ac6a5a2]{text-align:center;cursor:pointer;position:absolute;left:50%;top:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}.act-jigsaw .img-error p[data-v-6ac6a5a2]{white-space:nowrap;margin-bottom:10px}.act-jigsaw .slider-piece[data-v-6ac6a5a2]{position:absolute;left:0;top:0}.act-jigsaw .slider-piece img[data-v-6ac6a5a2]{width:100%}.act-jigsaw .act-jigsaw-track[data-v-6ac6a5a2]{position:relative;margin-top:20px;text-align:center;height:22px;padding-top:6px;box-sizing:border-box}.act-jigsaw .act-jigsaw-track .bar[data-v-6ac6a5a2]{height:10px;border-radius:10px;background-color:#f0f0f0}.act-jigsaw .act-jigsaw-track .track-wrap[data-v-6ac6a5a2]{width:45px;height:22px;position:absolute;left:0;top:0}.act-jigsaw .act-jigsaw-track .slider-track[data-v-6ac6a5a2]{width:45px;height:22px;background-color:#8c7fee;border-radius:22px;box-shadow:0 5px 10px 0 rgba(140,127,238,.4)}.act-jigsaw .act-jigsaw-track .track[data-v-6ac6a5a2]{white-space:nowrap;position:absolute;left:50%;top:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);font-size:0}.act-jigsaw .act-jigsaw-track .track .line[data-v-6ac6a5a2]{display:inline-block;width:2px;height:8px;border-radius:3px;background-color:#fff;margin:0 3px 0 2px}.act-jigsaw .shake[data-v-6ac6a5a2]{-webkit-animation:shake-data-v-6ac6a5a2 .15s ease-in;animation:shake-data-v-6ac6a5a2 .15s ease-in}.act-jigsaw .smooth[data-v-6ac6a5a2]{-webkit-transition:all .3s;transition:all .3s}@-webkit-keyframes shake-data-v-6ac6a5a2{0%{-webkit-transform:translateX(0);transform:translateX(0)}25%{-webkit-transform:translateX(-3px);transform:translateX(-3px)}50%{-webkit-transform:translateX(0);transform:translateX(0)}75%{-webkit-transform:translateX(3px);transform:translateX(3px)}to{-webkit-transform:translateX(0);transform:translateX(0)}}@keyframes shake-data-v-6ac6a5a2{0%{-webkit-transform:translateX(0);transform:translateX(0)}25%{-webkit-transform:translateX(-3px);transform:translateX(-3px)}50%{-webkit-transform:translateX(0);transform:translateX(0)}75%{-webkit-transform:translateX(3px);transform:translateX(3px)}to{-webkit-transform:translateX(0);transform:translateX(0)}}.cancel-dialog[data-v-550d9670],.code-dialog[data-v-550d9670]{position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);line-height:1;width:290px;background-color:#fff;border-radius:8px}.cancel-dialog-close[data-v-550d9670],.code-dialog-close[data-v-550d9670]{display:block;position:absolute;top:0;right:0;padding:13px 13px 0 0}.cancel-dialog-close i[data-v-550d9670],.code-dialog-close i[data-v-550d9670]{position:relative;display:block;width:12px;height:12px}.cancel-dialog-close i[data-v-550d9670]:after,.cancel-dialog-close i[data-v-550d9670]:before,.code-dialog-close i[data-v-550d9670]:after,.code-dialog-close i[data-v-550d9670]:before{position:absolute;content:"";width:12px;height:2px;background:#b3b3b3;top:4.28571px;border-radius:1px;left:1.71429px}.cancel-dialog-close i[data-v-550d9670]:before,.code-dialog-close i[data-v-550d9670]:before{-webkit-transform:rotate(45deg);transform:rotate(45deg)}.cancel-dialog-close i[data-v-550d9670]:after,.code-dialog-close i[data-v-550d9670]:after{-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}.cancel-dialog-title[data-v-550d9670],.code-dialog-title[data-v-550d9670]{display:-webkit-box;text-overflow:ellipsis;-webkit-box-orient:vertical;-webkit-line-clamp:2;font-size:18px;line-height:26px;font-weight:700;color:#3c3c3c;text-align:center;padding:18px 17px 0;overflow:hidden}.cancel-dialog-content[data-v-550d9670],.code-dialog-content[data-v-550d9670]{padding:15px 17px}.cancel-dialog-text[data-v-550d9670],.code-dialog-text[data-v-550d9670]{font-size:15px;line-height:22px;color:#333;word-break:break-all}.cancel-dialog-remarks[data-v-550d9670]{font-size:14px;color:#333;padding:8px 14px;line-height:22px;background-color:#f7f8fc;border-radius:8px;margin-top:10px;word-break:break-all}.cancel-dialog-tips[data-v-550d9670]{font-size:12px;color:#999;line-height:18px;margin-top:10px}.cancel-dialog-tips-icon[data-v-550d9670]{margin-right:2px}.cancel-dialog-title+.cancel-dialog-content[data-v-550d9670]{padding-top:4px}.cancel-dialog-btn[data-v-550d9670]{display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-pack:center;-webkit-justify-content:center;justify-content:center;text-align:center;font-size:16px}.cancel-btn-item[data-v-550d9670]{-webkit-box-flex:1;-webkit-flex:1;flex:1;position:relative;border-top:1px solid #f9f9f9;padding:13px 0 15px;color:#999}.cancel-btn-item[data-v-550d9670]:nth-child(2n):before{position:absolute;top:50%;left:0;-webkit-transform:translateY(-50%);transform:translateY(-50%);content:"";display:block;width:1px;height:16px;background-color:#f5f5f5}.cancel-dialog-btn-right[data-v-550d9670]{color:#8c7fee}.code-dialog-action[data-v-550d9670]{margin:12px 0 14px;width:100%;padding:3px 12px;background:#f7f8fc;border-radius:3px;display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-align:center;-webkit-align-items:center;align-items:center}.code-dialog-action .code-dialog-input[data-v-550d9670]{font-size:15px;height:40px;background:#f7f8fc;line-height:40px;width:100%;margin-right:8px;border:none;color:#333;padding:0 5px}.code-dialog-action .code-dialog-sendBtn[data-v-550d9670]{font-size:12px;min-width:70px;text-align:center}.code-dialog-submitBtn[data-v-550d9670]{font-size:16px;color:#fff;background-color:#8c7fee;height:40px;display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-align:center;-webkit-align-items:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;justify-content:center;border-radius:22px}