Kendo UI modal with Gaussian blur

Question

It is possible if I wanted to substitute the default grey background of the modal kendo window with a nice gaussian blur like in the image below? Here I provide Demo in Dojo

How to achieve this?

Answer 1

You have to give your main content (the div that contains all the text) a class too, and then blur that class when the window is opened:

<div id="maincontent">This is the main body text</div>

function onOpen() {       
    let main = document.getElementById("maincontent")
    main.style.filter = "blur(2px)"
}

In your code snippet I have used the P tag to blur: