๐Ÿ”ฎ Sanity Create is here. Writing is reinvented. Try now, no developer setup

How to Reduce the Size of a Block Content Field

3 replies
Last updated: May 10, 2021
Is there any way to reduce the size of a Block content field? For a
field there's
but there appears to be no such thing for a PortableText editor. It would help to free up some screen space, as well as provide a proper visual cue - an
field is likely to be smaller than
in this case:
May 10, 2021, 2:52 PM
user P
, great points on screen real estate and visual cues. Unfortunately, it's not possible today to control the height of a block content field, but it's an important feature request. I've also seen it come up for a single-line block content field, e.g. to allow a few styling options on a short label text.
Here's a workaround, although it's not the prettiest. This would decrease the height on
all block content fields, but it might be possible to target one of them specifically [will have to look into that]:
:global([class^="PortableTextInput_editorBoxContent"]) {
  height: 8rem;
May 10, 2021, 3:07 PM
Thanks for your input! Would be great if we could have something like
as an option for any of the fields. That way we could target specific fields quite easily.
PS I presume I would have to set up the css like this then?
May 10, 2021, 3:12 PM
That's correct, it should be in the overrides. I should have specified ๐Ÿ™‚ Will forward the
suggestion to the components team, thanks!
May 10, 2021, 3:21 PM

Sanityโ€“ build remarkable experiences at scale

Sanity is a modern headless CMS that treats content as data to power your digital business. Free to get started, and pay-as-you-go on all plans.

Was this answer helpful?