UNPKG

@getontime/cli

Version:
2 lines (1 loc) 2.23 kB
.blink{animation:blink 1s step-start infinite}@keyframes blink{0%{opacity:100%}50%{opacity:20%}}.fourtyfive{transform:rotate(45deg)}.mirror{transform:rotate(180deg)}.pip-timer{margin:0;padding:0;box-sizing:border-box;overflow:hidden;width:100%;height:100vh;transition:opacity .5s ease-in-out;font-family:Open Sans,Segoe UI,sans-serif;background:#101010;color:#fffc;gap:min(2vh,16px);display:flex;flex-direction:column}.pip-timer--finished{outline:clamp(4px,1vw,16px) solid #FA5656;outline-offset:calc(clamp(4px,1vw,16px)*-1);transition:.5s}.pip-timer .timer-container{flex:1;align-content:center;justify-self:center;align-self:center;width:100%;overflow:hidden}.pip-timer .timer-container .timer{opacity:1;font-family:Open Sans,Segoe UI,sans-serif;color:var(--timer-colour, #f6f6f6);line-height:.9em;text-align:center;letter-spacing:.05em;font-weight:600;transition-property:font-size;transition-duration:.5s}.pip-timer .timer-container .timer--paused{opacity:.6;transition:.5s}.pip-timer .timer-container .timer--finished{color:var(--timer-overtime-color-override, #FA5656)}.pip-timer .timer-container .timer[data-phase=warning]{color:var(--timer-colour, var(--timer-warning-color-override))}.pip-timer .timer-container .timer[data-phase=danger]{color:var(--timer-colour, var(--timer-danger-color-override))}.pip-timer .timer-container .timer[data-type=none]{transition:1s;opacity:0}.pip-timer .secondary{white-space:nowrap;max-height:100%;height:auto;margin-top:.125em;padding-block:.125em;font-weight:600;text-align:center;color:#ffffffd9;letter-spacing:.5px;line-height:1;transition-property:opacity,height;transition-duration:.5s;border-top:1px solid color-mix(in srgb,rgba(255,255,255,.85) 10%,transparent)}.pip-timer .secondary--hidden{opacity:0;height:0}.pip-timer .progress-container{width:100%;margin:0 auto;opacity:1;transition:.5s}.pip-timer .progress-container--paused{opacity:.6;transition:.5s}.pip-timer .message-overlay{position:fixed;top:0;right:0;bottom:0;left:0;padding:2vw;background:#101010;opacity:0;transition:opacity .5s}.pip-timer .message-overlay--active{z-index:100;opacity:1}.pip-timer .message{display:grid;place-content:center;height:100%;width:100%;color:#fffc;text-align:center;font-weight:600}