While I do need the metadata to exist in the dataset, I don’t want to display it to the annotator. I can probably remove it with custom css, but I don’t know how to add a custom css file to prodigy - same goes for changing the icons on the accept/reject buttons
There's actually a "hide_meta" setting in the prodigy.json that should do exactly that – see here for details. So you shouldn't need to use any custom markup for this at all 
While you can change the colors of the buttons via the custom theme, there's currently no easy way to change the icons, sorry. Those are currently hard-coded since they're are inlined SVG graphics.
Thanks! just found out myself about the meta flag, but there are more css issues I’d like to address card_css is quite under documented in my opinion. Can I use css selectors in it -for example to target can I do:
card_css: {
.input[id="2"]+div.c0173:{
color:red;
}
}
Also are the non human readable css classes generated for every prodigy version or consistent?
At the moment no, sorry. The "card_css" is really just an object that is passed in as the container's "style" attribute. So you can think of it as:
<div style={card_css} />
<div style={{ color: 'red'}} />
So if you want fully custom and nested style overrides, the best solution for now would probably be to add a <style> tag to the index.html.
They're auto-generated, so we couldn't guarantee this. However, I'm open to adding more human-readable static class names to elements if you have a suggestion for what you (and potentially others) might want to customise. I also want to be adding more identifiers for recipes, views and a "global_css" setting for consistency. I wrote up some of the ideas in my comment here the other day:
Thanks @ines for the clarification
Can you please explain or point in the docs how do I add a style tag to the index.html? Do I need a complete “replace” ? If so how do I preserve the functionality of the current page. (No problems with working with react if needed)
You can find the file in static/index.html in your Prodigy installation. To find the path, you can run the following command:
python -c "import prodigy; print(prodigy.__file__)"
If you check out the index.html markup, you’ll see that it’s pretty straightforward and compact. <div id="root"></div> is where the app will be rendered – everything else stays intact. So if you add a <style></style> in the <head>, it will be available when you run the app.
The main downside here (and what a "global_css" setting would solve) is that you have to edit the static source and can’t easily add recipe-specific markup. So if one recipe needs some custom formatting and the other one doesn’t, that’s currently a bit tricky.
Thanks!
Hey @ines I seem to have a missing piece here. How do I override index.html? can I pass it as a param or should I do it in the crude way of replacing that file in site-packages?
Yeah, that's pretty much what you'd have to do at the moment, sorry. It works, but it's not very elegant.