Is it reasonable to assume the type is the 1st element in the class attribute? Why not do this uppercase-the-1st-character by setting the title "text" in CSS? Something like:

    .note {
      &.warning >   .title.empty:before { content: "Warning"; }
      &.important > .title.empty:before { content: "Important"; }
      ...
    }