Bigger + better code blocks

Somewhat related to this comment, I’d love some way to have bigger code blocks, maybe even with syntax highlighting :grinning:

I think the 300 character limit makes sense for “normal” text, but it would be nice to lift the restriction in some cases like for code.

Something else that would be really nice would be some syntax highlighting. In the example above, I have ```ts to open the fenced code block as an info string to mark the language of the code. Kinopio doesn’t parse this, and actually puts it into the rendered card.

I know syntax highlighting can really increase a page’s JS weight, and there’s added processing whenever rendering something that would have syntax highlighting.

An idea would be that instead of rendering the “full” text for a code card, only the first few lines are rendered and you can click on it to open the card and see all of the text (maybe in a floating modal or something?)

I had kind of hoped linking a Gist would be good here, but alas, the preview image is not helpful

1 Like

hey TranquilMarmot,

would a good compromise be improving gist previews from cards? eg with something like gist-embed ?

1 Like

That’s an interesting idea :thinking: it would probably handle my use cases pretty well, and it keeps the code editing / highlighting stuff off of Kinopio which is nice.

Main issue I can think of is that library has a few parameters you can pass to the embed, like data-gist-file, which would be nice to control.

1 Like

in the works: (using iframes instead of a lib)


the upside of iframes is the kinopio app doesn’t need big libs to process text highlighting. the downside is that bc of cors issues i don’t know the height of the content of the iframe so it’s just based proportionally on the width of the card it’s in

1 Like

I love it :smile: it seems fine (especially for code blocks) for the iframe to just be scrollable like that. You wouldn’t want it to embed a site and make a gigantic card, anyway.

Would this just be for gists? Or are you considering making any site “iframeable” into a card? :thinking:

1 Like

:articulated_lorry: shipped. Any site that has an iframely embed should work