@kong-ui-public/sandbox-layout 2.1.13 → 2.1.14
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -265,7 +265,7 @@ const q = "kong-ui-sandbox-layout-links", Z = {
|
|
|
265
265
|
},
|
|
266
266
|
setup(e) {
|
|
267
267
|
M((i) => ({
|
|
268
|
-
|
|
268
|
+
bfdbd112: o.value
|
|
269
269
|
}));
|
|
270
270
|
const t = e;
|
|
271
271
|
O(q, t.links);
|
|
@@ -359,7 +359,7 @@ const q = "kong-ui-sandbox-layout-links", Z = {
|
|
|
359
359
|
]);
|
|
360
360
|
};
|
|
361
361
|
}
|
|
362
|
-
}), ve = /* @__PURE__ */ V(_e, [["__scopeId", "data-v-
|
|
362
|
+
}), ve = /* @__PURE__ */ V(_e, [["__scopeId", "data-v-030efc6d"]]);
|
|
363
363
|
export {
|
|
364
364
|
ve as SandboxLayout
|
|
365
365
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
(function(c,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(c=typeof globalThis<"u"?globalThis:c||self,e(c["kong-ui-public-sandbox-layout"]={},c.Vue))})(this,function(c,e){"use strict";const f="kong-ui-sandbox-layout-links",h={key:0,class:"kong-ui-sandbox-navigation"},C=e.defineComponent({__name:"SandboxNavigation",emits:["router-link-click"],setup(t,{emit:o}){const n=o,i=e.inject(f,[]);return(l,r)=>{const p=e.resolveComponent("router-link");return e.openBlock(),e.createElementBlock("nav",null,[e.unref(i).length?(e.openBlock(),e.createElementBlock("ul",h,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(e.unref(i),s=>(e.openBlock(),e.createElementBlock("li",{key:s.name,class:"sandbox-link"},[e.createVNode(p,{to:s.to,onClick:m=>n("router-link-click",s)},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(s.name),1)]),_:2},1032,["to","onClick"])]))),128))])):e.createCommentVNode("",!0)])}}}),g=(t,o)=>{const n=t.__vccOpts||t;for(const[i,l]of o)n[i]=l;return n},_=g(C,[["__scopeId","data-v-2cb154ed"]]),d="24px",k=(t,o)=>{const n=t.__vccOpts||t;for(const[i,l]of o)n[i]=l;return n},y=t=>(e.pushScopeId("data-v-6b6fb40f"),t=t(),e.popScopeId(),t),N=["aria-hidden"],b={key:0,"data-testid":"kui-icon-svg-title"},x=y(()=>e.createElementVNode("path",{d:"M9.2502 22L8.8502 18.8C8.63353 18.7167 8.42936 18.6167 8.2377 18.5C8.04603 18.3833 7.85853 18.2583 7.6752 18.125L4.7002 19.375L1.9502 14.625L4.5252 12.675C4.50853 12.5583 4.5002 12.4458 4.5002 12.3375V11.6625C4.5002 11.5542 4.50853 11.4417 4.5252 11.325L1.9502 9.375L4.7002 4.625L7.6752 5.875C7.85853 5.74167 8.0502 5.61667 8.2502 5.5C8.4502 5.38333 8.6502 5.28333 8.8502 5.2L9.2502 2H14.7502L15.1502 5.2C15.3669 5.28333 15.571 5.38333 15.7627 5.5C15.9544 5.61667 16.1419 5.74167 16.3252 5.875L19.3002 4.625L22.0502 9.375L19.4752 11.325C19.4919 11.4417 19.5002 11.5542 19.5002 11.6625V12.3375C19.5002 12.4458 19.4835 12.5583 19.4502 12.675L22.0252 14.625L19.2752 19.375L16.3252 18.125C16.1419 18.2583 15.9502 18.3833 15.7502 18.5C15.5502 18.6167 15.3502 18.7167 15.1502 18.8L14.7502 22H9.2502ZM12.0502 15.5C13.0169 15.5 13.8419 15.1583 14.5252 14.475C15.2085 13.7917 15.5502 12.9667 15.5502 12C15.5502 11.0333 15.2085 10.2083 14.5252 9.525C13.8419 8.84167 13.0169 8.5 12.0502 8.5C11.0669 8.5 10.2377 8.84167 9.5627 9.525C8.8877 10.2083 8.5502 11.0333 8.5502 12C8.5502 12.9667 8.8877 13.7917 9.5627 14.475C10.2377 15.1583 11.0669 15.5 12.0502 15.5Z",fill:"currentColor"},null,-1)),S=k(e.defineComponent({__name:"CogIcon",props:{title:{type:String,required:!1,default:""},color:{type:String,required:!1,default:"currentColor"},display:{type:String,required:!1,default:"block"},decorative:{type:Boolean,required:!1,default:!1},size:{type:[Number,String],required:!1,default:d,validator:t=>{if(typeof t=="number"&&t>0)return!0;if(typeof t=="string"){const o=String(t).replace(/px/gi,""),n=Number(o);if(n&&!isNaN(n)&&Number.isInteger(n)&&n>0)return!0}return!1}},as:{type:String,required:!1,default:"span"}},setup(t){const o=t,n=e.computed(()=>{if(typeof o.size=="number"&&o.size>0)return`${o.size}px`;if(typeof o.size=="string"){const l=String(o.size).replace(/px/gi,""),r=Number(l);if(r&&!isNaN(r)&&Number.isInteger(r)&&r>0)return`${r}px`}return d}),i=e.computed(()=>({boxSizing:"border-box",color:o.color,display:o.display,height:n.value,lineHeight:"0",width:n.value}));return(l,r)=>(e.openBlock(),e.createBlock(e.resolveDynamicComponent(t.as),{"aria-hidden":t.decorative?"true":void 0,class:"kui-icon cog-icon","data-testid":"kui-icon-wrapper-cog-icon",style:e.normalizeStyle(i.value)},{default:e.withCtx(()=>[(e.openBlock(),e.createElementBlock("svg",{"aria-hidden":t.decorative?"true":void 0,"data-testid":"kui-icon-svg-cog-icon",fill:"none",height:"100%",role:"img",viewBox:"0 0 24 24",width:"100%",xmlns:"http://www.w3.org/2000/svg"},[t.title?(e.openBlock(),e.createElementBlock("title",b,e.toDisplayString(t.title),1)):e.createCommentVNode("",!0),x],8,N))]),_:1},8,["aria-hidden","style"]))}}),[["__scopeId","data-v-6b6fb40f"]]),V=t=>(e.pushScopeId("data-v-9b15c5e5"),t=t(),e.popScopeId(),t),B=["aria-hidden"],E={key:0,"data-testid":"kui-icon-svg-title"},w=V(()=>e.createElementVNode("path",{d:"M3 18V16H21V18H3ZM3 13V11H21V13H3ZM3 8V6H21V8H3Z",fill:"currentColor"},null,-1)),L=k(e.defineComponent({__name:"MenuIcon",props:{title:{type:String,required:!1,default:""},color:{type:String,required:!1,default:"currentColor"},display:{type:String,required:!1,default:"block"},decorative:{type:Boolean,required:!1,default:!1},size:{type:[Number,String],required:!1,default:d,validator:t=>{if(typeof t=="number"&&t>0)return!0;if(typeof t=="string"){const o=String(t).replace(/px/gi,""),n=Number(o);if(n&&!isNaN(n)&&Number.isInteger(n)&&n>0)return!0}return!1}},as:{type:String,required:!1,default:"span"}},setup(t){const o=t,n=e.computed(()=>{if(typeof o.size=="number"&&o.size>0)return`${o.size}px`;if(typeof o.size=="string"){const l=String(o.size).replace(/px/gi,""),r=Number(l);if(r&&!isNaN(r)&&Number.isInteger(r)&&r>0)return`${r}px`}return d}),i=e.computed(()=>({boxSizing:"border-box",color:o.color,display:o.display,height:n.value,lineHeight:"0",width:n.value}));return(l,r)=>(e.openBlock(),e.createBlock(e.resolveDynamicComponent(t.as),{"aria-hidden":t.decorative?"true":void 0,class:"kui-icon menu-icon","data-testid":"kui-icon-wrapper-menu-icon",style:e.normalizeStyle(i.value)},{default:e.withCtx(()=>[(e.openBlock(),e.createElementBlock("svg",{"aria-hidden":t.decorative?"true":void 0,"data-testid":"kui-icon-svg-menu-icon",fill:"none",height:"100%",role:"img",viewBox:"0 0 24 24",width:"100%",xmlns:"http://www.w3.org/2000/svg"},[t.title?(e.openBlock(),e.createElementBlock("title",E,e.toDisplayString(t.title),1)):e.createCommentVNode("",!0),w],8,B))]),_:1},8,["aria-hidden","style"]))}}),[["__scopeId","data-v-9b15c5e5"]]),u="24px",I={class:"kong-ui-sandbox-layout"},z={class:"header"},$={class:"header-left"},q={class:"mobile-nav-container"},T={class:"toggle-mobile-nav"},H={key:0,class:"mobile-title"},M={class:"header-right"},D={key:0,class:"mobile-controls-container"},K={class:"toggle-mobile-controls"},O={class:"layout"},Z={class:"desktop-nav-container"},j={class:"sandbox-container"},A={key:0},U={key:0,class:"sandbox-controls"},W=g(e.defineComponent({__name:"SandboxLayout",props:{title:{type:String,default:""},links:{type:Array,required:!1,default:()=>[]},controlsMinWidth:{type:Number,default:240}},setup(t){e.useCssVars(i=>({
|
|
1
|
+
(function(c,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(c=typeof globalThis<"u"?globalThis:c||self,e(c["kong-ui-public-sandbox-layout"]={},c.Vue))})(this,function(c,e){"use strict";const f="kong-ui-sandbox-layout-links",h={key:0,class:"kong-ui-sandbox-navigation"},C=e.defineComponent({__name:"SandboxNavigation",emits:["router-link-click"],setup(t,{emit:o}){const n=o,i=e.inject(f,[]);return(l,r)=>{const p=e.resolveComponent("router-link");return e.openBlock(),e.createElementBlock("nav",null,[e.unref(i).length?(e.openBlock(),e.createElementBlock("ul",h,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(e.unref(i),s=>(e.openBlock(),e.createElementBlock("li",{key:s.name,class:"sandbox-link"},[e.createVNode(p,{to:s.to,onClick:m=>n("router-link-click",s)},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(s.name),1)]),_:2},1032,["to","onClick"])]))),128))])):e.createCommentVNode("",!0)])}}}),g=(t,o)=>{const n=t.__vccOpts||t;for(const[i,l]of o)n[i]=l;return n},_=g(C,[["__scopeId","data-v-2cb154ed"]]),d="24px",k=(t,o)=>{const n=t.__vccOpts||t;for(const[i,l]of o)n[i]=l;return n},y=t=>(e.pushScopeId("data-v-6b6fb40f"),t=t(),e.popScopeId(),t),N=["aria-hidden"],b={key:0,"data-testid":"kui-icon-svg-title"},x=y(()=>e.createElementVNode("path",{d:"M9.2502 22L8.8502 18.8C8.63353 18.7167 8.42936 18.6167 8.2377 18.5C8.04603 18.3833 7.85853 18.2583 7.6752 18.125L4.7002 19.375L1.9502 14.625L4.5252 12.675C4.50853 12.5583 4.5002 12.4458 4.5002 12.3375V11.6625C4.5002 11.5542 4.50853 11.4417 4.5252 11.325L1.9502 9.375L4.7002 4.625L7.6752 5.875C7.85853 5.74167 8.0502 5.61667 8.2502 5.5C8.4502 5.38333 8.6502 5.28333 8.8502 5.2L9.2502 2H14.7502L15.1502 5.2C15.3669 5.28333 15.571 5.38333 15.7627 5.5C15.9544 5.61667 16.1419 5.74167 16.3252 5.875L19.3002 4.625L22.0502 9.375L19.4752 11.325C19.4919 11.4417 19.5002 11.5542 19.5002 11.6625V12.3375C19.5002 12.4458 19.4835 12.5583 19.4502 12.675L22.0252 14.625L19.2752 19.375L16.3252 18.125C16.1419 18.2583 15.9502 18.3833 15.7502 18.5C15.5502 18.6167 15.3502 18.7167 15.1502 18.8L14.7502 22H9.2502ZM12.0502 15.5C13.0169 15.5 13.8419 15.1583 14.5252 14.475C15.2085 13.7917 15.5502 12.9667 15.5502 12C15.5502 11.0333 15.2085 10.2083 14.5252 9.525C13.8419 8.84167 13.0169 8.5 12.0502 8.5C11.0669 8.5 10.2377 8.84167 9.5627 9.525C8.8877 10.2083 8.5502 11.0333 8.5502 12C8.5502 12.9667 8.8877 13.7917 9.5627 14.475C10.2377 15.1583 11.0669 15.5 12.0502 15.5Z",fill:"currentColor"},null,-1)),S=k(e.defineComponent({__name:"CogIcon",props:{title:{type:String,required:!1,default:""},color:{type:String,required:!1,default:"currentColor"},display:{type:String,required:!1,default:"block"},decorative:{type:Boolean,required:!1,default:!1},size:{type:[Number,String],required:!1,default:d,validator:t=>{if(typeof t=="number"&&t>0)return!0;if(typeof t=="string"){const o=String(t).replace(/px/gi,""),n=Number(o);if(n&&!isNaN(n)&&Number.isInteger(n)&&n>0)return!0}return!1}},as:{type:String,required:!1,default:"span"}},setup(t){const o=t,n=e.computed(()=>{if(typeof o.size=="number"&&o.size>0)return`${o.size}px`;if(typeof o.size=="string"){const l=String(o.size).replace(/px/gi,""),r=Number(l);if(r&&!isNaN(r)&&Number.isInteger(r)&&r>0)return`${r}px`}return d}),i=e.computed(()=>({boxSizing:"border-box",color:o.color,display:o.display,height:n.value,lineHeight:"0",width:n.value}));return(l,r)=>(e.openBlock(),e.createBlock(e.resolveDynamicComponent(t.as),{"aria-hidden":t.decorative?"true":void 0,class:"kui-icon cog-icon","data-testid":"kui-icon-wrapper-cog-icon",style:e.normalizeStyle(i.value)},{default:e.withCtx(()=>[(e.openBlock(),e.createElementBlock("svg",{"aria-hidden":t.decorative?"true":void 0,"data-testid":"kui-icon-svg-cog-icon",fill:"none",height:"100%",role:"img",viewBox:"0 0 24 24",width:"100%",xmlns:"http://www.w3.org/2000/svg"},[t.title?(e.openBlock(),e.createElementBlock("title",b,e.toDisplayString(t.title),1)):e.createCommentVNode("",!0),x],8,N))]),_:1},8,["aria-hidden","style"]))}}),[["__scopeId","data-v-6b6fb40f"]]),V=t=>(e.pushScopeId("data-v-9b15c5e5"),t=t(),e.popScopeId(),t),B=["aria-hidden"],E={key:0,"data-testid":"kui-icon-svg-title"},w=V(()=>e.createElementVNode("path",{d:"M3 18V16H21V18H3ZM3 13V11H21V13H3ZM3 8V6H21V8H3Z",fill:"currentColor"},null,-1)),L=k(e.defineComponent({__name:"MenuIcon",props:{title:{type:String,required:!1,default:""},color:{type:String,required:!1,default:"currentColor"},display:{type:String,required:!1,default:"block"},decorative:{type:Boolean,required:!1,default:!1},size:{type:[Number,String],required:!1,default:d,validator:t=>{if(typeof t=="number"&&t>0)return!0;if(typeof t=="string"){const o=String(t).replace(/px/gi,""),n=Number(o);if(n&&!isNaN(n)&&Number.isInteger(n)&&n>0)return!0}return!1}},as:{type:String,required:!1,default:"span"}},setup(t){const o=t,n=e.computed(()=>{if(typeof o.size=="number"&&o.size>0)return`${o.size}px`;if(typeof o.size=="string"){const l=String(o.size).replace(/px/gi,""),r=Number(l);if(r&&!isNaN(r)&&Number.isInteger(r)&&r>0)return`${r}px`}return d}),i=e.computed(()=>({boxSizing:"border-box",color:o.color,display:o.display,height:n.value,lineHeight:"0",width:n.value}));return(l,r)=>(e.openBlock(),e.createBlock(e.resolveDynamicComponent(t.as),{"aria-hidden":t.decorative?"true":void 0,class:"kui-icon menu-icon","data-testid":"kui-icon-wrapper-menu-icon",style:e.normalizeStyle(i.value)},{default:e.withCtx(()=>[(e.openBlock(),e.createElementBlock("svg",{"aria-hidden":t.decorative?"true":void 0,"data-testid":"kui-icon-svg-menu-icon",fill:"none",height:"100%",role:"img",viewBox:"0 0 24 24",width:"100%",xmlns:"http://www.w3.org/2000/svg"},[t.title?(e.openBlock(),e.createElementBlock("title",E,e.toDisplayString(t.title),1)):e.createCommentVNode("",!0),w],8,B))]),_:1},8,["aria-hidden","style"]))}}),[["__scopeId","data-v-9b15c5e5"]]),u="24px",I={class:"kong-ui-sandbox-layout"},z={class:"header"},$={class:"header-left"},q={class:"mobile-nav-container"},T={class:"toggle-mobile-nav"},H={key:0,class:"mobile-title"},M={class:"header-right"},D={key:0,class:"mobile-controls-container"},K={class:"toggle-mobile-controls"},O={class:"layout"},Z={class:"desktop-nav-container"},j={class:"sandbox-container"},A={key:0},U={key:0,class:"sandbox-controls"},W=g(e.defineComponent({__name:"SandboxLayout",props:{title:{type:String,default:""},links:{type:Array,required:!1,default:()=>[]},controlsMinWidth:{type:Number,default:240}},setup(t){e.useCssVars(i=>({bfdbd112:n.value}));const o=t;e.provide(f,o.links);const n=e.computed(()=>`${o.controlsMinWidth}px`);return(i,l)=>{const r=e.resolveComponent("KSlideout"),p=e.resolveComponent("KToggle"),s=e.resolveComponent("router-link");return e.openBlock(),e.createElementBlock("div",I,[e.createElementVNode("header",z,[e.createElementVNode("div",$,[e.createElementVNode("div",q,[e.createVNode(p,null,{default:e.withCtx(({isToggled:m,toggle:a})=>[e.createElementVNode("div",null,[e.createElementVNode("div",T,[e.createVNode(e.unref(L),{role:"button",size:e.unref(u),title:"Toggle menu",onClick:a},null,8,["size","onClick"])]),e.createVNode(r,{title:"Main Menu",visible:m.value,onClose:a},{default:e.withCtx(()=>[e.createVNode(_,{onRouterLinkClick:a},null,8,["onRouterLinkClick"])]),_:2},1032,["visible","onClose"])])]),_:1}),t.title?(e.openBlock(),e.createElementBlock("h1",H,[e.createVNode(s,{class:"home-link",to:{name:"home"}},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(t.title),1)]),_:1})])):e.createCommentVNode("",!0)])]),e.createElementVNode("div",M,[i.$slots.controls?(e.openBlock(),e.createElementBlock("div",D,[e.createVNode(p,null,{default:e.withCtx(({isToggled:m,toggle:a})=>[e.createElementVNode("div",null,[e.createElementVNode("div",K,[e.createVNode(e.unref(S),{role:"button",size:e.unref(u),title:"Toggle controls",onClick:a},null,8,["size","onClick"])]),e.createVNode(r,{title:"Controls",visible:m.value,onClose:a},{default:e.withCtx(()=>[e.renderSlot(i.$slots,"controls",{},void 0,!0)]),_:2},1032,["visible","onClose"])])]),_:3})])):e.createCommentVNode("",!0)])]),e.createElementVNode("div",O,[e.createElementVNode("div",Z,[e.createVNode(_)]),e.createElementVNode("div",j,[t.title?(e.openBlock(),e.createElementBlock("h1",A,e.toDisplayString(t.title),1)):e.createCommentVNode("",!0),e.renderSlot(i.$slots,"default",{},void 0,!0)]),i.$slots.controls?(e.openBlock(),e.createElementBlock("div",U,[e.renderSlot(i.$slots,"controls",{},void 0,!0)])):e.createCommentVNode("",!0)])])}}}),[["__scopeId","data-v-030efc6d"]]);c.SandboxLayout=W,Object.defineProperty(c,Symbol.toStringTag,{value:"Module"})});
|
package/dist/style.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.kong-ui-sandbox-navigation[data-v-2cb154ed]{list-style:none;margin:0;padding:0}.kong-ui-sandbox-navigation .sandbox-link[data-v-2cb154ed]{margin-bottom:8px}.kong-ui-sandbox-navigation .sandbox-link[data-v-2cb154ed]:last-of-type{margin-bottom:0}.kong-ui-sandbox-navigation .sandbox-link a[data-v-2cb154ed]{background:#eee;border-radius:4px;color:#0044f4;display:block;font-weight:600;overflow:hidden;padding:8px 16px;text-decoration:none;text-overflow:ellipsis;transition:all .2s ease-in-out;white-space:nowrap}.kong-ui-sandbox-navigation .sandbox-link a[data-v-2cb154ed]:hover{background:#ccc;color:#002099}.kong-ui-sandbox-navigation .sandbox-link a.router-link-exact-active[data-v-2cb154ed],.kong-ui-sandbox-navigation .sandbox-link a.active[data-v-2cb154ed],.kong-ui-sandbox-navigation .sandbox-link a.router-link-exact-active[data-v-2cb154ed]:hover,.kong-ui-sandbox-navigation .sandbox-link a.active[data-v-2cb154ed]:hover{background:#0044f4;color:#fff}html,body{margin:0;padding:0}.kong-ui-sandbox-layout .header[data-v-
|
|
1
|
+
.kong-ui-sandbox-navigation[data-v-2cb154ed]{list-style:none;margin:0;padding:0}.kong-ui-sandbox-navigation .sandbox-link[data-v-2cb154ed]{margin-bottom:8px}.kong-ui-sandbox-navigation .sandbox-link[data-v-2cb154ed]:last-of-type{margin-bottom:0}.kong-ui-sandbox-navigation .sandbox-link a[data-v-2cb154ed]{background:#eee;border-radius:4px;color:#0044f4;display:block;font-weight:600;overflow:hidden;padding:8px 16px;text-decoration:none;text-overflow:ellipsis;transition:all .2s ease-in-out;white-space:nowrap}.kong-ui-sandbox-navigation .sandbox-link a[data-v-2cb154ed]:hover{background:#ccc;color:#002099}.kong-ui-sandbox-navigation .sandbox-link a.router-link-exact-active[data-v-2cb154ed],.kong-ui-sandbox-navigation .sandbox-link a.active[data-v-2cb154ed],.kong-ui-sandbox-navigation .sandbox-link a.router-link-exact-active[data-v-2cb154ed]:hover,.kong-ui-sandbox-navigation .sandbox-link a.active[data-v-2cb154ed]:hover{background:#0044f4;color:#fff}html,body{margin:0;padding:0}.kong-ui-sandbox-layout .header[data-v-030efc6d]{align-items:center;border-bottom:1px solid #e0e4ea;display:flex;justify-content:space-between;width:100%}@media (min-width: 1280px){.kong-ui-sandbox-layout .header[data-v-030efc6d]{display:none}}.kong-ui-sandbox-layout .header .header-left[data-v-030efc6d],.kong-ui-sandbox-layout .header .header-right[data-v-030efc6d]{align-items:center;display:flex;gap:20px;padding:20px;width:100%}.kong-ui-sandbox-layout .header .header-right[data-v-030efc6d]{justify-content:flex-end}.kong-ui-sandbox-layout .header h1[data-v-030efc6d]{font-size:18px;margin:0;white-space:nowrap}@media (min-width: 768px){.kong-ui-sandbox-layout .header h1[data-v-030efc6d]{font-size:24px}}.kong-ui-sandbox-layout .layout[data-v-030efc6d]{display:flex;gap:20px;padding:20px}.kong-ui-sandbox-layout .mobile-nav-container[data-v-030efc6d]{align-items:center;display:flex;gap:20px}@media (min-width: 1280px){.kong-ui-sandbox-layout .mobile-nav-container[data-v-030efc6d],.kong-ui-sandbox-layout .mobile-controls-container[data-v-030efc6d],.kong-ui-sandbox-layout .mobile-title[data-v-030efc6d]{display:none}}.kong-ui-sandbox-layout .sandbox-controls[data-v-030efc6d],.kong-ui-sandbox-layout .desktop-nav-container[data-v-030efc6d]{display:none}@media (min-width: 1280px){.kong-ui-sandbox-layout .sandbox-controls[data-v-030efc6d],.kong-ui-sandbox-layout .desktop-nav-container[data-v-030efc6d]{display:block}}.kong-ui-sandbox-layout .desktop-nav-container[data-v-030efc6d]{min-width:240px}.kong-ui-sandbox-layout .sandbox-container[data-v-030efc6d]{min-height:50vh;overflow-x:hidden;width:100%}@media (min-width: 1280px){.kong-ui-sandbox-layout .sandbox-container[data-v-030efc6d]{border:1px solid #e0e4ea;border-radius:6px;padding:20px}}.kong-ui-sandbox-layout .sandbox-container h1[data-v-030efc6d]{margin:0 0 20px}.kong-ui-sandbox-layout .sandbox-controls[data-v-030efc6d]{min-width:var(--bfdbd112)}@media (min-width: 1280px){.kong-ui-sandbox-layout .sandbox-controls[data-v-030efc6d]{border:1px solid #e0e4ea;border-radius:6px;padding:20px}}.kong-ui-sandbox-layout .home-link[data-v-030efc6d],.kong-ui-sandbox-layout .home-link[data-v-030efc6d]:visited{color:#0044f4;text-decoration:none}.kong-ui-sandbox-layout .toggle-mobile-nav[data-v-030efc6d],.kong-ui-sandbox-layout .toggle-mobile-controls[data-v-030efc6d]{color:#0044f4;cursor:pointer;transition:color .2s ease-in-out}.kong-ui-sandbox-layout .toggle-mobile-nav[data-v-030efc6d]:hover,.kong-ui-sandbox-layout .toggle-mobile-controls[data-v-030efc6d]:hover{color:#0030cc}.kong-ui-sandbox-layout[data-v-030efc6d] .k-slideout,.kong-ui-sandbox-layout[data-v-030efc6d] .k-card-body{font-size:16px}
|