node-red-contrib-uibuilder
Version:
Easily create data-driven web UI's for Node-RED. Single- & Multi-page. Multiple UI's. Work with existing web development workflows or mix and match with no-code/low-code features.
3 lines (2 loc) • 22.5 kB
CSS
:root,:root.light{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;--mode:light;--uib-css:uib-brand;--font-family:-apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";--brand-hue:200;--text-hue:var(--brand-hue);--surface-hue:var(--brand-hue);--complementary-offset:180;--accent-offset:30;--saturation-bias:0;--light-saturation:.66;--dark-saturation:calc(var(--light-saturation)*.6);--saturation-value:var(--light-saturation);--saturation:calc(var(--saturation-value) + var(--saturation-bias));--lightness-bias:0;--light-lightness:.57;--dark-lightness:calc(var(--light-lightness)*.75);--lightness-value:var(--light-lightness);--lightness:calc(var(--lightness-value) + var(--lightness-bias));--base-margin:1rem;--max-width:64rem;--border-radius:.5rem;--border-pad:.5rem;--border-margin:0;--grid-fit-min:15rem;--emoji-fonts:"Twemoji Mozilla","Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji","EmojiOne Color","Android Emoji",sans-serif;--brand:hsl(var(--brand-hue)calc(100%*var(--saturation))calc(100%*var(--lightness)));--surface-shadow-light:var(--brand-hue)10% 20%;--shadow-strength-light:.02;--surface-shadow-dark:var(--brand-hue)30% 30%;--shadow-strength-dark:.1;--surface-shadow:var(--surface-shadow-light);--shadow-strength:var(--shadow-strength-light);--shadow1:0 2.8px 2.2px hsl(var(--surface-shadow)/calc(var(--shadow-strength) + .03)),0 6.7px 5.3px hsl(var(--surface-shadow)/calc(var(--shadow-strength) + .01)),0 12.5px 10px hsl(var(--surface-shadow)/calc(var(--shadow-strength) + .02)),0 22.3px 17.9px hsl(var(--surface-shadow)/calc(var(--shadow-strength) + .02)),0 41.8px 33.4px hsl(var(--surface-shadow)/calc(var(--shadow-strength) + .03)),0 100px 80px hsl(var(--surface-shadow)/var(--shadow-strength));--shadow2:.2px .3px .3px hsl(var(--surface-shadow)/calc(var(--shadow-strength) + .031)),.5px .7px .7px hsl(var(--surface-shadow)/calc(var(--shadow-strength) + .053)),1px 1.3px 1.3px hsl(var(--surface-shadow)/calc(var(--shadow-strength) + .07)),1.8px 2.2px 2.2px hsl(var(--surface-shadow)/calc(var(--shadow-strength) + .087)),3.3px 4.2px 4.2px hsl(var(--surface-shadow)/calc(var(--shadow-strength) + .109)),8px 10px 10px hsl(var(--surface-shadow)/calc(var(--shadow-strength) + .16));--shadow:var(--shadow1);--text-saturation:.2;--text-bias:0;--light-text-lightness:.1;--light-text-factor:1;--dark-text-lightness:.9;--dark-text-factor:-1;--text-factor:var(--light-text-factor);--text-lightness:var(--light-text-lightness);--text1:hsl(var(--text-hue)calc(100%*var(--text-saturation))calc(100%*(var(--text-lightness) + (0*var(--text-factor)*.2) - (var(--text-factor)*var(--text-bias)))));--text2:hsl(var(--text-hue)calc(100%*(var(--text-saturation)/2))calc(100%*(var(--text-lightness) + (1*var(--text-factor)*.2) - (var(--text-factor)*var(--text-bias)))));--text3:hsl(var(--text-hue)calc(100%*(var(--text-saturation)/2))calc(100%*(var(--text-lightness) + (1*var(--text-factor)*.4) - (var(--text-factor)*var(--text-bias)))));--text4:hsl(var(--text-hue)10% calc(50% - (100%*var(--text-factor)*var(--text-bias)))/calc(25% + (100%*var(--text-bias))));--surfaces-saturation:.1;--surfaces-bias:0;--light-surfaces-lightness:.95;--light-surfaces-factor:1;--dark-surfaces-lightness:.1;--dark-surfaces-factor:-1;--surfaces-factor:var(--light-surfaces-factor);--surfaces-lightness:var(--light-surfaces-lightness);--surface1:hsl(var(--surface-hue)calc(100%*var(--surfaces-saturation))calc(100%*(var(--surfaces-lightness) - (var(--surfaces-factor)*0) + (var(--surfaces-factor)*var(--surfaces-bias)))));--surface2:hsl(var(--surface-hue)calc(100%*var(--surfaces-saturation))calc(100%*(var(--surfaces-lightness) - (var(--surfaces-factor)*.05) + (var(--surfaces-factor)*var(--surfaces-bias)))));--surface3:hsl(var(--surface-hue)calc(100%*var(--surfaces-saturation))calc(100%*(var(--surfaces-lightness) - (var(--surfaces-factor)*.1) + (var(--surfaces-factor)*var(--surfaces-bias)))));--surface4:hsl(var(--surface-hue)calc(100%*var(--surfaces-saturation))calc(100%*(var(--surfaces-lightness) - (var(--surfaces-factor)*.15) + (var(--surfaces-factor)*var(--surfaces-bias)))));--surface5:hsl(var(--surface-hue)calc(100%*var(--surfaces-saturation))calc(100%*(var(--surfaces-lightness) - (var(--surfaces-factor)*.2) + (var(--surfaces-factor)*var(--surfaces-bias)))));--info-hue:203;--info-saturation-bias:0;--info-lightness-bias:0;--info-hsl:var(--info-hue)calc(100%*(var(--saturation) + var(--info-saturation-bias)))calc(100%*(var(--lightness) + var(--info-lightness-bias)));--info:hsl(var(--info-hsl));--info-intense:hsl(var(--info-hue)100% 50%);--success-hue:120;--success-saturation-bias:0;--success-lightness-bias:0;--success:hsl(var(--success-hue)calc(100%*(var(--saturation) + var(--success-saturation-bias)))calc(100%*(var(--lightness) + var(--success-lightness-bias))));--success-intense:hsl(var(--success-hue)100% 50%);--warning-hue:40;--warning-saturation-bias:0;--warning-lightness-bias:0;--warning:hsl(var(--warning-hue)calc(100%*(var(--saturation) + var(--warning-saturation-bias)))calc(100%*(var(--lightness) + var(--warning-lightness-bias))));--warning-intense:hsl(var(--warning-hue)100% 50%);--warn:var(--warning);--failure-hue:2;--failure-saturation-bias:0;--failure-lightness-bias:0;--failure:hsl(var(--failure-hue)calc(100%*(var(--saturation) + var(--failure-saturation-bias)))calc(100%*(var(--lightness) + var(--failure-lightness-bias))));--failure-intense:hsl(var(--failure-hue)100% 50%);--error:var(--failure);--danger:var(--failure);--complementary-hue:calc(var(--brand-hue) + var(--complementary-offset));--complementary-fg:hsl(var(--brand-hue)calc(100%*var(--saturation))calc(100%*var(--lightness)));--complementary-bg:hsl(var(--complementary-hue)calc(100%*var(--saturation))calc(100%*var(--lightness)));--complementary:hsl(calc(var(--complementary-hue))calc(100%*var(--saturation))calc(100%*var(--lightness)));--primary-hue:calc(var(--brand-hue) + var(--complementary-offset) + var(--accent-offset));--primary-fg:hsl(calc(var(--primary-hue) + var(--complementary-offset))calc(100%*var(--saturation))calc(100%*var(--lightness)));--primary-bg:hsl(var(--primary-hue)calc(100%*var(--saturation))calc(100%*var(--lightness)));--primary:var(--primary-bg);--secondary-hue:calc(var(--brand-hue) + var(--complementary-offset) - var(--accent-offset));--secondary-fg:hsl(calc(var(--secondary-hue) + var(--complementary-offset))calc(100%*var(--saturation))calc(100%*var(--lightness)));--secondary-bg:hsl(var(--secondary-hue)calc(100%*var(--saturation))calc(100%*var(--lightness)));--secondary:var(--secondary-bg)}@media (prefers-color-scheme:dark){:root,:root.light{--lightningcss-light: ;--lightningcss-dark:initial}}@media (prefers-color-scheme:light){:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;--mode:light}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial}}}@media (prefers-color-scheme:dark){:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;--mode:dark;--saturation-value:var(--dark-saturation);--lightness-value:var(--dark-lightness);--surface-shadow:var(--surface-shadow-dark);--shadow-strength:var(--shadow-strength-dark);--text-factor:var(--dark-text-factor);--text-lightness:var(--dark-text-lightness);--surfaces-factor:var(--dark-surfaces-factor);--surfaces-lightness:var(--dark-surfaces-lightness)}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial}}}:root.dark{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;--mode:dark;--saturation-value:var(--dark-saturation);--lightness-value:var(--dark-lightness);--surface-shadow:var(--surface-shadow-dark);--shadow-strength:var(--shadow-strength-dark);--text-factor:var(--dark-text-factor);--text-lightness:var(--dark-text-lightness);--surfaces-factor:var(--dark-surfaces-factor);--surfaces-lightness:var(--dark-surfaces-lightness)}@media (prefers-color-scheme:dark){:root.dark{--lightningcss-light: ;--lightningcss-dark:initial}}.brand{color:var(--text1);background-color:var(--brand)}.complementary{color:var(--text1);background-color:var(--complementary)}.surface1{background-color:var(--surface1);color:var(--text2)}.surface2{background-color:var(--surface2);color:var(--text2)}.surface3{background-color:var(--surface3);color:var(--text1)}.surface4{background-color:var(--surface4);color:var(--text1)}.surface5{background-color:var(--surface5);color:var(--text1)}.rad-shadow{box-shadow:var(--shadow)}.info{color:var(--text1);background-color:var(--info)}.info-intense{color:var(--text1);background-color:var(--info-intense)}.success{color:var(--text1);background-color:var(--success)}.success-intense{color:var(--text1);background-color:var(--success-intense)}.warning,.warn{color:var(--text1);background-color:var(--warning)}.warning-intense,.warn-intense{color:var(--text1);background-color:var(--warning-intense)}.failure,.error,.danger{color:var(--text1);background-color:var(--failure)}.failure-intense,.error-intense,.danger-intense{color:var(--text1);background-color:var(--failure-intense)}.primary{color:var(--primary-fg);background-color:var(--primary-bg)}.secondary{color:var(--secondary-fg);background-color:var(--secondary-bg)}*,:before,:after{box-sizing:border-box}:focus-visible{outline:2px solid var(--secondary-fg);outline-offset:2px}@supports not selector(:focus-visible){:focus{outline:1px solid var(--secondary-fg);outline-offset:-4px}}html{background-color:var(--surface1);color:var(--text2);accent-color:var(--brand);font-size:100%;line-height:1.5}body{margin-left:var(--base-margin);margin-right:var(--base-margin);font-family:var(--font-family);-webkit-font-smoothing:antialiased}h1,h2,h3,h4,h5,h6,heading{text-wrap:balance;line-height:calc(1em + .5rem)}p,li,figcaption{text-wrap:pretty}img,picture,video,canvas,svg{object-fit:cover;vertical-align:bottom;background-color:var(--surface2);max-width:100%;margin:var(--base-margin)}p,h1,h2,h3,h4,h5,h6,heading,li,dl,dt,blockquote{overflow-wrap:break-word;-webkit-hyphens:auto;hyphens:auto;word-break:break-word}div>p,div>article{margin-left:var(--base-margin);margin-right:var(--base-margin)}button{background-color:var(--info);color:var(--text1);cursor:pointer;text-align:center;-webkit-appearance:none;appearance:none;border-radius:var(--border-radius);border:none;justify-content:center;align-items:center;padding:.5rem 1rem;font-family:inherit;font-size:1rem;line-height:1.1;text-decoration:none;transition:background .25s ease-in-out,transform .15s;box-shadow:inset 2px 2px 3px rgba(255,255,255,.3),inset -2px -2px 3px rgba(0,0,0,.3)}input[type=button i]{background-color:var(--info);color:var(--text1);cursor:pointer;text-align:center;-webkit-appearance:none;appearance:none;border-radius:var(--border-radius);border:none;justify-content:center;align-items:center;padding:.5rem 1rem;font-family:inherit;font-size:1rem;line-height:1.1;text-decoration:none;transition:background .25s ease-in-out,transform .15s;box-shadow:inset 2px 2px 3px rgba(255,255,255,.3),inset -2px -2px 3px rgba(0,0,0,.3)}input[type=reset i]{background-color:var(--info);color:var(--text1);cursor:pointer;text-align:center;-webkit-appearance:none;appearance:none;border-radius:var(--border-radius);border:none;justify-content:center;align-items:center;padding:.5rem 1rem;font-family:inherit;font-size:1rem;line-height:1.1;text-decoration:none;transition:background .25s ease-in-out,transform .15s;box-shadow:inset 2px 2px 3px rgba(255,255,255,.3),inset -2px -2px 3px rgba(0,0,0,.3)}input[type=submit i]{background-color:var(--info);color:var(--text1);cursor:pointer;text-align:center;-webkit-appearance:none;appearance:none;border-radius:var(--border-radius);border:none;justify-content:center;align-items:center;padding:.5rem 1rem;font-family:inherit;font-size:1rem;line-height:1.1;text-decoration:none;transition:background .25s ease-in-out,transform .15s;box-shadow:inset 2px 2px 3px rgba(255,255,255,.3),inset -2px -2px 3px rgba(0,0,0,.3)}::-webkit-file-upload-button{background-color:var(--info);color:var(--text1);cursor:pointer;text-align:center;-webkit-appearance:none;appearance:none;border-radius:var(--border-radius);border:none;justify-content:center;align-items:center;padding:.5rem 1rem;font-family:inherit;font-size:1rem;line-height:1.1;text-decoration:none;transition:background .25s ease-in-out,transform .15s;box-shadow:inset 2px 2px 3px rgba(255,255,255,.3),inset -2px -2px 3px rgba(0,0,0,.3)}::file-selector-button{background-color:var(--info);color:var(--text1);cursor:pointer;text-align:center;-webkit-appearance:none;appearance:none;border-radius:var(--border-radius);border:none;justify-content:center;align-items:center;padding:.5rem 1rem;font-family:inherit;font-size:1rem;line-height:1.1;text-decoration:none;transition:background .25s ease-in-out,transform .15s;box-shadow:inset 2px 2px 3px rgba(255,255,255,.3),inset -2px -2px 3px rgba(0,0,0,.3)}button:hover{background-color:hsl(var(--info-hsl)/.5)}input[type=button i]:hover{background-color:hsl(var(--info-hsl)/.5)}input[type=reset i]:hover{background-color:hsl(var(--info-hsl)/.5)}input[type=submit i]:hover{background-color:hsl(var(--info-hsl)/.5)}button:active{transform:scale(.97)}input[type=button i]:active{transform:scale(.97)}input[type=reset i]:active{transform:scale(.97)}input[type=submit i]:active{transform:scale(.97)}input,button,textarea,select{font:inherit;min-width:2em}blockquote{border:1px solid var(--text3);box-shadow:var(--shadow);padding:.3rem}code{font-size:120%}header,footer,main,section,article{container-type:inline-size}article{max-width:var(--max-width);border:1px solid var(--text3);border-radius:var(--border-radius);padding:var(--border-pad);margin:1rem var(--border-margin);background-color:var(--surface3)}article>h1:before{color:hsl(var(--failure-hue)100% 50%);content:"⛔ Do not use H1 headings in articles. ";font-size:50%}article>h2,article>h3,article>h4{border-bottom:1px solid var(--text3);margin-top:0;padding-bottom:var(--border-pad)}body>main,body>header,body>footer,body>section{padding-left:var(--base-margin);padding-right:var(--base-margin);max-width:var(--max-width);margin:0 auto}body>main{gap:1rem;display:grid}footer{margin-top:1em}main>article,main .left{grid-column:1}main>aside,main .right{grid-column:2}summary>h2,summary>h3,summary>h4,summary>div,summary>p{display:inline-block}table{border-collapse:collapse;border:1px solid var(--text3);font-variant-numeric:tabular-nums;margin-top:1rem;margin-bottom:1rem}thead th,thead td{color:var(--text2);background:var(--surface4);font-weight:bolder}tfoot th,tfoot td{color:var(--text2);background:var(--surface4);font-style:italic}tbody th{color:var(--text2);background:var(--surface4);background-blend-mode:lighten;text-align:left;font-style:italic;font-weight:lighter}th[scope=row]{color:var(--text2);background:var(--surface4);background-blend-mode:lighten;text-align:left;font-style:italic;font-weight:lighter}th,td{border:1px solid var(--text4);padding:.5rem}tbody tr:nth-child(2n){color:var(--text2);background-color:var(--surface3);background-blend-mode:lighten}td hr{margin-top:.5em;margin-bottom:.5em}td br,th br{content:"";margin-top:.8em;line-height:190%;display:block}form{border:1px solid var(--text3);border-radius:var(--border-radius);flex-direction:column;gap:1em;margin:.5rem;padding:.5rem;display:flex}input[type=color]{width:100%;height:2.5rem}input:invalid,textarea:invalid,select:invalid{border:2px solid var(--failure)}form input,form textarea,form select,form fieldset,form output{border-radius:var(--border-radius);border:1px solid var(--text3);flex:2;padding:.2rem}form select{cursor:pointer;background-color: hsl(var(--brand-hue)calc(60%*var(--saturation))calc(100%*var(--lightness)));transition:background .25s ease-in-out,transform .15s;box-shadow:inset 1px 1px 2px rgba(255,255,255,.3),inset -1px -1px 2px rgba(0,0,0,.3)}form button{width:auto;margin-left:.2em;margin-right:.2em}input[type=button i]{width:auto;margin-left:.2em;margin-right:.2em}form input[type=reset i]{width:auto;margin-left:.2em;margin-right:.2em}form input[type=submit i]{width:auto;margin-left:.2em;margin-right:.2em}form input[type=checkbox i]{vertical-align:middle;height:1.5em}form input[type=radio i]{vertical-align:middle;height:1.5em}form:invalid button{background-color:var(--warning)}form label{vertical-align:middle;flex:1;display:inline-block}form label[required]:after{content:" *"}form>div{display:inherit;vertical-align:middle}form>div:focus-within{font-weight:700}form>label{text-transform:capitalize;align-self:center}form>label:focus-within{font-weight:700}@media (max-width:37.5em){form,form *{width:100%;display:block}form>label,form>div.btn-row{margin-top:.8rem}form>:not(label){margin-bottom:.5rem}}nav a{color:inherit;background-color:inherit;text-decoration:none}nav li:not([aria-current]):hover{filter:brightness(120%);text-decoration:underline}nav [aria-current=page]{filter:brightness(130%);font-weight:bolder}nav.horizontal{background-color:var(--surface3);align-items:center;padding:0 .1rem;display:flex}nav.horizontal>h2{font-size:inherit;font-weight:inherit;padding-left:.5rem}nav.horizontal [role=menubar],nav.horizontal ul{flex:2;justify-content:flex-start;margin:0;padding:0;list-style-type:none;display:flex}nav.horizontal li{padding:.2rem .4rem}nav.horizontal form{margin:inherit;padding:inherit;border:none;flex-flow:row;flex:1;align-items:center;gap:.2rem;display:inline-flex}nav.horizontal input[type=search]{filter:brightness(120%);flex:3}nav.horizontal input[type=submit]{filter:brightness(120%);flex:1;padding:.5rem 0;font-size:large;font-weight:bolder}@media (max-width:600px){nav.horizontal,nav.horizontal ul{flex-direction:column}}.checklist:not(:-webkit-any(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi))){margin-left:var(--base-margin);margin-right:var(--base-margin);padding-left:.2rem}.checklist:not(:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi))){margin-left:var(--base-margin);margin-right:var(--base-margin);padding-left:.2rem}.checklist:-webkit-any(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)){margin-right:var(--base-margin);margin-left:var(--base-margin);padding-right:.2rem}.checklist:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)){margin-right:var(--base-margin);margin-left:var(--base-margin);padding-right:.2rem}li.check,li.completed{font-family:var(--emoji-fonts);padding-left:.4rem;list-style-type:"✅"}li.uncheck,li.unstarted{font-family:var(--emoji-fonts);padding-left:.4rem;list-style-type:"❌"}li.started{font-family:var(--emoji-fonts);padding-left:.4rem;list-style-type:"✔️"}.animate-pulse{animation:2s cubic-bezier(.4,0,.6,1) infinite pulse}@keyframes pulse{50%{opacity:.5}}.border{border:1px solid var(--text3);border-radius:var(--border-radius);padding:var(--border-pad);margin:var(--border-margin)}.box{border:1px solid var(--text3);border-radius:var(--border-radius);padding:.5rem}.box h2,.box h3,.box h4,.box h5,.box h6{margin-top:.5rem}.centre,.center{text-align:center;margin-left:auto;margin-right:auto}.compact{margin:0;padding-top:.2rem;padding-bottom:.2rem}button.compact{background:inherit;border-radius:0;margin:2px;padding:2px 5px}.emoji{font-family:var(--emoji-fonts)}.noborder{border:none}.status-side-panel{background-color:var(--surface1);border-radius:9999px;width:.5rem;height:100%}.text-larger{font-size:larger}.text-smaller{font-size:smaller}.square{--sq:5em;width:var(--sqw,var(--sq));height:var(--sqh,var(--sq));border-radius:calc(var(--sq)*.1)}.round{--dia:5em;width:var(--roundw,var(--dia));height:var(--roundh,var(--dia));border-radius:var(--roundb,var(--dia))}.with-subtitle{margin-bottom:0}[role=doc-subtitle]{margin-bottom:1em;font-size:smaller;font-style:italic}.uppercase{text-transform:uppercase}.toaster{-webkit-backdrop-filter:grayscale(60%)blur(10px);backdrop-filter:grayscale(60%)blur(10px);z-index:998;flex-direction:column;justify-content:center;align-items:center;min-width:100vw;min-height:100vh;display:flex;position:absolute;top:0;left:0}.toast,.toast.alert{border:4px solid var(--text3);border-radius:var(--border-radius);box-shadow:var(--shadow2);box-sizing:border-box;z-index:999;background-clip:border-box;min-width:50vw;max-width:50vw;max-height:50vh;margin-top:.5em;margin-bottom:.5em;padding:1em;overflow-y:auto}.toast-head{font-weight:700}.status-grid{grid-template-columns:repeat(auto-fit,minmax(14em,1fr));gap:.5rem;list-style-position:inside;display:grid}.status-heading{grid-column:1/-1}.status-link{color:inherit;text-decoration:none;display:contents}.grid{gap:.5rem;display:grid}.grid-2{grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem;display:grid}.grid-3{grid-template-columns:repeat(3,minmax(0,1fr));gap:.5rem;display:grid}.grid-4{grid-template-columns:repeat(4,minmax(0,1fr));gap:.5rem;display:grid}.grid-fit{grid-template-columns:repeat(auto-fit,minmax(min(var(--grid-fit-min),100%),1fr));gap:.5rem;display:grid}.flex{gap:.5rem;display:flex}.flex-wrap{flex-wrap:wrap;gap:.5rem;display:flex}#uib_last_msg_wrap{position:relative}#uib_last_msg_wrap>button{color:rgba(128,128,128,.5);display:none;position:absolute}#uib_last_msg_wrap:hover>button{display:initial}#uib_last_msg_wrap>button:hover{color:gray}.syntax-highlight{color:#fff;white-space:pre;resize:both;background-color:#000;width:99%;height:22em;padding:5px 10px;font-family:Consolas,"ui-monospace",Lucida Console,monospace;font-size:smaller;display:block;overflow:auto}.syntax-highlight>.key{color:#ffbf35}.syntax-highlight>.string{color:#5dff39}.syntax-highlight>.number{color:#70aeff}.syntax-highlight>.boolean{color:#b993ff}.syntax-highlight>.null{color:#93ffe4}.syntax-highlight>.undefined{color:#ff93c9}
/*# sourceMappingURL=uib-brand.min.css.map */