Dialog Decorate the dialog's title with HTML

Basic Building Blocks Series: Within the basic building blocks series over time I will add all the little things which someone who just starts with Serenity Framework would have to spend a lot of time figuring it out him/herself.

What you get with this article: You can use HTML formatting in your dialog's title.

Important: This works only for "real" dialogs, not the panel dialogs.

Credits: goes to @Minnhungit

---

Demo:

---

How to implement:

In your xyzDialog.ts, add this:

dialogOpen() {
    super.dialogOpen();
    
    var htmlToDisplay = 'Add Layout for Layout Set <b style="background-color: #856226;border-radius: 5px;padding-left: 5px;padding-right: 5px;">All-Ressorts</b>';

    this.element.parent().find(".ui-dialog-title").html(htmlToDisplay);
}

Hope this helps somebody.

With kind regards,

John