Changing the text size of image annotation labels

I have a decent number of labels I'm asking my users to apply to photos. It causes the main photo I'm asking them to label to push down so they have to scroll to apply the labels over the entire photo.

Is there a way to make specifically the annotation selector text smaller? That way, the image pushing could be reduced.

The way I've set this up is containerized, so I am hoping to push this setting through in the prodigy.json file since I'm hoping to keep all the prodigy files exactly as they come.

Hi! Just to make sure I understand the question correctly: you want to change the size of the label "buttons" the user can select at the top, right?

If so, there are different options: One would be to set "ner_manual_label_style": "dropdown" in your prodigy.json to display the labels as a dropdown menu instead of a list. (Sorry about the bad naming here btw. When I created that setting, we didn't yet have the manual image interface and only used those label buttons for NER annotation.) It does make it slightly less convenient to select labels, though – so whether that label style works for you depends on the use case.

The other alternative that gives you full flexibility is to use the "global_css" setting and override the styles there. If you're on the latest version, the .prodigy-title class lets you target the (typically purple) heading of the annotation card. The labels are <label> elements. I haven't tested it yet, but something like this should work:

{
    "global_css": ".prodigy-title label { font-size: 12px }"
}
1 Like

Thanks again Ines! This is exactly the solution I was hoping for. This absolutely worked to change the size of my purple label boxes.

1 Like