{#if show_nav}

Demos

{/if}

{#if show_nav} {#each data.demos_by_category as { category, demos } (category)}

{category}

{#each demos as demo, i} {/each} {/each} {/if}

(show_mobile_nav = false)} class:hidden={!show_mobile_nav} class="max-w-max min-w-[75%] navigation mobile-nav shadow overflow-y-auto fixed backdrop-blur-lg z-50 bg-white pr-6 pl-4 py-4 -ml-4 h-full inset-0 lg:inset-auto lg:shadow-none lg:ml-0 lg:z-0 lg:backdrop-blur-none lg:navigation lg:p-0 lg:pb-4 lg:h-screen lg:leading-relaxed lg:sticky lg:top-0 lg:text-md lg:block lg:rounded-t-xl lg:bg-gradient-to-r lg:from-white lg:to-gray-50 lg:overflow-x-clip lg:w-2/12 lg:min-w-0" id="mobile-nav" > {#each data.demos_by_category as { category, demos } (category)}

{category}

{#each demos as demo, i} {/each} {/each}

{#each data.demos_by_category as { category, demos } (category)} {#each demos as demo, i}

{#if category}

{category}
{demo.name}

{/if}

{#if !show_preview}


					{:else}
						
					{/if}


			{/each}
		{/each}
		
			Code
			
				 (show_preview = !show_preview)}
					type="checkbox"
					class=""
				/>
				
			
			Preview
		
		
			To edit code and see live changes, use Playground on a desktop.