I've been playing with labels on my code blocks. Sometimes I have useful labels, other times it's just "Example 2".

It's also unclear exactly where I put the label: Inside the box? Outside?

Are there any docs sites that do this really well?

Follow

@wilfredh On a border (=
But you'd have to play on it somehow.

Maybe it could be done in more ways, but rn the block design is almost locked down by the paper-and-shadow visual metaphor. Maybe you can find something more flexible so you can enjoy more decision freedom later.

@dpwiz This is really thoughtful feedback, thank you!

I think you're right that the box design was constraining me. I'm trying this, but still trying to figure out what the overall visual identity is.

Live URL FWIW: garden-lang.org/keyword:import

@wilfredh This looks nice. But I love this border ---[ style ]--- in general (=

You may want to add a bit more padding-top so the code wouldn't touch the label on narrow screens like on the pic here. It's fine on the wider though.

Sign in to participate in the conversation
Qoto Mastodon

QOTO: Question Others to Teach Ourselves
An inclusive, Academic Freedom, instance
All cultures welcome.
Hate speech and harassment strictly forbidden.