Page 1 of 1
Glass blur layer - grid _flex _ modal
Posted: Tue Aug 23, 2022 4:34 pm
by amir2314
Hi dear pablo .
I would like to change my layers to glass blur effect .
.
Exactly like this :
https://css.glass/
How can set the blur on any layer in wwb .
I have an modal layer with several items on it and i want to my modal layer bg change to blur background is there any whay to doing that ?
.
Re: Glass blur layer - grid _flex _ modal
Posted: Tue Aug 23, 2022 4:43 pm
by crispy68
You will need to add additional CSS for that.
Re: Glass blur layer - grid _flex _ modal
Posted: Tue Aug 23, 2022 4:51 pm
by amir2314
crispy68 wrote: Tue Aug 23, 2022 4:43 pm
You will need to add additional CSS for that.
Hi dear crispy68
.
How can i do that . Can you help me to doing this please ? This is very important part of my project
Can you make a demo project with wwb ? . I dont know how can i add additional Css
Re: Glass blur layer - grid _flex _ modal
Posted: Tue Aug 23, 2022 5:08 pm
by crispy68
At the weblink you provided, you can create the look you want. Then, copy the CSS code they provide.
You will need to open up a html object set to between the <head> tags and put the code like such:
<style>
#Layer1{background:rgba(255,255,255,0.2);backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);}
</style>
You will need to change the ID of the layer to match yours. Also, if you are only wanting the background of layer, you can remove the code for border-radius, box-shadow and border.
Re: Glass blur layer - grid _flex _ modal
Posted: Tue Aug 23, 2022 9:31 pm
by amir2314
crispy68 wrote: Tue Aug 23, 2022 5:08 pm
At the weblink you provided, you can create the look you want. Then, copy the CSS code they provide.
You will need to open up a html object set to between the <head> tags and put the code like such:
<style>
#Layer1{background:rgba(255,255,255,0.2);backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);}
</style>
You will need to change the ID of the layer to match yours. Also, if you are only wanting the background of layer, you can remove the code for border-radius, box-shadow and border.
Wow . Thank you very much
Re: Glass blur layer - grid _flex _ modal
Posted: Wed Aug 24, 2022 6:24 am
by amir2314
crispy68 wrote: Tue Aug 23, 2022 5:08 pm
At the weblink you provided, you can create the look you want. Then, copy the CSS code they provide.
You will need to open up a html object set to between the <head> tags and put the code like such:
<style>
#Layer1{background:rgba(255,255,255,0.2);backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);}
</style>
You will need to change the ID of the layer to match yours. Also, if you are only wanting the background of layer, you can remove the code for border-radius, box-shadow and border.
.
Hi dear crispy68 . I notice that wwb has backdrop filter and blur on styles . I just create a new style on style manager and set the blur and add all breakpoint to it with same setting . So in any layer i need i can set the layer style that created. The issue with custome code on html is : its can dont work on breakpoints. But in style on stylemanager its working perfect
Re: Glass blur layer - grid _flex _ modal
Posted: Wed Aug 24, 2022 11:32 am
by crispy68
Glad you got it working. However, the code I provided will work in breakpoints.
