[verified] feat: expand public animation library across 12 industries
This commit is contained in:
1 parent
3bb9555e6a
commit
ecbbcf8ba0
144 files changed
+61323
-187
No files matched your search
@@ -1,3 +1 @@
|
||||
*{box-sizing:border-box}body{margin:0;background:#101823;color:#eef5ff;font:16px/1.5 system-ui,sans-serif}header,main,footer{max-width:1100px;margin:auto;padding:24px}h1{font-size:2.2rem;margin:0}h2{font-size:1.3rem}header p,article p{color:#bfcede}main{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,440px),1fr));gap:22px}article{padding:22px;border:1px solid #425065;border-radius:12px;background:#182333}article p{min-height:3em}svg{width:100%;display:block;background:#111c2b;border-radius:8px}svg text{fill:#eef5ff;font-size:14px}.guide{fill:none;stroke:#425065;stroke-width:5}.trace{fill:none;stroke:#69ded2;stroke-width:4}.cell{fill:#2a6d82;stroke:#85e7df;stroke-width:2}.packet{fill:#ffd787;stroke:#101823;stroke-width:2}.controls{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:16px}button{font:inherit;border:1px solid #8da4be;background:#263b52;color:#fff;border-radius:5px;padding:6px 12px;cursor:pointer}button:focus-visible,input:focus-visible{outline:3px solid #ffd787;outline-offset:3px}label{display:flex;align-items:center;gap:6px}input{width:100px}output{display:block;color:#bfcede;font-size:.85rem;margin-top:8px}footer{color:#bfcede}summary{cursor:pointer}pre{white-space:pre-wrap}@media print{.controls,output{display:none}article{break-inside:avoid}main{display:block}}
|
||||
/* Gallery pages compose the very same individual documents, never a second renderer. */
|
||||
a{color:#85e7df;text-underline-offset:3px}nav{margin-bottom:18px;color:#bfcede}main{display:block}.preview-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,440px),1fr));gap:22px}section{margin-bottom:36px}.preview-grid article{padding:0;overflow:hidden}iframe{width:100%;height:510px;border:0;display:block}.open-example{display:block;padding:16px 22px;border-top:1px solid #425065}body[data-example] main{max-width:850px}body[data-example] article h2{display:none}body[data-example] article p{min-height:0}.embedded header,.embedded footer{display:none}.embedded main{padding:18px}.embedded article{padding:12px;border:0}body[data-example].embedded article h2{display:block;margin-top:0}.embedded article p{min-height:3em}.embedded svg{max-height:255px}a:focus-visible{outline:3px solid #ffd787;outline-offset:3px}@media(max-width:500px){header,main,footer{padding:16px}h1{font-size:1.8rem}}
|
||||
*{box-sizing:border-box}body{margin:0;background:#101823;color:#eef5ff;font:16px/1.5 system-ui,sans-serif}header,main,footer{max-width:1300px;margin:auto;padding:24px}h1{font-size:2.2rem;margin:0}h2{font-size:1.3rem}header p,article p{color:#bfcede}article{padding:22px;border:1px solid #425065;border-radius:12px;background:#182333}svg{width:100%;display:block;background:#111c2b;border-radius:8px}svg{font-family:system-ui,sans-serif;font-size:14px;fill:#eef5ff}.industry svg{font-size:18px}.guide{fill:none;stroke:#425065;stroke-width:5}.trace{fill:none;stroke:#69ded2;stroke-width:4}.cell{fill:#2a6d82;stroke:#85e7df;stroke-width:2}.packet{fill:#ffd787;stroke:#101823;stroke-width:2}.controls,.beats{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:16px}button{font:inherit;border:1px solid #8da4be;background:#263b52;color:#fff;border-radius:5px;padding:6px 12px;cursor:pointer}button:focus-visible,input:focus-visible,a:focus-visible{outline:3px solid #ffd787;outline-offset:3px}label{display:flex;align-items:center;gap:6px}input{width:160px}output{display:block;color:#bfcede;font-size:.85rem;margin-top:8px}footer{color:#bfcede}summary{cursor:pointer}pre{white-space:pre-wrap}a{color:#85e7df;text-underline-offset:3px}nav{margin-bottom:18px;color:#bfcede}.registry-nav{display:flex;flex-wrap:wrap;gap:10px}.registry-nav a{padding:8px 14px;background:#203248;border:1px solid #425065;border-radius:6px}.preview-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,510px),1fr));gap:22px}section{margin-bottom:36px}.preview-grid article{padding:0;overflow:hidden;container-type:inline-size}iframe{width:100%;height:calc(56.25cqw + 150px);min-height:360px;border:0;display:block}.open-example{display:block;padding:16px 22px;border-top:1px solid #425065}body[data-example] main{max-width:1120px}body[data-example] article h2{display:none}.guidance{border-top:1px solid #425065;margin:24px 0 0;padding-top:12px}.guidance h3{font-size:1rem;margin-bottom:4px}.guidance p{margin-top:0}.beats button{font-size:.9rem}.embedded header,.embedded footer,.embedded .guidance,.embedded .beats,.embedded .controls label,.embedded article>p{display:none}.embedded .controls{margin-top:10px}.embedded main{padding:8px}.embedded article{padding:8px;border:0}body[data-example].embedded article h2{display:block;margin:0 0 8px;font-size:1rem}.embedded svg{max-height:none}@media(max-width:500px){header,main,footer{padding:16px}h1{font-size:1.8rem}article{padding:12px}.controls label{width:100%}}@media print{.controls,.beats,output{display:none}article{break-inside:avoid}}
|
||||
Reference in new issue
Block a user