gmalert.min.css

.gmal{--gmal-bg:#fff;--gmal-text:#5a5a5a;--gmal-light:#ddd;--gmal-border:1px solid #d3d3d3;--gmal-shadow:rgba(0,0,0,.08);--gmal-shadow-v:0 0 1px var(--gmal-shadow),1px 2px 4px var(--gmal-shadow),1px 3px 8px var(--gmal-shadow);--gmal-success:#72b948;--gmal-info:#30abd4;--gmal-warn:#e67930;--gmal-error:#da5252;--gmal-loading:#31518d;bottom:0;color:var(--gmal-text);font:16px/1.3 Helvetica Neue,Helvetica,Arial,PingFang SC,Hiragino Sans GB,Heiti SC,Microsoft YaHei,WenQuanYi Micro Hei,sans-serif;left:0;overflow:visible;pointer-events:none;position:fixed;right:0;top:0;z-index:9999}.gmal *{box-sizing:border-box}.gmal-count{animation-duration:.3s;background-color:#ec3131;border-radius:3px;color:#fff;display:inline-block;font-size:.875em;height:1.2em;left:-.5em;min-width:1.2em;padding:0 1px;position:absolute;text-align:center;top:-.4em}.gmal-close{border-radius:5px;cursor:pointer;display:flex;font-size:1.5em;opacity:.3;transition:all .2s}.gmal-close:hover{background:var(--gmal-light);opacity:.5}.gmal-progress{border-bottom-left-radius:5px;border-bottom-right-radius:5px;bottom:0;left:0;overflow:hidden;position:absolute;right:0}.gmal-progress .gmal-progress-bar{background:var(--gmal-light);display:flex;height:.25em;width:100%}@keyframes gmal-shake{0%,to{opacity:1;transform:translateX(0)}25%,75%{opacity:.75;transform:translateX(-4px)}50%{opacity:.25;transform:translateX(4px)}}.gmal-spin{animation:gmal-turn 1s linear infinite}@keyframes gmal-turn{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.gmal-aniicon{align-items:center;animation-fill-mode:both!important;display:flex;height:6em;justify-content:center;line-height:6em;margin:0;position:relative;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:6em}.gmal-ani-wrap{border:.4em solid;border-radius:50%;height:100%;opacity:.6;position:absolute;width:100%}.gmal-ok-icon{color:var(--gmal-success)}.gmal-ok-icon .gmal-ok-ring{animation:gmal-rt-rscl .4s ease-in;animation-fill-mode:both;border-color:currentcolor currentcolor transparent transparent;border-radius:50%;border-style:solid;border-width:.4em;height:100%;position:absolute;width:100%;z-index:2}.gmal-ok-icon .gmal-ok-line{background:currentcolor;border-radius:.125em;display:block;height:.3125em;position:absolute;z-index:2}.gmal-ok-icon .gmal-ok-line.gmal-line-tip{animation:gmal-anim-slt .75s;left:1.21em;top:3.3em;transform:rotate(45deg);width:1.6em}.gmal-ok-icon .gmal-ok-line.gmal-line-long{animation:gmal-anim-sll .75s;right:1.07em;top:2.8em;transform:rotate(-45deg);width:3em}@keyframes gmal-rt-rscl{0%{transform:rotate(72deg)}5%{transform:rotate(72deg)}75%{opacity:1}to{opacity:0;transform:rotate(-14deg)}}@keyframes gmal-anim-slt{0%{width:0}54%{left:.54em;top:1.48em;width:0}70%{left:0;top:2.5em;width:3.125em}84%{left:1.7em;top:3.42em;width:1.1em}}@keyframes gmal-anim-sll{0%{width:0}65%{right:3.36em;top:3.72em;width:0}84%{right:.5em;top:2.6em;width:3.5em}}.gmal-err-icon{animation:gmal-anim-err .5s;color:var(--gmal-error)}.gmal-err-icon .gmal-err-r{animation:gmal-anim-err-l .5s;flex-grow:1;height:100%}.gmal-err-icon .gmal-err-r .gmal-err-ll{left:1.5em;transform:rotate(45deg)}.gmal-err-icon .gmal-err-r .gmal-err-ll,.gmal-err-icon .gmal-err-r .gmal-err-lr{background:currentcolor;border-radius:.125em;display:block;height:.32em;position:absolute;top:2.8em;width:3em}.gmal-err-icon .gmal-err-r .gmal-err-lr{right:1.5em;transform:rotate(-45deg)}@keyframes gmal-anim-err{0%{opacity:0;transform:rotateX(100deg)}to{transform:rotateX(0)}}@keyframes gmal-anim-err-l{0%{margin-top:1.625em;opacity:0;transform:scale(.4)}50%{margin-top:1.625em;opacity:0;transform:scale(.4)}80%{margin-top:-.375em;transform:scale(1.15)}to{margin-top:0;opacity:1;transform:scale(1)}}.gmal-warn-icon{animation:gmal-anim-err .5s;color:var(--gmal-warn)}.gmal-warn-icon .gmal-warn-content{align-items:center;animation:gmal-anim-warn .8s;display:flex;font-size:3.75em}@keyframes gmal-anim-warn{0%{opacity:0;transform:rotate(45deg)}25%{opacity:.4;transform:rotate(-25deg)}50%{opacity:.8;transform:rotate(15deg)}75%{opacity:1;transform:rotate(-5deg)}to{opacity:1;transform:rotateX(0)}}.gmal-info-icon{animation:gmal-anim-err .5s;color:#3fc3ee}.gmal-info-icon .gmal-info-content{align-items:center;animation:gmal-anim-warn .8s;display:flex;font-size:3.75em}.gmal-load-icon{border-color:transparent;line-height:1}.gmal-load-icon svg{font-size:5.4em}.gmal-aniicon.gmal-dense{align-self:center;animation-delay:.3s;height:2.6em;width:2.6em}.gmal-aniicon.gmal-dense .gmal-ani-wrap,.gmal-aniicon.gmal-dense .gmal-ok-ring{border-width:.25em}.gmal-aniicon.gmal-dense .gmal-ok-line{height:.3em}.gmal-aniicon.gmal-dense .gmal-ok-line.gmal-line-tip{animation:gmal-anim-slt-dense .75s;left:.45em;top:1.37em;width:.8em}.gmal-aniicon.gmal-dense .gmal-ok-line.gmal-line-long{animation:gmal-anim-sll-dense .75s;right:.45em;top:1.15em;width:1.4em}.gmal-aniicon.gmal-dense .gmal-err-r,.gmal-aniicon.gmal-dense .gmal-info-content,.gmal-aniicon.gmal-dense .gmal-ok-line,.gmal-aniicon.gmal-dense .gmal-ok-ring,.gmal-aniicon.gmal-dense .gmal-warn-content{animation-delay:.3s!important}.gmal-aniicon.gmal-dense .gmal-err-ll,.gmal-aniicon.gmal-dense .gmal-err-lr{height:.2em;top:1.25em;width:1.5em}.gmal-aniicon.gmal-dense .gmal-err-ll{left:.55em}.gmal-aniicon.gmal-dense .gmal-err-lr{right:.55em}.gmal-aniicon.gmal-dense .gmal-info-content,.gmal-aniicon.gmal-dense .gmal-warn-content{font-size:1.75em;font-weight:700}@keyframes gmal-anim-slt-dense{0%{width:0}54%{left:.25em;top:.55em;width:0}70%{left:.05em;top:1.15em;width:1.4em}84%{left:.65em;top:1.53em;width:.62em}}@keyframes gmal-anim-sll-dense{0%{width:0}65%{right:1.45em;top:1.45em;width:0}84%{right:.25em;top:1.15em;width:1.66em}}.gmal-alert-box{align-items:center;background:rgba(0,0,0,.5);bottom:0;justify-content:center;left:0;position:fixed;right:0;top:0}.gmal-alert,.gmal-alert-box{display:flex;pointer-events:all}.gmal-alert{animation:gmal-alert-in .3s;animation-fill-mode:both;background:var(--gmal-bg);border-radius:5px;box-shadow:var(--gmal-shadow-v);flex-direction:column;min-width:350px;padding:1em}.gmal-alert .gmal-close{position:absolute;right:6px;top:6px}.gmal-alert-icon{margin:0 auto}.gmal-alert-btn-group{display:flex;justify-content:center;margin-top:1rem}.gmal-alert-btn-group .gmal-alert-btn{background:transparent none repeat 0 0/auto auto padding-box border-box scroll;background:initial;background-color:#7066e0;border:0;border-radius:.25em;color:#fff;cursor:pointer;font-size:1em;font-weight:500;margin:.3125em;padding:.625em 1.1em}.gmal-alert-btn-group .gmal-alert-btn:hover{background-image:linear-gradient(rgba(0,0,0,.1),rgba(0,0,0,.1))}.gmal-alert-content{font-size:1.125em;margin:1em 1.6em .3em;overflow:auto;word-break:break-word;z-index:1}.gmal-alert-content,.gmal-alert-title{word-wrap:break-word;color:inherit;text-align:center}.gmal-alert-title{font-size:1.875em;font-weight:600;margin:0;max-width:100%;padding:.8em 1em 0;position:relative;text-transform:none}@keyframes gmal-alert-out{to{opacity:0;transform:scale(.5)}}.gmal-info{animation:gmal-info-in .3s ease-in-out;background:var(--gmal-bg);border-radius:5px;bottom:1.5em;box-shadow:var(--gmal-shadow-v);display:flex;flex-direction:column;padding:.5em 1em;pointer-events:all;position:absolute;right:2em;width:320px}.gmal-info-header{align-items:center;border-bottom:var(--gmal-border);display:flex;font-size:.92em;padding-bottom:3px}.gmal-info-header .gmal-close{margin-left:.1em;margin-right:-.3em}.gmal-info-title{border-radius:.2em;color:#fff;height:1.3em;margin-right:.4em;min-width:1.3em;padding:0 .3em}.gmal-info-title.gmal-load{animation:gmal-loading 1s infinite}.gmal-info-content{padding:.5em}@keyframes gmal-info-in{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes gmal-info-out{to{opacity:0;transform:translateY(20px)}}@keyframes gmal-loading{0%{opacity:1}50%{opacity:.5}to{opacity:1}}.gmal-notice-box{align-items:flex-end;display:flex;flex-direction:column;left:0;position:absolute;right:1em;top:1em}.gmal-notice{animation-duration:.4s;animation-fill-mode:both;background:var(--gmal-bg);border-radius:5px;box-shadow:var(--gmal-shadow-v);margin-bottom:1em;pointer-events:all;position:relative;transform-origin:top center;width:340px}.gmal-notice .gmal-notice-main{align-items:normal;display:flex;flex-direction:column}.gmal-notice .gmal-notice-main .gmal-notice-content{margin:1.3em 1em 1.35em 4em;position:relative}.gmal-notice-icon{left:.8em;opacity:0;position:absolute;top:.7rem}@keyframes gmal-open{0%{max-height:0;opacity:0}30%{max-height:var(--mh);opacity:0;transform:translateX(80%)}70%{opacity:1;transform:translateX(-2%)}85%{transform:translateX(1%)}to{opacity:1;transform:translateX(0)}}@keyframes gmal-close{30%{opacity:1;transform:translateX(-2%)}65%{margin-bottom:1em;max-height:var(--mh);opacity:0;transform:translateX(80%)}to{margin:0;max-height:0;opacity:0}}.gmal-msg-box{align-items:center;display:flex;flex-direction:column;left:0;position:absolute;right:0;top:calc(50% - 4rem)}.gmal-msg{animation-duration:.3s;overflow:visible;pointer-events:all;position:relative;transform-origin:center}.gmal-msg .gmal-progress{opacity:0}.gmal-icon{color:#fff;font-size:1.25em;left:.5em;position:absolute}.gmal-msg-main{animation-duration:.3s;background:var(--gmal-bg);border-radius:4px;box-shadow:var(--gmal-shadow-v);box-sizing:border-box;margin-bottom:.4rem;max-width:20em;min-width:4em;overflow:hidden;padding:.5em .6em .5em 2.2em;position:relative;text-align:center}.gmal-msg-content{pointer-events:all;text-align:left}@keyframes gmal-msg-out{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.7)}}@keyframes gmal-msg-close{to{margin:0;max-height:0;padding-bottom:0;padding-top:0}}@keyframes gmal-alert-in{0%{transform:scale(.7)}45%{transform:scale(1.05)}80%{transform:scale(.95)}to{transform:scale(1)}}