How to style mermaid css (in editor and in obsidian publish)

Hmm… I found a sequence diagram with that ugly light yellow color, #EDF2AE, and found that it responds to both rect.note, and .mermaid svg rect.note.

Do note that there is a big difference between doing .note rect and rect .note and rect.note. Here is my attempt at an explanation (might be slightly off:

  • .note rect – Something at the outer level has the class note, and within this element there is a rect element
  • rect .note – There is a rect element, which contains an element of the class .note
  • rect.note– A rect element of the note class

Does the rect.note target the main element you wanted to change?