Alex-D / Cookies-EU-banner

1kb vanilla JS script which manages cookies consent banner display like asked by GDPR

Home Page:http://alex-d.github.io/Cookies-EU-banner/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Add custom display property

alexzerah opened this issue Β· comments

πŸ‘‹ Hi everyone,

First of all, thanks for your really cool lib!

As a web developper I need a way to add custom css display.
For exemple display: flex instead of display: block.

It can be really cool 🀘

Thanks again

Hey!

So you basically just need an option to change the value set in this line :

banner.style.display = 'block';

Yeah, I was thinking about updating outside the library, but I solved the problem I was.
Thanks

You can hack it with something like

#cookies-eu-banner[style*="display: block"] {
  display: flex !important;
}

Easier than that is to use the hidden parameter on the initial state of the form. From MDN:

The hidden global attribute is a Boolean attribute indicating that the element is not yet, or is no longer, relevant. For example, it can be used to hide elements of the page that can't be used until the login process has been completed. Browsers won't render elements with the hidden attribute set.

Which make it perfect for this case.

Would you accept a PR, @Alex-D ?

Of course! :)