1 line
6.8 KiB
CSS
1 line
6.8 KiB
CSS
:focus{outline:0}*{box-sizing:border-box}body,html{width:100vw;height:100vh;overflow:hidden;padding:0;margin:0;background:#1f2857;background:linear-gradient(144deg,#1f2954 25%,#000 50%,#5e002c 80%);background-attachment:fixed;color:#fff;font-family:sans-serif;font-size:16px}.hide{display:none!important}.icon{width:1em;height:1em;vertical-align:middle;font-size:1em;shape-rendering:geometricPrecision;transition:transform .5s cubic-bezier(.22,.61,.36,1);stroke-width:5px;text-align:center;margin-right:.5rem}.icon.block{display:block}.spacer{margin-top:20px}[data-link]{cursor:pointer}[data-link] *{pointer-events:none}.btn{border:none;background:#3949ab radial-gradient(circle at 0 0,#3949ab 0,rgba(0,0,0,.2) 100%) no-repeat;color:#fff;padding:7px 1.1rem;margin:10px 0;cursor:pointer;position:relative;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;border-radius:4px;box-shadow:0 2px 5px 0 rgba(0,0,0,.26);overflow:hidden;display:flex;justify-content:center;align-items:center;transition:.5s}.btn--outline{background:0 0;border:1px solid #3949ab}.btn:focus{box-shadow:0 3px 8px 1px rgba(0,0,0,.4)}.btn--valid{background:#39ab48 radial-gradient(circle at 0 0,#39ab48 0,rgba(0,0,0,.2) 100%) no-repeat}.btn--accent{background:#ff0089 radial-gradient(circle at 0 0,#ff0089 0,rgba(0,0,0,.2) 100%) no-repeat}.btn--warn{background:#f87229 radial-gradient(circle at 0 0,#f87229 0,rgba(0,0,0,.2) 100%) no-repeat}.btn-fab{border-radius:2rem;width:2em;height:2em;padding:5px}.btn-ripple{position:absolute;top:0;left:0;width:100%;height:100%;overflow:hidden;background:0 0}.btn-ripple__effect{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);opacity:1;width:200%;height:0;padding-bottom:200%;border-radius:50%;background:rgba(190,190,190,.3);-webkit-animation:a-ripple .4s ease-in;animation:a-ripple .4s ease-in}.btn-ripple__effect.to-remove{-webkit-animation:remove-ripple .2s linear;animation:remove-ripple .2s linear}.btn--outline .btn-ripple__effect{background:rgba(57,73,171,.5);z-index:-1}.btn__content{z-index:1;font-weight:400;pointer-events:none}@-webkit-keyframes remove-ripple{from{opacity:1}to{opacity:0}}@keyframes remove-ripple{from{opacity:1}to{opacity:0}}@-webkit-keyframes a-ripple{0%{opacity:0;padding-bottom:0;width:0}25%{opacity:1}100%{width:200%;padding-bottom:200%}}@keyframes a-ripple{0%{opacity:0;padding-bottom:0;width:0}25%{opacity:1}100%{width:200%;padding-bottom:200%}}.btn-line{text-align:right}.btn-line button{margin-right:5px;margin-left:5px;display:inline-block}.btn-line button:last-child{margin-right:0}v-input input{background-color:rgba(0,0,0,.4);border:none;border-bottom:2px solid #3949ab;color:#fff;padding:calc(.75rem - 1px)}v-input input:focus,v-input.focus input{border-color:#ff0089}v-input.valid input{border-color:#39ab48}v-input.invalid input{border-color:#cf1b1b}v-input{display:flex;flex-direction:column;margin-bottom:5px;position:relative;padding-top:.7rem}v-input.no-space{padding-top:.1rem}v-input label{font-size:.7rem;position:absolute;top:.7rem;left:5px;height:1.5rem;pointer-events:none;vertical-align:middle;transform:translateY(50%);color:#dcdcdc;transition:all .2s ease-out}v-input input:focus~label,v-input.focus label{top:0;left:0;transform:translateY(0);font-size:.6rem}v-input .error{display:none}v-input.invalid .error{margin-top:2px;display:block;font-size:.7rem;color:#f32f32}v-switch{display:flex;flex-direction:row;align-items:center}v-switch input{position:absolute;-webkit-appearance:none;-moz-appearance:none;appearance:none;opacity:0}v-switch label{display:block;border-radius:10px;width:40px;height:20px;background-color:#e9e9e9;position:relative;cursor:pointer;margin-right:.5rem}v-switch label:after{content:'';background-color:#c51162;position:absolute;top:2px;left:2px;height:16px;width:16px;border-radius:10px;transition:.5s}v-switch input:checked+label:after{transform:translateX(20px);background-color:#007769}.loader{display:flex;justify-content:center;align-items:center;width:100vw;height:100vh;position:absolute;top:0;z-index:10000;background-color:rgba(0,0,0,.4);opacity:1;transition:opacity .3s}.loader.hide{display:block;opacity:0;pointer-events:none}.loader .spinner{-webkit-animation:rotator 1.4s linear infinite;animation:rotator 1.4s linear infinite}.loader .path{stroke-dasharray:187;stroke-dashoffset:0;transform-origin:center;-webkit-animation:dash 1.4s ease-in-out infinite,colors 5.6s ease-in-out infinite;animation:dash 1.4s ease-in-out infinite,colors 5.6s ease-in-out infinite}@-webkit-keyframes rotator{from{transform:rotate(0)}to{transform:rotate(270deg)}}@keyframes rotator{from{transform:rotate(0)}to{transform:rotate(270deg)}}@-webkit-keyframes colors{0%{stroke:#4285f4}25%{stroke:#de3e35}50%{stroke:#f7c223}75%{stroke:#1b9a59}100%{stroke:#4285f4}}@keyframes colors{0%{stroke:#4285f4}25%{stroke:#de3e35}50%{stroke:#f7c223}75%{stroke:#1b9a59}100%{stroke:#4285f4}}@-webkit-keyframes dash{0%{stroke-dashoffset:187}50%{stroke-dashoffset:46.75;transform:rotate(135deg)}100%{stroke-dashoffset:187;transform:rotate(450deg)}}@keyframes dash{0%{stroke-dashoffset:187}50%{stroke-dashoffset:46.75;transform:rotate(135deg)}100%{stroke-dashoffset:187;transform:rotate(450deg)}}v-table{display:block}v-table v-table-body,v-table v-table-footer,v-table v-table-header,v-table v-table-row{display:grid;grid-auto-columns:1fr;grid-auto-flow:row;-moz-column-gap:20px;column-gap:20px;overflow:hidden}v-table v-table-header{background-color:#3949ab}v-table v-table-header,v-table v-table-row{grid-auto-flow:column;padding:10px;align-items:center}v-table v-table-body{background:rgba(255,255,255,.1);box-shadow:0 3px 6px rgba(0,0,0,.16),0 3px 6px rgba(0,0,0,.23);border-radius:5px}v-table v-table-body v-table-row:nth-child(odd){background-color:rgba(0,0,0,.3)}v-table v-table-body v-table-row:hover{background-color:rgba(0,0,0,.5)}v-label,v-option,v-options,v-select{display:inline-block;box-sizing:border-box}v-select{display:block;position:relative;margin-bottom:.5rem}v-label{padding:.5rem .5rem;background-color:rgba(0,0,0,.5);color:#fff;cursor:pointer;display:block;border-bottom:solid 3px #3949ab;margin-top:.5rem;position:relative}v-label:after{content:'';border:solid #fff;border-width:0 2px 2px 0;width:.5rem;height:.5rem;position:absolute;right:1em;margin-top:.1rem;transform:rotate(45deg);transition:.3s}v-label.open:after{transform:rotate(-135deg);margin-top:.4rem}v-options{position:absolute;display:flex;flex-direction:column;overflow:hidden;max-height:0;top:.5rem;left:.5rem;background-color:#1b1b1b;z-index:1000;cursor:pointer;color:#fff;border-radius:5px;box-shadow:0 3px 6px rgba(0,0,0,.16),0 3px 6px rgba(0,0,0,.23)}v-option{padding:.5rem 1rem .5rem 5px;min-width:240px}v-option:not(:last-child){border-bottom:solid 1px #333}v-option:not([disabled]):hover{background-color:rgba(0,0,0,.3)}v-option[selected]{background-color:#3949ab;color:#fff}v-option[disabled]{color:#aaa} |