Conversation
|
By the way, nesting accordions with aria-multiselectable="false" on the outer accordion will still cause issues. Opening inner accordion tabs will cause outer ones to close, since it considers all tabs to be part of the same accordion. I haven't had a chance to fix this yet, so I'll open an issue for it. |
|
Hello @dinkzilla: Thank you for reporting this - and thank you for wanting to help. We have not had a need for nested accordion in our applications, so it is no surprise that there are issues here. To implement this I expect that it needs rewriting of code and unit tests. I'm going on from work the next two weeks - but if I get some free time I'll take a look at your pullrequesten. |
| return; | ||
| }else{ | ||
| tabElement.classList.add('is-upgraded'); | ||
| } |
There was a problem hiding this comment.
This is the important part. :)
|
Hello @dinkzilla, |
|
Our app essentially does rate scheduling, and we have Seasons being the top level accordion, but each Season can potentially have so many possible settings within it that we need to further group the options into smaller sets, to make the app easier to navigate. Since the accordion doesn't have much padding or margin, it works pretty nicely, even on a fairly small screen. We've been using my branch of your library for the time being in our app, and it's been great. I'll see if I can get you some screenshots to show you how it looks when I have a second. |
|
So the data in these images is dummy data, but here is a look at how the nested accordions look:
The Channel Groups in many scenarios end up well into the double digits, so being about to group them is important for our UX. Our app is not targeting mobile, but it still seems to look pretty decent when on a smaller screen:
|
|
Hello, Regards Den torsdag 10. november 2016 skrev Matt Dinkel notifications@github.com
/Leif |
|
Sounds good. |
2 participants
If you nest one accordion within another, multiple even listeners get assigned to the inner accordions, so events end up firing multiple times. As a result, the first nested accordion cannot be opened because a single click fires "toggle" twice (open then immediately close).
In other places, it looks like you used the "is-upgraded" class to prevent similar scenarios, so I used that here.
Also, I was having all sorts of issues getting the project to build. I removed eslint from the build process, since the project as-is was failing all sorts of rules. I also had to remove the build requirement for check-ins to get that to work and make some other tweeks to the build tasks. These were quick fixes tho to get my other stuff to build and check-in and the build process could take some more examination.