Layout templates

[tophtucker]

Render cells into existing div matching #cell-${id} if present, so you can prepare e.g. a dashboard layout. Example usage: https://github.com/tophtucker/notebooks/blob/dashboard-templates/template2.html.

This is just a draft. In my quick playing around, it feels awkward to have to use cell ID when it’s not present anywhere in the UI. (I didn’t really realize until now that of course cells no longer have names!)

Without this edit, you can already make <main> a CSS grid that’ll auto-layout whatever gets added to it. But I like the idea of being able to stub out holes where my names will go. If the cell IDs are too indirect, then… it’s almost like display could take a second parameter that gives it a label, an element to target or display to? Or the other way around?

In any case, I’ve long wanted to use a notebook for building my components and then have a vanilla HTML+CSS template that scaffolds it by just referring to cell names. Sort of like alternative embedding solutions where you could have a component like <Cell id={i} /> and put it wherever and have it hook into a shared runtime.