@open-yama/theme-toolbar 0.1.0

package/dist/yama-toolbar.css

@@ -0,0 +1 @@
+.yama-toolbar{position:fixed;left:0;right:0;bottom:0;z-index:1000;pointer-events:none;display:flex;flex-direction:column;align-items:center;color:#fff;font-family:ui-sans-serif,system-ui,Noto Sans!important}.yama-toolbar__content{pointer-events:auto;width:100%;min-width:0;max-width:min(92vw,42rem);display:flex;flex-direction:column;align-items:center;padding:0 .75rem 2rem}.yama-toolbar__inner{position:relative;width:100%;display:flex;flex-direction:column;align-items:center;opacity:.4;transform:translateY(3.8rem);transition:opacity .24s ease .16s,transform .32s cubic-bezier(.2,.8,.2,1) .16s}.yama-toolbar__content:hover .yama-toolbar__inner,.yama-toolbar__content:focus-within .yama-toolbar__inner,.yama-toolbar[data-panel-open] .yama-toolbar__inner{opacity:1;transform:translateY(2rem);transition-delay:0ms}@media(prefers-reduced-motion:reduce){.yama-toolbar__inner{transition:none}}.yama-toolbar__spacer{height:.5rem;width:100%;flex:0 0 auto}.panel{--panel-scroll-max: 11rem;position:absolute;left:0;right:0;bottom:calc(100% + .5rem);z-index:1;width:100%;overflow:visible;border-radius:1rem;border:1px solid rgba(255,255,255,.1);box-shadow:0 25px 50px -12px #0006,inset 0 0 0 1px #ffffff0d;transform-origin:bottom;transition:opacity .22s ease,transform .28s cubic-bezier(.2,.8,.2,1)}.panel--open{opacity:1;transform:translateY(0) scale(1);pointer-events:auto}.panel--closed{opacity:0;transform:translateY(.5rem) scale(.99);pointer-events:none}@media(prefers-reduced-motion:reduce){.panel{transition:none}}.panel__header{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;min-height:3.25rem;box-sizing:border-box;padding:.625rem .75rem;border-bottom:1px solid rgba(255,255,255,.1)}.panel__title{font-size:.75rem;line-height:1rem;font-weight:500;color:#a1a1aa;margin:0}.panel__spacer{flex:1 1 auto}.panel__body{max-height:var(--panel-scroll-max);overflow:auto;border-bottom-left-radius:1rem;border-bottom-right-radius:1rem;padding:.5rem;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.2) transparent}.panel__body::-webkit-scrollbar{width:10px;height:10px}.panel__body::-webkit-scrollbar-track{background:transparent}.panel__body::-webkit-scrollbar-thumb{background:#ffffff2e;border-radius:999px;border:3px solid transparent;background-clip:content-box}.panel__body::-webkit-scrollbar-thumb:hover{background:#ffffff3d;border:3px solid transparent;background-clip:content-box}@media(max-width:639px){.panel__body::-webkit-scrollbar{width:6px;height:6px}.panel__body::-webkit-scrollbar-thumb{border-width:2px}}.yama-toolbar__toolbar{position:relative;z-index:10;pointer-events:auto;display:flex;align-items:center;gap:.125rem;border-radius:999px;box-shadow:0 25px 50px -12px #00000080,inset 0 0 0 1px #ffffff0d;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.1)}.yama-toolbar__item{position:relative;display:flex;flex-direction:column;align-items:center}.yama-toolbar__button{appearance:none;border:0;background:transparent;color:#fff;width:2.75rem;height:2.75rem;flex:0 0 auto;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background-color .15s ease}.yama-toolbar__item:first-child .yama-toolbar__button{border-top-left-radius:999px;border-bottom-left-radius:999px}.yama-toolbar__item:last-child .yama-toolbar__button{border-top-right-radius:999px;border-bottom-right-radius:999px}.yama-toolbar__button:hover{background:#ffffff1a}.yama-toolbar__button:active{background:#ffffff26}.yama-toolbar__button:disabled{opacity:.35;pointer-events:none}.yama-toolbar__icon{width:1.5rem;height:1.5rem;display:flex;align-items:center;justify-content:center}.yama-toolbar__icon svg{width:100%;height:100%}[data-sonner-toaster]{font-family:inherit}[data-sonner-toast]{color:#fff;border:1px solid rgba(255,255,255,.12);border-radius:.85rem;background:linear-gradient(180deg,#13151a,#13151ae0);box-shadow:0 25px 50px -12px #0000008c,inset 0 0 0 1px #ffffff0d;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}[data-sonner-toast] [data-title]{font-weight:650;letter-spacing:-.01em}[data-sonner-toast] [data-description]{color:#f4f4f5d9}[data-sonner-toast][data-type=success]{border-color:#30a48459}[data-sonner-toast][data-type=error]{border-color:#ef444459}[data-sonner-toast] [data-close-button]{color:#f4f4f5d9;border:1px solid rgba(255,255,255,.12);background:#ffffff0f;border-radius:.5rem;transition:background-color .15s ease,border-color .15s ease,color .15s ease}[data-sonner-toast] [data-close-button]:hover{background:#ffffff1a;border-color:#ffffff29;color:#fff}.color-panel__grid{display:grid;grid-template-columns:1fr;gap:.5rem}@media(min-width:640px){.color-panel__grid{grid-template-columns:1fr 1fr}}.color-panel__active-theme{font-weight:600;color:#f4f4f5}.color-panel__copy-button{height:32px;width:32px;appearance:none;border:1px solid rgba(255,255,255,.14);border-radius:.5rem;padding:.35rem;display:flex;align-items:center;justify-content:center;color:#e4e4e7;background:#ffffff0f;cursor:pointer;transition:background-color .15s ease,border-color .15s ease}.color-panel__copy-button:hover{background:#ffffff1a;border-color:#fff3}.color-panel__copy-button:focus-visible{outline:none;box-shadow:0 0 0 2px #38bdf873}.color-row__label{font-size:.75rem;line-height:1rem;font-weight:500;color:#a1a1aa;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-bottom:.25rem}.color-row__inputs{display:flex;align-items:center;gap:.5rem;padding:.625rem;border-radius:.75rem;border:1px solid rgba(255,255,255,.1);background:#09090b80}.color-row__swatch{width:2.5rem;height:2.25rem;flex:0 0 auto;cursor:pointer;border-radius:.5rem;background:#18181b;padding:0;box-shadow:inset 0 0 0 1px #ffffff14,0 1px #00000040}.color-row__text{width:100%;height:2.25rem;margin-top:0;border-radius:.5rem;border:1px solid rgba(255,255,255,.1);background:#18181bcc;padding:.375rem .5rem;font-size:.875rem;line-height:1.1rem;color:#f4f4f5}.color-row__text::placeholder{color:#71717a}.color-row__text:focus-visible{outline:none;box-shadow:0 0 0 2px #0885a08c}.color-row__swatch:focus-visible{outline:none;box-shadow:0 0 0 2px #0885a08c}.yama-tooltip{position:relative;display:inline-flex;align-items:center;justify-content:center}.yama-tooltip__bubble{pointer-events:none;position:absolute;z-index:20;white-space:nowrap;border-radius:4px;padding:.25rem .5rem;font-size:11px;line-height:1rem;font-weight:500;color:#fff;opacity:0;transition:opacity .15s ease;box-shadow:0 10px 15px -3px #00000080;outline:1px solid rgba(255,255,255,.1);background:linear-gradient(180deg,#13151a,#13151ae0)}.yama-tooltip--top-left .yama-tooltip__bubble{inset:auto auto 100% 0;margin-bottom:6px;transform:none}.yama-tooltip--top .yama-tooltip__bubble{inset:auto auto 100% 50%;margin-bottom:6px;transform:translate(-50%)}.yama-tooltip--top-right .yama-tooltip__bubble{inset:auto 0 100% auto;margin-bottom:6px;transform:none}.yama-tooltip--bottom-left .yama-tooltip__bubble{inset:100% auto auto 0;margin-top:6px;transform:none}.yama-tooltip--bottom .yama-tooltip__bubble{inset:100% auto auto 50%;margin-top:6px;transform:translate(-50%)}.yama-tooltip--bottom-right .yama-tooltip__bubble{inset:100% 0 auto auto;margin-top:6px;transform:none}.yama-tooltip:hover .yama-tooltip__bubble{opacity:1}.main-panel{--panel-scroll-max: 16rem;display:flex;flex-direction:column}.main-panel.panel--open{z-index:2}.main-panel__shell{display:contents}.main-panel.main-panel--fullscreen .main-panel__shell{display:flex;flex-direction:column;flex:1;min-height:0;width:100%}.main-panel__prose-container{display:contents}.main-panel.main-panel--fullscreen .main-panel__prose-container{display:block;width:100%}@media(min-width:1024px){.main-panel.main-panel--fullscreen .main-panel__prose-container{max-width:64rem;margin-inline:auto}}.main-panel.main-panel--fullscreen.panel--open{position:fixed;z-index:100000;left:max(.75rem,env(safe-area-inset-left,0px));right:max(.75rem,env(safe-area-inset-right,0px));top:max(.75rem,env(safe-area-inset-top,0px));bottom:max(.75rem,env(safe-area-inset-bottom,0px));width:auto;max-width:none;transform:none}.main-panel.main-panel--fullscreen .panel__body{max-height:none}.main-panel__fullscreen-btn{appearance:none;border:1px solid rgba(255,255,255,.14);border-radius:.5rem;padding:.35rem;display:flex;align-items:center;justify-content:center;color:#e4e4e7;background:#ffffff0f;cursor:pointer;transition:background-color .15s ease,border-color .15s ease}.main-panel__fullscreen-btn:hover{background:#ffffff1a;border-color:#fff3}.main-panel__fullscreen-btn:focus-visible{outline:none;box-shadow:0 0 0 2px #38bdf873}.main-panel .panel__body{flex:1;min-height:0}.main-panel__err{margin:0 0 .5rem;font-size:.75rem;color:#fca5a5}.main-panel__prose{max-width:100%;font-size:.875rem;line-height:1.625;color:#d4d4d8;padding:.25rem .75rem;font-family:ui-sans-serif,system-ui,Noto Sans!important}.main-panel__prose :where(h1,h2,h3,h4){font-weight:600;color:#fafafa;letter-spacing:-.025em;line-height:1.3;margin-top:1.5em;margin-bottom:.5em}.main-panel__prose h1:first-child,.main-panel__prose h2:first-child,.main-panel__prose h3:first-child{margin-top:0}.main-panel__prose h1{font-size:1.25rem;border-bottom:1px solid rgba(255,255,255,.12);padding-bottom:.35em}.main-panel__prose h2{font-size:1.0625rem;margin-top:1.75em}.main-panel__prose h3{font-size:1rem;color:#e4e4e7}.main-panel__prose h4{font-size:.9375rem;color:#e4e4e7}.main-panel__prose :where(p){margin:.75em 0}.main-panel__prose :where(a){color:#7dd3fc;text-decoration:underline;text-underline-offset:2px}.main-panel__prose :where(a):hover{color:#bae6fd}.main-panel__prose :where(strong,b){font-weight:600;color:#f4f4f5}.main-panel__prose :where(video){max-width:100%;height:auto;border-radius:.375rem;margin:1em 0}.main-panel__prose ul,.main-panel__prose ol{margin:.75em 0;padding-left:1.5em;list-style-position:inside}.main-panel__prose ul{list-style-type:disc}.main-panel__prose ol{list-style-type:decimal}.main-panel__prose li{display:list-item;margin:.35em 0}.main-panel__prose li>ul,.main-panel__prose li>ol{margin:.35em 0}.main-panel__prose li>p{margin:.25em 0}.main-panel__prose li>p:first-child{margin-top:0}.main-panel__prose li>p:last-child{margin-bottom:0}.main-panel__prose :where(blockquote){margin:1em 0;padding-left:1em;border-left:3px solid rgba(56,189,248,.45);color:#a1a1aa;font-style:italic}.main-panel__prose :where(code){font-size:.8125em;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;background:#18181bd9;padding:.15em .35em;border-radius:.25rem;border:1px solid rgba(255,255,255,.08);color:#e4e4e7}.main-panel__prose :where(pre){margin:1em 0;padding:.75rem 1rem;overflow-x:auto;font-size:.8125rem;line-height:1.55;background:#09090ba6;border-radius:.5rem;border:1px solid rgba(255,255,255,.1)}.main-panel__prose :where(pre code){font-size:inherit;padding:0;border:0;background:transparent;color:inherit}.main-panel__prose :where(hr){margin:1.5em 0;border:0;border-top:1px solid rgba(255,255,255,.12)}.main-panel__prose :where(table){width:100%;font-size:.8125rem;border-collapse:collapse;margin:1em 0}.main-panel__prose :where(th,td){border:1px solid rgba(255,255,255,.12);padding:.4em .65em;text-align:left}.main-panel__prose :where(th){font-weight:600;color:#f4f4f5;background:#ffffff0d}.main-panel__prose :where(img){max-width:100%;height:auto;border-radius:.375rem;margin:1em 0}