Cleanly injecting text into RichText

Anvil Q&A
1

The RichText component is really awesome, and the ability to have addition content in ‘slots’ is great.

We often want to inject text and use rich-text for this. Most often we add a Label into a slot. However, it always wreaks havoc on our formatting and line-spacing specifically.

I’ve tried a few things:

  • Use f-strings bound to content instead of using slots (suggested by @jshaffstall here). This works but doesn’t use slots, which are otherwise very convenient.
  • Set the padding and margins to 0 using @stucork 's suggestion here, which doesn’t seem to do anything
  • Setting spacing to none in conjunction with the above

So, is what I’m trying to do the wrong way to use RichText components? Or is there something I’m missing?

Clone link:

2

If you’re using the Material Design theme, or one derived from it, check out the "text" role for Labels, which removes a lot of the extra spacing that’s making your life uncomfortable. (And even if you’ve built your own theme, you can steal the CSS!)

(We are working on better answers than this - stay tuned! - but it’s a good start.)