41e5ddbcdf
We were using JavaScript to show/hide the Table of Contents. In my humble opinion, the <details> tag has a few shortcomings [1][2], which means we should be careful about when to use it. IMHO a Table of Contents is a good candidate for this tag because it's a very common pattern to add a show/hide behavior for it, even if using it means the "navigation" role (which we are *not* using anyway) wouldn't be identified correctly. I'm adding a <details> tag to the comments section as well for consistency and in order to simplify the code. I'm not sure this is as good an application of the <details> tag, though, but then again I'm not sure about the interface we use to show/hide the comments (and this feeling is increased by the fact that we use a different interface on small screens). If we decide to change the interface in the future, we might consider using the <details> tag for the Table of Contents but not for the comments. Since the <details> tag is not supported on Internet Explorer, I'm only adding styles to this tag using the `:not([open])` option. On Internet Explorer <details> will always be opened and so these styles will be ignored. [1] https://adrianroselli.com/2019/04/details-summary-are-not-insert-control-here.html [2] https://daverupert.com/2019/12/why-details-is-not-an-accordion/
11 lines
268 B
JavaScript
11 lines
268 B
JavaScript
(function() {
|
|
"use strict";
|
|
App.LegislationAllegations = {
|
|
show_comments: function() {
|
|
if (!App.LegislationAnnotatable.isMobile()) {
|
|
document.querySelector(".draft-allegation details.calc-comments").open = true;
|
|
}
|
|
}
|
|
};
|
|
}).call(this);
|