close sclaed project overlay by clicking outside of it (not via X button)

[egorkraft]

Hi there,

I've custom styled project overlays such that they occupy left half of the screen width. To be seen here: https://kraft.studio/archive/
This was achieved by using the following Desktop CSS

/* Hide site title on project overlay */
html.show-project-overlay .sitetitle.txt {
    display: none!important;
}

/* blur background page on project overlay */
html.show-project-overlay #grid.id-2178 {
    
    /* Any browser which supports CSS3 */
    filter: blur(30px);

    /* Firefox version 34 and earlier */
    filter: url("blur.svg#gaussian_blur");

    /* Webkit in Chrome 52, Safari 9, Opera 39, and earlier */
    -webkit-filter: blur(30px);
}

/* custom-styled project overlay page*/
.animation-slidedown {
    left: 0vh !important;
    right: 50% !important;
    height: 100vh!important;
    width: 50%!important;
    box-shadow: 0 4px 6px rgba(0,0,0,0.1);
}

By default project overlays can only be closed via X (or a custom) icon.
I would like to be able to close a project overlay page by simply clicking outside of it into blurred background, just like page overlays allow.
I imagine this use case might be of use for many folks looking to do a neat single page layout. Should this be achieved via a pseudo-element below the overlay page?
Many thanks in advance!

[arminunruh]

okay will be added with the next update

you cant custom code this, i have to add it to lay theme's code

[egorkraft]

@arminunruh Brilliant! Thank you, Armin. I believe adding slide from left or right animations would also compliment this useful feature.

[arminunruh]

now it should work with the latest update!

[marynasakowska]

This post is deleted!