search

susielu / react-annotation

Use react-annotation with built-in annotation types, or extend it to make custom annotations. It is made for annotations in SVG.
http://react-annotation.susielu.com/
Apache License 2.0
396 stars 34 forks source link

Styling Subjects #25

Closed inakiabt closed 5 years ago

inakiabt commented 5 years ago

Is there a way to style Subjects without changing root CSS classes or adding custom CSS selectors? I see that color can be passed to SubjectRect but I'd need to change its background color (fill) for example.

I ended up doing this and it works, but would be great if Subjects can receive a className or style prop: https://codepen.io/inakiabt/pen/mgwaJB

susielu commented 5 years ago

There is no way right now to add an additional custom classname onto the subject, but there already is a classname on the subject, so you could change your css to: 

.red-box g.annotation-subject > path {
  fill: red;
  stroke:red;
  fill-opacity: 0.2;
}

.blue-box g.annotation-subject > path {
  fill: blue;
  fill-opacity: 0.7;
}