How to make one word to show as Bold in a Ternary Operator?-CodePudding

How can I make the word Full display as Bold in the ternary operator below? If I change it in the span it will make the word enrolled and spots show as bold as well and I don't want that. What's the way to do it?

<span
  style={{
    flexGrow: 1,
    color: "lightgrey",
    fontSize: "12px",
    marginLeft: "10px"
  }}
>
  {e.enrolledNum / e.total_spots >= 1
    ? 'Full'
    : `${e.enrolledNum} enrolled ${""} / ${""} ${
        e.total_spots ? e.total_spots : "0"
      } spots`}
</span>

CodePudding user response：

Wrap it in a strong tag, or if that's not what you mean semantically, some other inline element with a class that makes it bold.

For instance:

<span
  style={{
    flexGrow: 1,
    color: "lightgrey",
    fontSize: "12px",
    marginLeft: "10px"
  }}
>
  {e.enrolledNum / e.total_spots >= 1
    ? <strong>Full</strong>
    : `${e.enrolledNum} enrolled ${""} / ${""} ${
        e.total_spots ? e.total_spots : "0"
      } spots`}
</span>