diff --git a/index.css b/index.css index a6af380..d4c7166 100644 --- a/index.css +++ b/index.css @@ -1 +1,813 @@ -#root,body,html{height:100%;font-family:"Monospaced Number","Chinese Quote",-apple-system,"Segoe UI",Roboto,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Helvetica Neue",Helvetica,Arial,sans-serif;color:#333;font-size:14px}body{background-color:#fff!important}*{margin:0;padding:0;-webkit-box-sizing:border-box;box-sizing:border-box}.block-horizontal-layout,.display-flex{display:-ms-flexbox;display:flex}.block-horizontal-layout{-ms-flex-flow:row;flex-flow:row}.block-vertical-layout{display:-ms-flexbox;display:flex;-ms-flex-flow:column;flex-flow:column}.block-flow-layout{display:-ms-flexbox;display:flex;-ms-flex-flow:wrap;flex-flow:wrap}.block-justify-start{-ms-flex-pack:start;justify-content:flex-start}.block-justify-center{-ms-flex-pack:center;justify-content:center}.block-justify-end{-ms-flex-pack:end;justify-content:flex-end}.block-justify-around{-ms-flex-pack:distribute;justify-content:space-around}.block-justify-between{-ms-flex-pack:justify;justify-content:space-between}.block-align-start{-webkit-align-items:flex-start;-webkit-box-pack:start;-ms-flex-align:start;align-items:flex-start}.block-align-center{-webkit-align-items:center;-webkit-box-pack:center;-ms-flex-align:center;align-items:center}.block-align-end{-webkit-align-items:flex-end;-webkit-box-pack:end;-ms-flex-align:end;align-items:flex-end}.dxc-input-container{color:#333;font-size:14px}.dxc-input-box{margin-left:10px;overflow:hidden;border-radius:4px;border:1px solid #ddd}.dxc-input-box input{min-width:0;border:0;-webkit-box-sizing:border-box;box-sizing:border-box;outline:none}.dxc-input-box input,.dxc-select{padding-left:10px;padding-right:10px;height:35px}.dxc-select{background:#fff}.dxc-input-box input::-webkit-input-placeholder{color:#999;padding-top:2px}/*! normalize.css v7.0.0 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}article,aside,footer,header,nav,section{display:block}h1{font-size:2em;margin:.67em 0}figcaption,figure,main{display:block}figure{margin:1em 40px}hr{-webkit-box-sizing:content-box;box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent;-webkit-text-decoration-skip:objects}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}b,strong{font-weight:inherit;font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}dfn{font-style:italic}mark{background-color:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}audio,video{display:inline-block}audio:not([controls]){display:none;height:0}img{border-style:none}svg:not(:root){overflow:hidden}button,input,optgroup,select,textarea{font-family:sans-serif;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=reset],[type=submit],button,html [type=button]{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{-webkit-box-sizing:border-box;box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{display:inline-block;vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{-webkit-box-sizing:border-box;box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-cancel-button,[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details,menu{display:block}summary{display:list-item}canvas{display:inline-block}[hidden],template{display:none}.am-fade-appear,.am-fade-enter{opacity:0}.am-fade-appear,.am-fade-enter,.am-fade-leave{-webkit-animation-duration:.2s;animation-duration:.2s;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-timing-function:cubic-bezier(.55,0,.55,.2);animation-timing-function:cubic-bezier(.55,0,.55,.2);-webkit-animation-play-state:paused;animation-play-state:paused}.am-fade-appear.am-fade-appear-active,.am-fade-enter.am-fade-enter-active{-webkit-animation-name:amFadeIn;animation-name:amFadeIn;-webkit-animation-play-state:running;animation-play-state:running}.am-fade-leave.am-fade-leave-active{-webkit-animation-name:amFadeOut;animation-name:amFadeOut;-webkit-animation-play-state:running;animation-play-state:running}@-webkit-keyframes amFadeIn{0%{opacity:0}to{opacity:1}}@keyframes amFadeIn{0%{opacity:0}to{opacity:1}}@-webkit-keyframes amFadeOut{0%{opacity:1}to{opacity:0}}@keyframes amFadeOut{0%{opacity:1}to{opacity:0}}.am-slide-up-appear,.am-slide-up-enter{-webkit-transform:translateY(100%);transform:translateY(100%)}.am-slide-up-appear,.am-slide-up-enter,.am-slide-up-leave{-webkit-animation-duration:.2s;animation-duration:.2s;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-timing-function:cubic-bezier(.55,0,.55,.2);animation-timing-function:cubic-bezier(.55,0,.55,.2);-webkit-animation-play-state:paused;animation-play-state:paused}.am-slide-up-appear.am-slide-up-appear-active,.am-slide-up-enter.am-slide-up-enter-active{-webkit-animation-name:amSlideUpIn;animation-name:amSlideUpIn;-webkit-animation-play-state:running;animation-play-state:running}.am-slide-up-leave.am-slide-up-leave-active{-webkit-animation-name:amSlideUpOut;animation-name:amSlideUpOut;-webkit-animation-play-state:running;animation-play-state:running}@-webkit-keyframes amSlideUpIn{0%{-webkit-transform:translateY(100%);transform:translateY(100%)}to{-webkit-transform:translate(0);transform:translate(0)}}@keyframes amSlideUpIn{0%{-webkit-transform:translateY(100%);transform:translateY(100%)}to{-webkit-transform:translate(0);transform:translate(0)}}@-webkit-keyframes amSlideUpOut{0%{-webkit-transform:translate(0);transform:translate(0)}to{-webkit-transform:translateY(100%);transform:translateY(100%)}}@keyframes amSlideUpOut{0%{-webkit-transform:translate(0);transform:translate(0)}to{-webkit-transform:translateY(100%);transform:translateY(100%)}}.am.am-zoom-enter,.am.am-zoom-leave{display:block}.am-zoom-appear,.am-zoom-enter{opacity:0;-webkit-animation-duration:.2s;animation-duration:.2s;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-timing-function:cubic-bezier(.55,0,.55,.2);animation-timing-function:cubic-bezier(.55,0,.55,.2);-webkit-animation-timing-function:cubic-bezier(.18,.89,.32,1.28);animation-timing-function:cubic-bezier(.18,.89,.32,1.28);-webkit-animation-play-state:paused;animation-play-state:paused}.am-zoom-leave{-webkit-animation-duration:.2s;animation-duration:.2s;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-timing-function:cubic-bezier(.55,0,.55,.2);animation-timing-function:cubic-bezier(.55,0,.55,.2);-webkit-animation-timing-function:cubic-bezier(.6,-.3,.74,.05);animation-timing-function:cubic-bezier(.6,-.3,.74,.05);-webkit-animation-play-state:paused;animation-play-state:paused}.am-zoom-appear.am-zoom-appear-active,.am-zoom-enter.am-zoom-enter-active{-webkit-animation-name:amZoomIn;animation-name:amZoomIn;-webkit-animation-play-state:running;animation-play-state:running}.am-zoom-leave.am-zoom-leave-active{-webkit-animation-name:amZoomOut;animation-name:amZoomOut;-webkit-animation-play-state:running;animation-play-state:running}@-webkit-keyframes amZoomIn{0%{opacity:0;-webkit-transform-origin:50% 50%;transform-origin:50% 50%;-webkit-transform:scale(0);transform:scale(0)}to{opacity:1;-webkit-transform-origin:50% 50%;transform-origin:50% 50%;-webkit-transform:scale(1);transform:scale(1)}}@keyframes amZoomIn{0%{opacity:0;-webkit-transform-origin:50% 50%;transform-origin:50% 50%;-webkit-transform:scale(0);transform:scale(0)}to{opacity:1;-webkit-transform-origin:50% 50%;transform-origin:50% 50%;-webkit-transform:scale(1);transform:scale(1)}}@-webkit-keyframes amZoomOut{0%{opacity:1;-webkit-transform-origin:50% 50%;transform-origin:50% 50%;-webkit-transform:scale(1);transform:scale(1)}to{opacity:0;-webkit-transform-origin:50% 50%;transform-origin:50% 50%;-webkit-transform:scale(0);transform:scale(0)}}@keyframes amZoomOut{0%{opacity:1;-webkit-transform-origin:50% 50%;transform-origin:50% 50%;-webkit-transform:scale(1);transform:scale(1)}to{opacity:0;-webkit-transform-origin:50% 50%;transform-origin:50% 50%;-webkit-transform:scale(0);transform:scale(0)}}.am-slide-down-appear,.am-slide-down-enter{-webkit-transform:translateY(-100%);transform:translateY(-100%)}.am-slide-down-appear,.am-slide-down-enter,.am-slide-down-leave{-webkit-animation-duration:.2s;animation-duration:.2s;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-timing-function:cubic-bezier(.55,0,.55,.2);animation-timing-function:cubic-bezier(.55,0,.55,.2);-webkit-animation-play-state:paused;animation-play-state:paused}.am-slide-down-appear.am-slide-down-appear-active,.am-slide-down-enter.am-slide-down-enter-active{-webkit-animation-name:amSlideDownIn;animation-name:amSlideDownIn;-webkit-animation-play-state:running;animation-play-state:running}.am-slide-down-leave.am-slide-down-leave-active{-webkit-animation-name:amSlideDownOut;animation-name:amSlideDownOut;-webkit-animation-play-state:running;animation-play-state:running}@-webkit-keyframes amSlideDownIn{0%{-webkit-transform:translateY(-100%);transform:translateY(-100%)}to{-webkit-transform:translate(0);transform:translate(0)}}@keyframes amSlideDownIn{0%{-webkit-transform:translateY(-100%);transform:translateY(-100%)}to{-webkit-transform:translate(0);transform:translate(0)}}@-webkit-keyframes amSlideDownOut{0%{-webkit-transform:translate(0);transform:translate(0)}to{-webkit-transform:translateY(-100%);transform:translateY(-100%)}}@keyframes amSlideDownOut{0%{-webkit-transform:translate(0);transform:translate(0)}to{-webkit-transform:translateY(-100%);transform:translateY(-100%)}}*,:after,:before{-webkit-tap-highlight-color:rgba(0,0,0,0)}body{background-color:#f5f5f9;font-size:14px}[contenteditable]{-webkit-user-select:auto!important}:focus,a{outline:none}a{background:transparent;text-decoration:none}.am-picker-col{display:block;position:relative;height:238px;overflow:hidden;width:100%}.am-picker-col-content{position:absolute;left:0;top:0;width:100%;z-index:1;padding:102px 0}.am-picker-col-item{-ms-touch-action:manipulation;touch-action:manipulation;text-align:center;font-size:16px;height:34px;line-height:34px;color:#000;white-space:nowrap;text-overflow:ellipsis}.am-picker-col-item-selected{font-size:17px}.am-picker-col-mask{top:0;height:100%;margin:0 auto;background-image:-webkit-gradient(linear,left top,left bottom,from(hsla(0,0%,100%,.95)),to(hsla(0,0%,100%,.6))),-webkit-gradient(linear,left bottom,left top,from(hsla(0,0%,100%,.95)),to(hsla(0,0%,100%,.6)));background-image:linear-gradient(180deg,hsla(0,0%,100%,.95),hsla(0,0%,100%,.6)),linear-gradient(0deg,hsla(0,0%,100%,.95),hsla(0,0%,100%,.6));background-position:top,bottom;background-size:100% 102px;background-repeat:no-repeat}.am-picker-col-indicator,.am-picker-col-mask{position:absolute;left:0;width:100%;z-index:3}.am-picker-col-indicator{-webkit-box-sizing:border-box;box-sizing:border-box;height:34px;top:102px;border-top:1px solid #ddd;border-bottom:1px solid #ddd}@media (-webkit-min-device-pixel-ratio:2),(min-resolution:2dppx){html:not([data-scale]) .am-picker-col-indicator{border-top:none}html:not([data-scale]) .am-picker-col-indicator:before{content:"";position:absolute;background-color:#ddd;display:block;z-index:1;top:0;right:auto;bottom:auto;left:0;width:100%;height:1px;-webkit-transform-origin:50% 50%;transform-origin:50% 50%;-webkit-transform:scaleY(.5);transform:scaleY(.5)}}@media (-webkit-min-device-pixel-ratio:2) and (-webkit-min-device-pixel-ratio:3),(min-resolution:2dppx) and (min-resolution:3dppx){html:not([data-scale]) .am-picker-col-indicator:before{-webkit-transform:scaleY(.33);transform:scaleY(.33)}}@media (-webkit-min-device-pixel-ratio:2),(min-resolution:2dppx){html:not([data-scale]) .am-picker-col-indicator{border-bottom:none}html:not([data-scale]) .am-picker-col-indicator:after{content:"";position:absolute;background-color:#ddd;display:block;z-index:1;top:auto;right:auto;bottom:0;left:0;width:100%;height:1px;-webkit-transform-origin:50% 100%;transform-origin:50% 100%;-webkit-transform:scaleY(.5);transform:scaleY(.5)}}@media (-webkit-min-device-pixel-ratio:2) and (-webkit-min-device-pixel-ratio:3),(min-resolution:2dppx) and (min-resolution:3dppx){html:not([data-scale]) .am-picker-col-indicator:after{-webkit-transform:scaleY(.33);transform:scaleY(.33)}}.am-picker{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}.am-picker-item{-ms-flex:1 1;flex:1 1;text-align:center}.am-picker-popup{left:0;bottom:0;position:fixed;width:100%;background-color:#fff}.am-picker-popup-wrap{overflow:auto;-webkit-overflow-scrolling:touch;outline:0}.am-picker-popup-mask,.am-picker-popup-wrap{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1000}.am-picker-popup-mask{background-color:rgba(0,0,0,.4);height:100%}.am-picker-popup-mask-hidden{display:none}.am-picker-popup-header{background-image:-webkit-gradient(linear,left top,left bottom,from(#e7e7e7),color-stop(#e7e7e7),color-stop(transparent),to(transparent));background-image:linear-gradient(180deg,#e7e7e7,#e7e7e7,transparent,transparent);background-position:bottom;background-size:100% 1px;background-repeat:no-repeat;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;position:relative;border-bottom:1px solid #ddd}@media (-webkit-min-device-pixel-ratio:2),(min-resolution:2dppx){html:not([data-scale]) .am-picker-popup-header{border-bottom:none}html:not([data-scale]) .am-picker-popup-header:after{content:"";position:absolute;background-color:#ddd;display:block;z-index:1;top:auto;right:auto;bottom:0;left:0;width:100%;height:1px;-webkit-transform-origin:50% 100%;transform-origin:50% 100%;-webkit-transform:scaleY(.5);transform:scaleY(.5)}}@media (-webkit-min-device-pixel-ratio:2) and (-webkit-min-device-pixel-ratio:3),(min-resolution:2dppx) and (min-resolution:3dppx){html:not([data-scale]) .am-picker-popup-header:after{-webkit-transform:scaleY(.33);transform:scaleY(.33)}}.am-picker-popup-header .am-picker-popup-header-right{text-align:right}.am-picker-popup-item{color:#108ee9;font-size:17px;padding:9px 15px;height:42px;-webkit-box-sizing:border-box;box-sizing:border-box;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center}.am-picker-popup-item-active{background-color:#ddd}.am-picker-popup-title{-ms-flex:1 1;flex:1 1;text-align:center;color:#000}.am-picker-popup .am-picker-popup-close{display:none}.am-picker-col{-ms-flex:1 1;flex:1 1}.main_box___1iH-2{margin-top:30px}.main_box___1iH-2,.menu_box___-8z6Z{display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center}.menu_box___-8z6Z{-ms-flex-direction:column;flex-direction:column;border:1px dashed #f0f0f0;padding:30px;border-top-left-radius:12px;border-bottom-left-radius:12px;background:#f5f7fa}.form_item_box___36MyA{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}.canvas_box___5bn4r{width:1366px;height:960px;padding:12px;border:1px dashed #f0f0f0;border-top-right-radius:12px;border-bottom-right-radius:12px;border-left:none;background:#fafafa;overflow-x:hidden;overflow-y:auto}@media (max-width:768px){.canvas_box___5bn4r{margin-left:0;margin-top:20px}.main_box___1iH-2{-ms-flex-flow:column;flex-flow:column}} \ No newline at end of file +#root,body,html { + height:100%; + font-family:"Monospaced Number","Chinese Quote",-apple-system,"Segoe UI",Roboto,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Helvetica Neue",Helvetica,Arial,sans-serif; + color:#333; + font-size:14px +} +body { + background-color:#fff!important +} +* { + margin:0; + padding:0; + -webkit-box-sizing:border-box; + box-sizing:border-box +} +.block-horizontal-layout,.display-flex { + display:-ms-flexbox; + display:flex +} +.block-horizontal-layout { + -ms-flex-flow:row; + flex-flow:row +} +.block-vertical-layout { + display:-ms-flexbox; + display:flex; + -ms-flex-flow:column; + flex-flow:column +} +.block-flow-layout { + display:-ms-flexbox; + display:flex; + -ms-flex-flow:wrap; + flex-flow:wrap +} +.block-justify-start { + -ms-flex-pack:start; + justify-content:flex-start +} +.block-justify-center { + -ms-flex-pack:center; + justify-content:center +} +.block-justify-end { + -ms-flex-pack:end; + justify-content:flex-end +} +.block-justify-around { + -ms-flex-pack:distribute; + justify-content:space-around +} +.block-justify-between { + -ms-flex-pack:justify; + justify-content:space-between +} +.block-align-start { + -webkit-align-items:flex-start; + -webkit-box-pack:start; + -ms-flex-align:start; + align-items:flex-start +} +.block-align-center { + -webkit-align-items:center; + -webkit-box-pack:center; + -ms-flex-align:center; + align-items:center +} +.block-align-end { + -webkit-align-items:flex-end; + -webkit-box-pack:end; + -ms-flex-align:end; + align-items:flex-end +} +.dxc-input-container { + color:#333; + font-size:14px +} +.dxc-input-box { + margin-left:10px; + overflow:hidden; + border-radius:4px; + border:1px solid #ddd +} +.dxc-input-box input { + min-width:0; + border:0; + -webkit-box-sizing:border-box; + box-sizing:border-box; + outline:none +} +.dxc-input-box input,.dxc-select { + padding-left:10px; + padding-right:10px; + height:35px +} +.dxc-select { + background:#fff +} +.dxc-input-box input::-webkit-input-placeholder { + color:#999; + padding-top:2px +} +/*! normalize.css v7.0.0 | MIT License | github.com/necolas/normalize.css */html { + line-height:1.15; + -ms-text-size-adjust:100%; + -webkit-text-size-adjust:100% +} +body { + margin:0 +} +article,aside,footer,header,nav,section { + display:block +} +h1 { + font-size:2em; + margin:.67em 0 +} +figcaption,figure,main { + display:block +} +figure { + margin:1em 40px +} +hr { + -webkit-box-sizing:content-box; + box-sizing:content-box; + height:0; + overflow:visible +} +pre { + font-family:monospace,monospace; + font-size:1em +} +a { + background-color:transparent; + -webkit-text-decoration-skip:objects +} +abbr[title] { + border-bottom:none; + text-decoration:underline; + -webkit-text-decoration:underline dotted; + text-decoration:underline dotted +} +b,strong { + font-weight:inherit; + font-weight:bolder +} +code,kbd,samp { + font-family:monospace,monospace; + font-size:1em +} +dfn { + font-style:italic +} +mark { + background-color:#ff0; + color:#000 +} +small { + font-size:80% +} +sub,sup { + font-size:75%; + line-height:0; + position:relative; + vertical-align:baseline +} +sub { + bottom:-.25em +} +sup { + top:-.5em +} +audio,video { + display:inline-block +} +audio:not([controls]) { + display:none; + height:0 +} +img { + border-style:none +} +svg:not(:root) { + overflow:hidden +} +button,input,optgroup,select,textarea { + font-family:sans-serif; + font-size:100%; + line-height:1.15; + margin:0 +} +button,input { + overflow:visible +} +button,select { + text-transform:none +} +[type=reset],[type=submit],button,html [type=button] { + -webkit-appearance:button +} +[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner { + border-style:none; + padding:0 +} +[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring { + outline:1px dotted ButtonText +} +fieldset { + padding:.35em .75em .625em +} +legend { + -webkit-box-sizing:border-box; + box-sizing:border-box; + color:inherit; + display:table; + max-width:100%; + padding:0; + white-space:normal +} +progress { + display:inline-block; + vertical-align:baseline +} +textarea { + overflow:auto +} +[type=checkbox],[type=radio] { + -webkit-box-sizing:border-box; + box-sizing:border-box; + padding:0 +} +[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button { + height:auto +} +[type=search] { + -webkit-appearance:textfield; + outline-offset:-2px +} +[type=search]::-webkit-search-cancel-button,[type=search]::-webkit-search-decoration { + -webkit-appearance:none +} +::-webkit-file-upload-button { + -webkit-appearance:button; + font:inherit +} +details,menu { + display:block +} +summary { + display:list-item +} +canvas { + display:inline-block +} +[hidden],template { + display:none +} +.am-fade-appear,.am-fade-enter { + opacity:0 +} +.am-fade-appear,.am-fade-enter,.am-fade-leave { + -webkit-animation-duration:.2s; + animation-duration:.2s; + -webkit-animation-fill-mode:both; + animation-fill-mode:both; + -webkit-animation-timing-function:cubic-bezier(.55,0,.55,.2); + animation-timing-function:cubic-bezier(.55,0,.55,.2); + -webkit-animation-play-state:paused; + animation-play-state:paused +} +.am-fade-appear.am-fade-appear-active,.am-fade-enter.am-fade-enter-active { + -webkit-animation-name:amFadeIn; + animation-name:amFadeIn; + -webkit-animation-play-state:running; + animation-play-state:running +} +.am-fade-leave.am-fade-leave-active { + -webkit-animation-name:amFadeOut; + animation-name:amFadeOut; + -webkit-animation-play-state:running; + animation-play-state:running +} +@-webkit-keyframes amFadeIn { + 0% { + opacity:0 +} +to { + opacity:1 +} +}@keyframes amFadeIn { + 0% { + opacity:0 +} +to { + opacity:1 +} +}@-webkit-keyframes amFadeOut { + 0% { + opacity:1 +} +to { + opacity:0 +} +}@keyframes amFadeOut { + 0% { + opacity:1 +} +to { + opacity:0 +} +}.am-slide-up-appear,.am-slide-up-enter { + -webkit-transform:translateY(100%); + transform:translateY(100%) +} +.am-slide-up-appear,.am-slide-up-enter,.am-slide-up-leave { + -webkit-animation-duration:.2s; + animation-duration:.2s; + -webkit-animation-fill-mode:both; + animation-fill-mode:both; + -webkit-animation-timing-function:cubic-bezier(.55,0,.55,.2); + animation-timing-function:cubic-bezier(.55,0,.55,.2); + -webkit-animation-play-state:paused; + animation-play-state:paused +} +.am-slide-up-appear.am-slide-up-appear-active,.am-slide-up-enter.am-slide-up-enter-active { + -webkit-animation-name:amSlideUpIn; + animation-name:amSlideUpIn; + -webkit-animation-play-state:running; + animation-play-state:running +} +.am-slide-up-leave.am-slide-up-leave-active { + -webkit-animation-name:amSlideUpOut; + animation-name:amSlideUpOut; + -webkit-animation-play-state:running; + animation-play-state:running +} +@-webkit-keyframes amSlideUpIn { + 0% { + -webkit-transform:translateY(100%); + transform:translateY(100%) +} +to { + -webkit-transform:translate(0); + transform:translate(0) +} +}@keyframes amSlideUpIn { + 0% { + -webkit-transform:translateY(100%); + transform:translateY(100%) +} +to { + -webkit-transform:translate(0); + transform:translate(0) +} +}@-webkit-keyframes amSlideUpOut { + 0% { + -webkit-transform:translate(0); + transform:translate(0) +} +to { + -webkit-transform:translateY(100%); + transform:translateY(100%) +} +}@keyframes amSlideUpOut { + 0% { + -webkit-transform:translate(0); + transform:translate(0) +} +to { + -webkit-transform:translateY(100%); + transform:translateY(100%) +} +}.am.am-zoom-enter,.am.am-zoom-leave { + display:block +} +.am-zoom-appear,.am-zoom-enter { + opacity:0; + -webkit-animation-duration:.2s; + animation-duration:.2s; + -webkit-animation-fill-mode:both; + animation-fill-mode:both; + -webkit-animation-timing-function:cubic-bezier(.55,0,.55,.2); + animation-timing-function:cubic-bezier(.55,0,.55,.2); + -webkit-animation-timing-function:cubic-bezier(.18,.89,.32,1.28); + animation-timing-function:cubic-bezier(.18,.89,.32,1.28); + -webkit-animation-play-state:paused; + animation-play-state:paused +} +.am-zoom-leave { + -webkit-animation-duration:.2s; + animation-duration:.2s; + -webkit-animation-fill-mode:both; + animation-fill-mode:both; + -webkit-animation-timing-function:cubic-bezier(.55,0,.55,.2); + animation-timing-function:cubic-bezier(.55,0,.55,.2); + -webkit-animation-timing-function:cubic-bezier(.6,-.3,.74,.05); + animation-timing-function:cubic-bezier(.6,-.3,.74,.05); + -webkit-animation-play-state:paused; + animation-play-state:paused +} +.am-zoom-appear.am-zoom-appear-active,.am-zoom-enter.am-zoom-enter-active { + -webkit-animation-name:amZoomIn; + animation-name:amZoomIn; + -webkit-animation-play-state:running; + animation-play-state:running +} +.am-zoom-leave.am-zoom-leave-active { + -webkit-animation-name:amZoomOut; + animation-name:amZoomOut; + -webkit-animation-play-state:running; + animation-play-state:running +} +@-webkit-keyframes amZoomIn { + 0% { + opacity:0; + -webkit-transform-origin:50% 50%; + transform-origin:50% 50%; + -webkit-transform:scale(0); + transform:scale(0) +} +to { + opacity:1; + -webkit-transform-origin:50% 50%; + transform-origin:50% 50%; + -webkit-transform:scale(1); + transform:scale(1) +} +}@keyframes amZoomIn { + 0% { + opacity:0; + -webkit-transform-origin:50% 50%; + transform-origin:50% 50%; + -webkit-transform:scale(0); + transform:scale(0) +} +to { + opacity:1; + -webkit-transform-origin:50% 50%; + transform-origin:50% 50%; + -webkit-transform:scale(1); + transform:scale(1) +} +}@-webkit-keyframes amZoomOut { + 0% { + opacity:1; + -webkit-transform-origin:50% 50%; + transform-origin:50% 50%; + -webkit-transform:scale(1); + transform:scale(1) +} +to { + opacity:0; + -webkit-transform-origin:50% 50%; + transform-origin:50% 50%; + -webkit-transform:scale(0); + transform:scale(0) +} +}@keyframes amZoomOut { + 0% { + opacity:1; + -webkit-transform-origin:50% 50%; + transform-origin:50% 50%; + -webkit-transform:scale(1); + transform:scale(1) +} +to { + opacity:0; + -webkit-transform-origin:50% 50%; + transform-origin:50% 50%; + -webkit-transform:scale(0); + transform:scale(0) +} +}.am-slide-down-appear,.am-slide-down-enter { + -webkit-transform:translateY(-100%); + transform:translateY(-100%) +} +.am-slide-down-appear,.am-slide-down-enter,.am-slide-down-leave { + -webkit-animation-duration:.2s; + animation-duration:.2s; + -webkit-animation-fill-mode:both; + animation-fill-mode:both; + -webkit-animation-timing-function:cubic-bezier(.55,0,.55,.2); + animation-timing-function:cubic-bezier(.55,0,.55,.2); + -webkit-animation-play-state:paused; + animation-play-state:paused +} +.am-slide-down-appear.am-slide-down-appear-active,.am-slide-down-enter.am-slide-down-enter-active { + -webkit-animation-name:amSlideDownIn; + animation-name:amSlideDownIn; + -webkit-animation-play-state:running; + animation-play-state:running +} +.am-slide-down-leave.am-slide-down-leave-active { + -webkit-animation-name:amSlideDownOut; + animation-name:amSlideDownOut; + -webkit-animation-play-state:running; + animation-play-state:running +} +@-webkit-keyframes amSlideDownIn { + 0% { + -webkit-transform:translateY(-100%); + transform:translateY(-100%) +} +to { + -webkit-transform:translate(0); + transform:translate(0) +} +}@keyframes amSlideDownIn { + 0% { + -webkit-transform:translateY(-100%); + transform:translateY(-100%) +} +to { + -webkit-transform:translate(0); + transform:translate(0) +} +}@-webkit-keyframes amSlideDownOut { + 0% { + -webkit-transform:translate(0); + transform:translate(0) +} +to { + -webkit-transform:translateY(-100%); + transform:translateY(-100%) +} +}@keyframes amSlideDownOut { + 0% { + -webkit-transform:translate(0); + transform:translate(0) +} +to { + -webkit-transform:translateY(-100%); + transform:translateY(-100%) +} +}*,:after,:before { + -webkit-tap-highlight-color:rgba(0,0,0,0) +} +body { + background-color:#f5f5f9; + font-size:14px +} +[contenteditable] { + -webkit-user-select:auto!important +} +:focus,a { + outline:none +} +a { + background:transparent; + text-decoration:none +} +.am-picker-col { + display:block; + position:relative; + height:238px; + overflow:hidden; + width:100% +} +.am-picker-col-content { + position:absolute; + left:0; + top:0; + width:100%; + z-index:1; + padding:102px 0 +} +.am-picker-col-item { + -ms-touch-action:manipulation; + touch-action:manipulation; + text-align:center; + font-size:16px; + height:34px; + line-height:34px; + color:#000; + white-space:nowrap; + text-overflow:ellipsis +} +.am-picker-col-item-selected { + font-size:17px +} +.am-picker-col-mask { + top:0; + height:100%; + margin:0 auto; + background-image:-webkit-gradient(linear,left top,left bottom,from(hsla(0,0%,100%,.95)),to(hsla(0,0%,100%,.6))),-webkit-gradient(linear,left bottom,left top,from(hsla(0,0%,100%,.95)),to(hsla(0,0%,100%,.6))); + background-image:linear-gradient(180deg,hsla(0,0%,100%,.95),hsla(0,0%,100%,.6)),linear-gradient(0deg,hsla(0,0%,100%,.95),hsla(0,0%,100%,.6)); + background-position:top,bottom; + background-size:100% 102px; + background-repeat:no-repeat +} +.am-picker-col-indicator,.am-picker-col-mask { + position:absolute; + left:0; + width:100%; + z-index:3 +} +.am-picker-col-indicator { + -webkit-box-sizing:border-box; + box-sizing:border-box; + height:34px; + top:102px; + border-top:1px solid #ddd; + border-bottom:1px solid #ddd +} +@media (-webkit-min-device-pixel-ratio:2),(min-resolution:2dppx) { + html:not([data-scale]) .am-picker-col-indicator { + border-top:none +} +html:not([data-scale]) .am-picker-col-indicator:before { + content:""; + position:absolute; + background-color:#ddd; + display:block; + z-index:1; + top:0; + right:auto; + bottom:auto; + left:0; + width:100%; + height:1px; + -webkit-transform-origin:50% 50%; + transform-origin:50% 50%; + -webkit-transform:scaleY(.5); + transform:scaleY(.5) +} +}@media (-webkit-min-device-pixel-ratio:2) and (-webkit-min-device-pixel-ratio:3),(min-resolution:2dppx) and (min-resolution:3dppx) { + html:not([data-scale]) .am-picker-col-indicator:before { + -webkit-transform:scaleY(.33); + transform:scaleY(.33) +} +}@media (-webkit-min-device-pixel-ratio:2),(min-resolution:2dppx) { + html:not([data-scale]) .am-picker-col-indicator { + border-bottom:none +} +html:not([data-scale]) .am-picker-col-indicator:after { + content:""; + position:absolute; + background-color:#ddd; + display:block; + z-index:1; + top:auto; + right:auto; + bottom:0; + left:0; + width:100%; + height:1px; + -webkit-transform-origin:50% 100%; + transform-origin:50% 100%; + -webkit-transform:scaleY(.5); + transform:scaleY(.5) +} +}@media (-webkit-min-device-pixel-ratio:2) and (-webkit-min-device-pixel-ratio:3),(min-resolution:2dppx) and (min-resolution:3dppx) { + html:not([data-scale]) .am-picker-col-indicator:after { + -webkit-transform:scaleY(.33); + transform:scaleY(.33) +} +}.am-picker { + display:-ms-flexbox; + display:flex; + -ms-flex-align:center; + align-items:center +} +.am-picker-item { + -ms-flex:1 1; + flex:1 1; + text-align:center +} +.am-picker-popup { + left:0; + bottom:0; + position:fixed; + width:100%; + background-color:#fff +} +.am-picker-popup-wrap { + overflow:auto; + -webkit-overflow-scrolling:touch; + outline:0 +} +.am-picker-popup-mask,.am-picker-popup-wrap { + position:fixed; + top:0; + right:0; + bottom:0; + left:0; + z-index:1000 +} +.am-picker-popup-mask { + background-color:rgba(0,0,0,.4); + height:100% +} +.am-picker-popup-mask-hidden { + display:none +} +.am-picker-popup-header { + background-image:-webkit-gradient(linear,left top,left bottom,from(#e7e7e7),color-stop(#e7e7e7),color-stop(transparent),to(transparent)); + background-image:linear-gradient(180deg,#e7e7e7,#e7e7e7,transparent,transparent); + background-position:bottom; + background-size:100% 1px; + background-repeat:no-repeat; + display:-ms-flexbox; + display:flex; + -ms-flex-align:center; + align-items:center; + position:relative; + border-bottom:1px solid #ddd +} +@media (-webkit-min-device-pixel-ratio:2),(min-resolution:2dppx) { + html:not([data-scale]) .am-picker-popup-header { + border-bottom:none +} +html:not([data-scale]) .am-picker-popup-header:after { + content:""; + position:absolute; + background-color:#ddd; + display:block; + z-index:1; + top:auto; + right:auto; + bottom:0; + left:0; + width:100%; + height:1px; + -webkit-transform-origin:50% 100%; + transform-origin:50% 100%; + -webkit-transform:scaleY(.5); + transform:scaleY(.5) +} +}@media (-webkit-min-device-pixel-ratio:2) and (-webkit-min-device-pixel-ratio:3),(min-resolution:2dppx) and (min-resolution:3dppx) { + html:not([data-scale]) .am-picker-popup-header:after { + -webkit-transform:scaleY(.33); + transform:scaleY(.33) +} +}.am-picker-popup-header .am-picker-popup-header-right { + text-align:right +} +.am-picker-popup-item { + color:#108ee9; + font-size:17px; + padding:9px 15px; + height:42px; + -webkit-box-sizing:border-box; + box-sizing:border-box; + display:-ms-flexbox; + display:flex; + -ms-flex-align:center; + align-items:center; + -ms-flex-pack:center; + justify-content:center +} +.am-picker-popup-item-active { + background-color:#ddd +} +.am-picker-popup-title { + -ms-flex:1 1; + flex:1 1; + text-align:center; + color:#000 +} +.am-picker-popup .am-picker-popup-close { + display:none +} +.am-picker-col { + -ms-flex:1 1; + flex:1 1 +} +.main_box___1iH-2 { + margin-top:30px +} +.main_box___1iH-2,.menu_box___-8z6Z { + display:-ms-flexbox; + display:flex; + -ms-flex-pack:center; + justify-content:center +} +.menu_box___-8z6Z { + -ms-flex-direction:column; + flex-direction:column; + border:1px dashed #f0f0f0; + padding:30px; + border-top-left-radius:12px; + border-bottom-left-radius:12px; + background:#f5f7fa +} +.form_item_box___36MyA { + display:-ms-flexbox; + display:flex; + -ms-flex-align:center; + align-items:center +} +.canvas_box___5bn4r { + width:1366px; + height:960px; + padding:12px; + border:1px dashed #f0f0f0; + border-top-right-radius:12px; + border-bottom-right-radius:12px; + border-left:none; + background:#fafafa; + overflow-x:hidden; + overflow-y:auto +} +@media (max-width:768px) { + .canvas_box___5bn4r { + margin-left:0; + margin-top:20px +} +.main_box___1iH-2 { + -ms-flex-flow:column; + flex-flow:column +} +} \ No newline at end of file diff --git a/index.html b/index.html index 73b3526..ed258f8 100644 --- a/index.html +++ b/index.html @@ -7,7 +7,7 @@ 在线图片加水印,canvas加水印,防止身份证复印件被盗 - +