Add underlined text to nodes

[amingilani]

Is your feature request related to a problem? Please describe.

When I'm trying to draw ERD diagrams for a course, using the symbols described in the Fundamentals of Database System. The elements are different from the ERD diagram in mermaid.js, so I revert to using the flowchart.

However, I need an underlined node to denote a primary key, but mermaid.js doesn't support underlined nodes

Describe the solution you'd like
Allow underlined nodes

Describe alternatives you've considered

1. I tried added <u></u> tags. Here's what happened:

graph TD
    User[User]
    User --> ID(<u>ID/u>)
    User --> Email(Email)
    User --> Password(Password)

2. I've also tried adding styles, as per Styling the text in the elements of a flowchart mermaidjs/mermaidjs.github.io#8

graph TD
    User[User]
    User --> ID(ID)
    User --> Email(Email)
    User --> Password(Password)
    style ID  text-decoration: underline

The result is the same as the previous image.

[wagle]

The problem with the SVG that mermaid generates is that it tries to kludge in some of the style (here "text-decoration: underline") with "!important" instead of doing the CSS correctly. I guess I'll have to re-read those articles on this.

The SVG can be hand edited to force the underlining. So it isn't impossible.

CSS !important: Don’t Use It. Do This Instead

[math-GH]

1. I tried added `<u></u>` tags. Here's what happened:

graph TD
    User[User]
    User --> ID(<u>ID/u>)
    User --> Email(Email)
    User --> Password(Password)

Could you please try a valid HTML </u>?

[sidharthv96]