-
Notifications
You must be signed in to change notification settings - Fork 5
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
ENABLE-140 Component Cookie Banner #174
base: main
Are you sure you want to change the base?
Conversation
…CSS styling complete.
<button id="show-non-modal-button">Show Non-Modal Banner</button> | ||
|
||
<div id="cookie-banner-container"> | ||
<dialog id="cookie-banner" class="cookie-banner"> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Because this is a non-modal, I think it better to not use the dialog tag to encapsulate the cookie banner in the non-modal case. I think
would be better (witharia-labeledby
pointing to the title of the banner.
You should use for the modal case, but make sure you follow all the instructions in dialog.php.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Hi @zoltan-dulac , could you share why the <aside> tag would be appropriate for a cookie banner. If we trade <dialog> in favor of <aside> then we also lose the following benefits:
- The
.show()
method which positions the contents above everything else on the page, but "still allowing interaction with content outside of the dialog". MDN link - The combination of using a <form> tag with its method attribute set to "dialog", which results in automatic dismissal of the dialog when a button is pressed.
We'd have to program these functionalities ourselves when using the <aside> tag, and also convince users of Enable to do the same.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Zoltan: "Will check with Allison regarding the .show()
method."
No description provided.