4 lines
20 KiB
CSS
4 lines
20 KiB
CSS
.app-output{height:100%;overflow:hidden;display:-webkit-flex;display:flex;-webkit-flex-flow:column;flex-flow:column}.settings{-webkit-flex:0.9 1 0;flex:0.9 1 0;overflow:hidden}@media (min-width: 640px){.settings{-webkit-flex:none;flex:none;min-width:21.1em}}@media (min-width: 900px){.settings{margin:30px;border-radius:2px;border:1px solid #d7d7d7}}.main{-webkit-flex:1;flex:1;display:-webkit-flex;display:flex;-webkit-flex-flow:column;flex-flow:column;overflow:hidden}@media (min-width: 640px){.main{-webkit-flex-flow:row;flex-flow:row}}.output{-webkit-flex:1 1 0;flex:1 1 0;position:relative}.action-button-container{position:absolute;z-index:2;bottom:-28px;right:13px;display:-webkit-flex;display:flex;-webkit-align-items:center;align-items:center}.action-button-container .minor-action-container{display:flex}.action-button-container .minor-action-container .minor-floating-action-button{margin-right:10px}@media (min-width: 640px){.action-button-container{right:30px;bottom:30px}.action-button-container .results-container{margin-right:-17px}.action-button-container .minor-action-container{flex-flow:column;position:absolute;bottom:58px;right:8px}.action-button-container .minor-action-container .minor-floating-action-button{margin-bottom:10px;margin-right:0}}@media (min-width: 900px){.action-button-container{right:0;bottom:30px}}.toolbar{z-index:2}.setting{z-index:1}.settings,.toolbar{box-shadow:0 0px 11px rgba(0,0,0,0.4)}@media (min-width: 640px){.settings,.toolbar{box-shadow:0 4px 11px rgba(0,0,0,0.3)}}.toolbar{-webkit-transform:translateY(-110%);transform:translateY(-110%)}.toolbar.transition{-webkit-transition:-webkit-transform 0.2s ease-out;transition:transform 0.2s ease-out}.toolbar.active{-webkit-transform:translateZ(0);transform:translateZ(0)}.settings{-webkit-transform:translateY(110%);transform:translateY(110%)}@media (min-width: 640px){.settings{-webkit-transform:translateX(115%);transform:translateX(115%)}}.settings.transition{-webkit-transition:-webkit-transform 0.3s ease-out 0.05s;transition:transform 0.3s ease-out 0.05s}@media (min-width: 640px) and (max-width: 900px){.settings.transition{-webkit-transition:-webkit-transform 0.3s ease-out 0.2s;transition:transform 0.3s ease-out 0.2s}}.settings.active{-webkit-transform:translateZ(0);transform:translateZ(0)}.action-button-container{-webkit-transform:translateX(168px);transform:translateX(168px)}@media (min-width: 640px){.action-button-container{-webkit-transform:translateY(188px);transform:translateY(188px)}}.action-button-container.transition{-webkit-transition:-webkit-transform 0.2s ease-out 0.2s;transition:transform 0.2s ease-out 0.2s}@media (min-width: 640px) and (max-width: 900px){.action-button-container.transition{-webkit-transition:-webkit-transform 0.2s ease-out 0.4s;transition:transform 0.2s ease-out 0.4s}}.action-button-container.active{-webkit-transform:translateZ(0);transform:translateZ(0)}.output-switcher{-webkit-filter:contrast(0%) brightness(150%) saturate(100%);filter:contrast(0%) brightness(150%) saturate(100%);opacity:0}.output-switcher.transition{-webkit-transition:all 0.5s ease-out 0.5s;transition:all 0.5s ease-out 0.5s}@media (min-width: 640px) and (max-width: 900px){.output-switcher.transition{-webkit-transition:all 0.5s ease-out 0.6s;transition:all 0.5s ease-out 0.6s}}.output-switcher.active{opacity:1;-webkit-filter:none;filter:none}.settings{background:#fff;display:-webkit-flex;display:flex;-webkit-flex-flow:column;flex-flow:column;-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.settings-scroller{overflow-x:hidden;overflow-y:auto;-webkit-overflow-scrolling:touch;-webkit-flex:1;flex:1;-webkit-transform:translateZ(0);transform:translateZ(0)}.setting-item-toggle{position:relative;display:block;cursor:pointer;padding:0 16px;height:51px;display:-webkit-flex;display:flex;-webkit-align-items:center;align-items:center}.setting-item-toggle input[type=checkbox]{position:absolute;height:1px;width:1px;overflow:hidden;clip:rect(1px, 1px, 1px, 1px)}.setting-item-toggle input:focus+.material-switch .handle{width:25px;height:25px;top:-5px;box-shadow:0 1px 3px rgba(0,0,0,0.5),inset 0 0 0 2px #3F51B5}.setting-item-range{padding:10px 16px 20px;display:-webkit-flex;display:flex;-webkit-flex-flow:column;flex-flow:column;-webkit-justify-content:center;justify-content:center}.setting-item-range .label-text{margin-bottom:0.7em}.settings>section:not(:first-child){border-top:1px solid #e7e7e7}.settings-sub-heading{margin:0;padding:12px 16px 16px;font-weight:normal;font-size:0.9rem;color:#898989}.setting-reset-row{padding:12px 16px 16px;text-align:right}.setting-reset{text-transform:uppercase;color:white;background:#3F51B5;padding:9px 14px;font-size:0.9rem;border-radius:5px;position:relative;overflow:hidden}.setting-reset .ripple{top:-94%;bottom:auto;padding-top:100%}.material-switch{display:block;width:37px;height:14px;position:relative;margin-right:19px}.material-switch .track{border-radius:19px;position:absolute;top:0;bottom:0;left:1px;right:1px;background:rgba(0,0,0,0.26);overflow:hidden;-webkit-transform:translateZ(0);transform:translateZ(0)}.material-switch .track::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:#9FA8DA;opacity:0;-webkit-transition:opacity 0.15s ease-out;transition:opacity 0.15s ease-out;-webkit-transform:translateZ(0);transform:translateZ(0);border-radius:19px}@supports (transform: none){.material-switch .track::before{border-radius:0}}.material-switch .handle{position:absolute;top:-3px;left:0;width:20px;height:20px;border-radius:20px;background:#fafafa;box-shadow:0 1px 3px rgba(0,0,0,0.5),inset 0 0 0 2px transparent;overflow:hidden;box-sizing:border-box;-webkit-transition:all 0.15s ease-out;transition:all 0.15s ease-out;-webkit-transform:translateZ(0);transform:translateZ(0)}.material-switch .handle::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:#3F51B5;opacity:0;-webkit-transition:opacity 0.15s ease-out;transition:opacity 0.15s ease-out;-webkit-transform:translateZ(0);transform:translateZ(0);border-radius:10px}@supports (transform: none){.material-switch .handle::before{border-radius:0}}:checked+.material-switch .track::before{opacity:1}:checked+.material-switch .handle{-webkit-transform:translate3d(17px, 0, 0);transform:translate3d(17px, 0, 0);box-shadow:0 1px 3px rgba(0,0,0,0.5),inset 0 0 0 2px transparent}:checked+.material-switch .handle::before{opacity:1}.toolbar{background:#3F51B5;color:#fff;display:-webkit-flex;display:flex;-webkit-align-items:center;align-items:center}.menu-toolbar-item button{padding:10px 12px}.menu-toolbar-item svg{width:24px;height:24px;fill:#fff}.minor-floating-action-button{width:40px;height:40px;border-radius:20px;background:#fff;box-shadow:0 2px 3px rgba(0,0,0,0.25);position:relative;cursor:pointer;overflow:hidden;z-index:0;display:-webkit-flex;display:flex;-webkit-align-items:center;align-items:center;-webkit-justify-content:center;justify-content:center;-webkit-transition:all 0.1s ease-out;transition:all 0.1s ease-out}@media (min-width: 640px){.minor-floating-action-button{box-shadow:0 4px 11px rgba(0,0,0,0.3)}}.minor-floating-action-button:hover,.minor-floating-action-button.key-focused{-webkit-transform:scale(1.15);transform:scale(1.15);box-shadow:0 2px 10px rgba(0,0,0,0.25)}.minor-floating-action-button:focus{outline:none}.minor-floating-action-button .icon{display:block;width:24px;height:24px;fill:#000;z-index:1}.minor-floating-action-button .spinner{position:absolute;top:0;left:0;width:40px;height:40px;border-color:#00bcd4}.minor-floating-action-button .ripple{background:#00bcd4}.floating-action-button{width:56px;height:56px;border-radius:28px;background:#00BCD4;box-shadow:0 2px 3px rgba(0,0,0,0.25);position:relative;display:-webkit-flex;display:flex;-webkit-align-items:center;align-items:center;-webkit-justify-content:center;justify-content:center;-webkit-transition:all 0.1s ease-out;transition:all 0.1s ease-out}@media (min-width: 640px){.floating-action-button{box-shadow:0 4px 11px rgba(0,0,0,0.3)}}.floating-action-button:hover,.floating-action-button.key-focused{-webkit-transform:scale(1.15);transform:scale(1.15);box-shadow:0 2px 10px rgba(0,0,0,0.25)}.floating-action-button:focus{outline:none}.floating-action-button .icon{display:block;width:24px;height:24px;fill:#fff;z-index:1}.floating-action-button .spinner{position:absolute;top:0;left:0;width:56px;height:56px;border-color:#fff}.floating-action-button .ripple{background:#fff}@-webkit-keyframes container-rotate{to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes container-rotate{to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@-webkit-keyframes fill-unfill-rotate{12.5%{-webkit-transform:rotate(135deg);transform:rotate(135deg)}25%{-webkit-transform:rotate(270deg);transform:rotate(270deg)}37.5%{-webkit-transform:rotate(405deg);transform:rotate(405deg)}50%{-webkit-transform:rotate(540deg);transform:rotate(540deg)}62.5%{-webkit-transform:rotate(675deg);transform:rotate(675deg)}75%{-webkit-transform:rotate(810deg);transform:rotate(810deg)}87.5%{-webkit-transform:rotate(945deg);transform:rotate(945deg)}to{-webkit-transform:rotate(1080deg);transform:rotate(1080deg)}}@keyframes fill-unfill-rotate{12.5%{-webkit-transform:rotate(135deg);transform:rotate(135deg)}25%{-webkit-transform:rotate(270deg);transform:rotate(270deg)}37.5%{-webkit-transform:rotate(405deg);transform:rotate(405deg)}50%{-webkit-transform:rotate(540deg);transform:rotate(540deg)}62.5%{-webkit-transform:rotate(675deg);transform:rotate(675deg)}75%{-webkit-transform:rotate(810deg);transform:rotate(810deg)}87.5%{-webkit-transform:rotate(945deg);transform:rotate(945deg)}to{-webkit-transform:rotate(1080deg);transform:rotate(1080deg)}}@-webkit-keyframes left-spin{from{-webkit-transform:rotate(130deg);transform:rotate(130deg)}50%{-webkit-transform:rotate(-5deg);transform:rotate(-5deg)}to{-webkit-transform:rotate(130deg);transform:rotate(130deg)}}@keyframes left-spin{from{-webkit-transform:rotate(130deg);transform:rotate(130deg)}50%{-webkit-transform:rotate(-5deg);transform:rotate(-5deg)}to{-webkit-transform:rotate(130deg);transform:rotate(130deg)}}@-webkit-keyframes right-spin{from{-webkit-transform:rotate(-130deg);transform:rotate(-130deg)}50%{-webkit-transform:rotate(5deg);transform:rotate(5deg)}to{-webkit-transform:rotate(-130deg);transform:rotate(-130deg)}}@keyframes right-spin{from{-webkit-transform:rotate(-130deg);transform:rotate(-130deg)}50%{-webkit-transform:rotate(5deg);transform:rotate(5deg)}to{-webkit-transform:rotate(-130deg);transform:rotate(-130deg)}}@-webkit-keyframes fade-in{from{opacity:0}to{opacity:1}}@keyframes fade-in{from{opacity:0}to{opacity:1}}@-webkit-keyframes fade-out{from{opacity:1}to{opacity:0}}@keyframes fade-out{from{opacity:1}to{opacity:0}}.spinner{display:inline-block;position:relative;width:28px;height:28px;border-color:#4285f4}.spinner .circle{position:absolute;top:0;left:0;right:0;bottom:0;box-sizing:border-box;height:100%;border-width:3px;border-style:solid;border-color:inherit;border-bottom-color:transparent !important;border-radius:50%}.spinner .gap-patch{position:absolute;box-sizing:border-box;top:0;left:45%;width:10%;height:100%;overflow:hidden;border-color:inherit}.spinner .gap-patch .circle{width:1000%;left:-450%}.spinner .circle-clipper{display:inline-block;position:relative;width:50%;height:100%;overflow:hidden;border-color:inherit}.spinner .circle-clipper.left .circle{border-right-color:transparent !important;-webkit-transform:rotate(129deg);transform:rotate(129deg);-webkit-animation:left-spin 1333ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;animation:left-spin 1333ms cubic-bezier(0.4, 0, 0.2, 1) infinite both}.spinner .circle-clipper.right .circle{left:-100%;border-left-color:transparent !important;-webkit-transform:rotate(-129deg);transform:rotate(-129deg);-webkit-animation:right-spin 1333ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;animation:right-spin 1333ms cubic-bezier(0.4, 0, 0.2, 1) infinite both}.spinner .circle-clipper .circle{width:200%}.spinner.cooldown{-webkit-animation:fade-out 400ms cubic-bezier(0.4, 0, 0.2, 1) both;animation:fade-out 400ms cubic-bezier(0.4, 0, 0.2, 1) both}.spinner-container{width:100%;height:100%;border-color:inherit;-webkit-animation:container-rotate 1568ms linear infinite;animation:container-rotate 1568ms linear infinite}.spinner-layer{position:absolute;width:100%;height:100%;opacity:1;border-color:inherit;-webkit-animation:fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;animation:fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both}.toasts{position:absolute;z-index:3;bottom:0;left:0;right:0}@media (min-width: 640px){.toasts{bottom:30px;left:30px;right:auto}}.toast{color:#fff;background:#323232;padding:14px 29px;display:-webkit-flex;display:flex;-webkit-animation:fade-in 0.5s ease-out;animation:fade-in 0.5s ease-out;-webkit-transition:opacity 0.3s ease-out;transition:opacity 0.3s ease-out}@media (min-width: 640px){.toast{min-width:288px;max-width:568px;border-radius:2px}}.toast.hide{opacity:0}.toast .toast-content{margin-right:24px}.toast button{margin:0 0 0 auto;color:#00BCD4;text-transform:uppercase;min-width:-webkit-min-content;min-width:-moz-min-content;min-width:min-content}.toast button:focus{outline:none;color:#fff}.material-slider{display:block;cursor:pointer;position:relative}.material-slider .track{position:relative;height:2px;background:rgba(0,0,0,0.26);pointer-events:none}.material-slider .track-on{position:relative;width:0%;height:100%;background:#3F51B5}.material-slider .handle{background:#3F51B5;width:30px;height:30px;border-radius:50%;position:absolute;top:50%;-webkit-transform:translate(-50%, -50%) scale(0.45) translateZ(0);transform:translate(-50%, -50%) scale(0.45) translateZ(0);display:-webkit-flex;display:flex;-webkit-align-items:center;align-items:center;-webkit-transition:-webkit-transform 0.1s ease-out;transition:transform 0.1s ease-out}.material-slider .arrow{background:inherit;width:60%;height:60%;position:absolute;top:14px;left:20%;-webkit-transform:translateY(-35%) rotate(45deg) translateZ(0);transform:translateY(-35%) rotate(45deg) translateZ(0);-webkit-transition:-webkit-transform 0.1s ease-out;transition:transform 0.1s ease-out}.material-slider .val{position:relative;color:#fff;text-align:center;width:100%;line-height:1;font-size:0.8rem;opacity:0;-webkit-transition:opacity 0.1s ease-out;transition:opacity 0.1s ease-out;-webkit-transform:translateZ(0);transform:translateZ(0)}.material-slider input[type=range]{cursor:inherit;position:absolute;top:0;left:0;margin:0;width:100%;height:60px;-webkit-transform:translateY(-50%);transform:translateY(-50%);opacity:0}@supports (width: calc(100% + 10px)){.material-slider input[type=range]{width:calc(100% + 10px);margin-left:-5px}}.material-slider input[type=range]::-ms-tooltip{display:none}.material-slider :focus+.track .handle,.material-slider .active+.track .handle{-webkit-transform:translate(-50%, -145%) translateZ(0);transform:translate(-50%, -145%) translateZ(0)}.material-slider :focus+.track .val,.material-slider .active+.track .val{opacity:1}.material-slider :focus+.track .arrow,.material-slider .active+.track .arrow{-webkit-transform:rotate(45deg) translateZ(0);transform:rotate(45deg) translateZ(0)}.drop-overlay{position:absolute;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,0.7);z-index:3;text-align:center;color:#fff;font-size:4.8rem;font-size:17vw;pointer-events:none;display:none;opacity:0;-webkit-align-items:center;align-items:center;-webkit-justify-content:center;justify-content:center}.drop-overlay.transition{display:-webkit-flex;display:flex;-webkit-transition:opacity 0.2s ease-out;transition:opacity 0.2s ease-out}.drop-overlay.active{display:-webkit-flex;display:flex;opacity:1}.changelog{font-size:0.9rem;color:#898989;padding:12px 16px;opacity:0}.changelog.transition{-webkit-transition:opacity 0.2s ease-out;transition:opacity 0.2s ease-out}.changelog.active{opacity:1}.changelog h1{font-size:0.9rem;margin:0;padding:0;font-weight:normal}.changelog li{display:-webkit-flex;display:flex;margin:0.7em 0;line-height:1.5}.changelog li::before{content:'-';margin:0 1em 0 0}.svg-output{-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;position:absolute;top:0;left:0;right:0;bottom:0;opacity:0}.svg-output.transition{-webkit-transition:opacity 0.2s ease-in-out;transition:opacity 0.2s ease-in-out}.svg-output.active{opacity:1}.svg-container{position:absolute;top:0;left:0;right:0;bottom:0;-webkit-transform-origin:0 0;transform-origin:0 0;-webkit-transform:translateZ(0);transform:translateZ(0)}.svg-frame{border:none;overflow:hidden;position:absolute;top:50%;left:50%;pointer-events:none;-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%)}.svg-clickjacker{position:absolute;top:0;left:0;right:0;bottom:0}.material-tabs{-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;display:-webkit-flex;display:flex;-webkit-align-self:stretch;align-self:stretch;text-transform:uppercase;overflow:hidden;position:relative;line-height:1;font-size:0.9rem}.material-tabs input{position:absolute;height:1px;width:1px;overflow:hidden;clip:rect(1px, 1px, 1px, 1px)}.material-tab{display:-webkit-flex;display:flex;-webkit-align-items:center;align-items:center;fill:#fff;padding:0 24px;cursor:pointer;position:relative}.material-tab .selected{position:absolute;bottom:0;left:0;right:0;top:0;border-bottom:2px solid transparent}.material-tab :checked+.selected,.material-tab :focus+.selected{border-color:#00BCD4}.material-tab :focus+.selected{background:rgba(255,255,255,0.1)}.results{background:#3F51B5;color:#fff;padding:12px 16px;z-index:1}@media (min-width: 640px){.results{background:#FFF;color:#000;box-shadow:0 3px 3px rgba(0,0,0,0.2);z-index:4;padding:7px 11px;font-size:0.9rem;padding-right:25px;border-radius:2px}.results .decrease{color:green}.results .increase{color:red}}.results .diff{margin-left:0.5em}.output-switcher{position:absolute;top:0;left:0;right:0;bottom:0}.code-output{position:absolute;top:0;left:0;right:0;bottom:0;overflow:auto;-webkit-overflow-scrolling:touch;color:#f8f8f2;background:rgba(0,0,0,0.8);opacity:0;-webkit-transform:translateZ(0);transform:translateZ(0)}.code-output.transition{-webkit-transition:opacity 0.2s ease-in-out;transition:opacity 0.2s ease-in-out}.code-output.active{opacity:1}.code-output code{font-family:Inconsolata, monospace;line-height:1.5;font-size:0.9rem;display:block;padding:14px}@media (min-width: 900px){.code-output{width:100vw}.code-output code{font-size:1rem;padding-right:380px}}.code-output pre{margin:0;white-space:pre-wrap;word-wrap:break-word}.token.comment,.token.prolog,.token.doctype,.token.cdata{color:slategray}.token.punctuation{color:#f8f8f2}.namespace{opacity:.7}.token.property,.token.tag,.token.constant,.token.symbol,.token.deleted{color:#f92672}.token.boolean,.token.number{color:#ae81ff}.token.selector,.token.attr-name,.token.string,.token.char,.token.builtin,.token.inserted{color:#a6e22e}.token.operator,.token.entity,.token.url,.language-css .token.string,.style .token.string,.token.variable{color:#f8f8f2}.token.atrule,.token.attr-value{color:#e6db74}.token.keyword{color:#66d9ef}.token.regex,.token.important{color:#fd971f}.token.important,.token.bold{font-weight:bold}.token.italic{font-style:italic}@-webkit-keyframes ripple-pop{from{-webkit-transform:scale(0);transform:scale(0);opacity:1}20%{opacity:1}to{-webkit-transform:scale(1);transform:scale(1);opacity:0}}@keyframes ripple-pop{from{-webkit-transform:scale(0);transform:scale(0);opacity:1}20%{opacity:1}to{-webkit-transform:scale(1);transform:scale(1);opacity:0}}.ripple{position:absolute;top:-2px;left:-2px;right:-2px;bottom:-2px;background:#00bcd4;border-radius:100%;opacity:0;pointer-events:none;display:block}.ripple.animate{-webkit-animation:ripple-pop 0.5s cubic-bezier(0.23, 1, 0.32, 1);animation:ripple-pop 0.5s cubic-bezier(0.23, 1, 0.32, 1)}
|
|
|
|
/*# sourceMappingURL=all.css.map */
|