1
0
Fork 0
mirror of https://github.com/DanielnetoDotCom/YouPHPTube synced 2025-10-03 17:59:55 +02:00
Oinktube/node_modules/js-circle-progress/docs/css/style.css
2022-09-08 12:40:21 -03:00

1 line
9.5 KiB
CSS

body{font-family:sans-serif;background:#e6e6e6;margin:0}pre{margin:0}a{color:#06c;font-weight:bold;text-decoration:none;transition:.25s}a:hover,a:focus{color:#106}.example::before,.example::after{content:" ";display:table}.example::after{clear:both}.container{max-width:60rem;margin:auto}.site-footer{background:#fff;padding:25px;border-radius:3px 3px 0 0}.check{display:inline-block;margin-right:.5em;color:#14b850;animation:check .1s .7s backwards}@keyframes check{from{opacity:0;transform:scale(0)}80%{opacity:1;transform:scale(1.3)}to{transform:none}}.intro-heading{animation:bounce-in .4s ease-in-out}@keyframes bounce-in{0%{transform:translateY(-2.7em);animation-timing-function:ease-out}50%{transform:translateY(10px) scaleY(1.4)}75%{transform:translateY(-6px) scaleY(1.2)}90%{transform:translateY(2.5px)}100%{transform:none}}.intro{color:#4d4d4d}.intro .example{position:relative;display:flex;flex-wrap:wrap;overflow:hidden;min-height:calc(300px + 25px * 2)}.intro .progress{padding:20px 50px 0 20px;width:300px}.intro .progress>svg{width:100%}.intro .progress>svg *{transform-box:fill-box;transform-origin:center}.intro .progress .circle-progress-value{stroke-width:6px;stroke:#ffa600}.intro .progress .circle-progress-circle{stroke-width:6px;stroke:#ffe4b3}.intro .progress .circle-progress-text{fill:#ffa600}.intro .progress .circle-progress-text-value{fill:inherit}.intro .progress[data-style="1"] .circle-progress-value{transition:.4s .3s;stroke-linecap:round;stroke-width:12;stroke:#ed5aed}.intro .progress[data-style="1"] .circle-progress-circle{transition:.4s;stroke:#f7baf7;stroke-width:3}.intro .progress[data-style="1"] .circle-progress-text{fill:#4d4d4d;font-size:22px;transition:.4s}.intro .progress[data-style="2"] .circle-progress-value{animation:.4s dots both;stroke-width:12;stroke-linecap:round}@keyframes dots{from{stroke-dasharray:14 2;stroke:#ed5aed}to{stroke-dasharray:0 17.7;stroke:#ff0073}}.intro .progress[data-style="2"] .circle-progress-circle{transition:.4s .4s;stroke-width:0;stroke:#d9d9d9}.intro .progress[data-style="2"] .circle-progress-text{fill:#4d4d4d;font-size:22px;transform:scale(0);opacity:0;transition:.4s}.intro .progress[data-style="3"] .circle-progress-value{animation:grow-value .5s both;stroke-width:12;stroke-linecap:round;stroke:#ff0073}@keyframes grow-value{0%{stroke-dasharray:0 17.7}99.99%{stroke-dasharray:14 2}100%{stroke-dasharray:none}}.intro .progress[data-style="3"] .circle-progress-circle{stroke-width:0;stroke:#d9d9d9}.intro .progress[data-style="3"] .circle-progress-text{fill:#ff0073;font-size:16px;transition:transform .4s}.intro .progress[data-style="4"] .circle-progress-value{animation:value-4 .5s both;stroke-width:12;stroke-linecap:round;stroke:#ff0073}@keyframes value-4{30%{stroke-width:12}80%{stroke-width:2}100%{stroke:#fff;stroke-width:4}}.intro .progress[data-style="4"] .circle-progress-circle{animation:grow-circle .5s both;stroke-width:0;stroke:#d9d9d9}@keyframes grow-circle{0%{stroke-width:0}37%{stroke-width:6}100%{stroke-width:6}}.intro .progress[data-style="4"] .circle-progress-text{fill:#d9d9d9;font-size:16px;transition:transform .4s}.intro .progress[data-style="5"] .circle-progress-value{animation:.4s grow-xxl-value both}.intro .progress[data-style="5"] .circle-progress-circle{animation:.4s grow-xxl-circle both;stroke:#d9d9d9}@keyframes grow-xxl-value{from{stroke:#fff}to{stroke-width:50;stroke:#39f;stroke-linecap:butt}}@keyframes grow-xxl-circle{from{stroke-width:6}to{stroke-width:50}}.intro .progress[data-style="5"] .circle-progress-text{fill:#fff;transition:.4s;transform:translate(23.7px, 7.7px)}.intro .progress[data-style="5"] .circle-progress-text-max{display:none}.intro .progress[data-style="5"] .circle-progress-text-value{font-size:16px}.intro:not([data-demo]) .progress{animation:check .2s .6s backwards}.intro:not([data-demo]) .quality{visibility:hidden;animation:none}.intro[data-demo=responsive] .progress{animation:demo-responsive 1.6s .7s}@keyframes demo-responsive{0%{transform:none}12%{transform:scale(0.3)}40%{transform:scale(0.3)}55%{transform:scale(1.3)}92%{transform:scale(1.3)}100%{transform:none}}.intro[data-demo=responsive] .quality.responsive~.quality{visibility:hidden;animation:none}.intro[data-demo=animated] .quality.animated~.quality{visibility:hidden;animation:none}.intro[data-demo=stylable] .quality.stylable~.quality{visibility:hidden;animation:none}.intro[data-demo=finished] .quality-last,.intro[data-demo=finished] .quality-lastest,.intro[data-demo=finished] .intro-footer{visibility:visible;opacity:1}.intro-text{display:flex;flex-direction:column}.intro-text-body{flex:auto}.qualities{list-style:none}.quality{opacity:0;font-weight:bold;animation:pop-in .4s cubic-bezier(0.74, 0.92, 0.71, 1) forwards;transform-origin:left}.quality.last{visibility:hidden;animation:none}.quality-inner{animation:skidding .4s cubic-bezier(0.74, 0.92, 0.71, 1) forwards;transform-origin:bottom left}@keyframes pop-in{0%{transform:translateX(100%)}80%{transform:translateX(-10px);opacity:1}92%{transform:none;opacity:1}100%{transform:none;opacity:1}}@keyframes skidding{0%{transform:none}50%{transform:none;animation-timing-function:ease-in}80%{transform:skewX(30deg) scaleX(0.9);animation-timing-function:ease-in}92%{transform:none}}.quality-last,.quality-lastest,.intro-footer{visibility:hidden;opacity:0;transition:.3s}.intro-footer,.quality-lastest{transition:3s 1.5s ease-out}.intro-footer{font-size:.9rem}.about{padding:25px;background:#383838;color:#ebebeb;border-radius:0 0 3px 3px}.about a{color:#39f}.about a:hover,.about a:focus{color:#9e9efa}.about h1{text-align:center}.example{clear:both;margin:30px 0;padding:10px 5px;background:#fff;border-radius:3px}@media screen and (min-width: 50rem){.example{padding:25px}}.example-figure{width:-moz-min-content;width:min-content;margin:auto}@media screen and (min-width: 50rem){.example-figure{float:left;padding-top:2.4rem;padding-right:80px}}[class^=progress]>svg,[class*=" progress"]>svg{width:300px;height:300px}.controls{display:flex;justify-content:space-between;margin-top:20px}.controls input{display:block;width:4em;padding:.3em .6em;text-align:left;background:#d9d9d9;border:0;font-size:.85em}.controls input:focus{background:#b3b3b3;outline:none}.controls label{font-weight:bold;color:#666}.controls label:nth-child(2){text-align:center}.controls label:last-child{text-align:right}.example h3{font-size:1.1rem;line-height:1.4rem;margin:1rem 0 0;color:#e6491a}.slash{color:gray}.select-variant{text-decoration:none;color:inherit}.select-variant[data-variant=jquery]{color:gray}.variant-jquery{display:none}body.show-variant-jquery .select-variant[data-variant=vanilla]{color:gray}body.show-variant-jquery .select-variant[data-variant=jquery]{color:inherit}body.show-variant-jquery .variant-jquery{display:block}body.show-variant-jquery .variant-vanilla{display:none}.code{background:#383838;-moz-tab-size:4;tab-size:4}.progress-1 .circle-progress-value{stroke-width:6px;stroke:#ffa600}.progress-1 .circle-progress-circle{stroke-width:6px;stroke:#ffe4b3}.progress-1 .circle-progress-text{fill:#ffa600}.progress-2 .circle-progress-value{stroke-width:6px;stroke:#eb47b4;stroke-dasharray:4 1}.progress-2 .circle-progress-circle{stroke-width:6px;stroke:#eee}.progress-2 .circle-progress-text{font-weight:bold;fill:#18d8d8}.progress-3 .circle-progress-value{stroke-width:6px;stroke:#a60df2;stroke-linecap:round}.progress-3 .circle-progress-circle{stroke-width:2px}.progress-4 .circle-progress-value{stroke-width:50px;stroke:#44d5a4}.progress-4 .circle-progress-circle{stroke-width:50px;stroke:#999}.progress-4 .circle-progress-text{fill:#fff}.progress-5 .circle-progress-value{stroke-width:6px;stroke:#fff;stroke-linecap:round}.progress-5 .circle-progress-circle{stroke-width:8px;stroke:#888}.progress-5 .circle-progress-text{fill:#888}.progress-6 .circle-progress-value{stroke-width:50px;stroke:#9cf76e}.progress-6 .circle-progress-circle{stroke-width:40px;stroke:#94a88a;fill:#94a88a}.progress-6 .circle-progress-text{fill:#fff;font-weight:bold}.progress-7 .circle-progress-value{stroke-width:11px;stroke:aqua;stroke-dasharray:0 23.3;stroke-linecap:round}.progress-7[aria-valuenow="0"] .circle-progress-value{display:none}.progress-7 .circle-progress-circle{stroke:transparent}.progress-7 .circle-progress-text{font-family:"Varela Round","Gotham rounded",sans-serif;font-size:13px;font-weight:bold;fill:#f0f}.progress-9 .circle-progress-value{stroke-width:12px;stroke:#0073e6}.progress-9 .circle-progress-circle{stroke:#fff;stroke-width:22px;fill:#666}.progress-9 .circle-progress-text{font-family:"Georgia",serif;font-size:13px;fill:#fff}.progress-10 .circle-progress-value{stroke-width:2px;stroke:#7fffd4}.progress-10 .circle-progress-circle{stroke:#ddd;stroke-width:2px}.progress-10 .circle-progress-text{font-family:"Georgia",serif;font-size:13px}.progress-11 .circle-progress-value{stroke-width:6px;stroke:#7f3;stroke-dasharray:.6 3}.progress-11 .circle-progress-circle{stroke-width:6px;stroke:#ddd;stroke-dasharray:.6 3;stroke-dashoffset:1.6}.progress-11 .circle-progress-text{font-family:"Dosis","Varela Round","Gotham Rounded Light",sans-serif;fill:#6de92f;font-size:26px}.progress-12 .circle-progress-value{stroke-width:12px;stroke:#8b008b}.progress-12 .circle-progress-circle{stroke:#fff;stroke-width:11px;fill:#666}.progress-12 .circle-progress-text{font-family:"Georgia",serif;font-size:13px;fill:#fff}.progress-13 .circle-progress-value{stroke-width:25px;stroke:#0073e6;stroke-dasharray:58 1}.progress-13 .circle-progress-circle{stroke:#b3d9ff;stroke-width:25px;fill:#b3d9ff}.progress-13 .circle-progress-text{font-family:"Montserrat","Gotham",sans-serif;font-size:16px;fill:#0073e6}/*# sourceMappingURL=style.css.map */