Justoverclock I've found a method that works, with pure CSS and ARIA, no JS: https://txmn.tk/test-aria.html (tested only with NVDA)

role="button" tabindex="0" make the word focusable, CSS makes the tooltip appear when the word has focus, and aria-describedby tells the screen reader that the word has a description. aria-describedby (or aria-labelledby) doesn't work when the description/label object is not displayed.

      Upcoming update (only for Flarum 1.0)

      Custom Page with all words and definition (screenshoot of a demo without css)

      feel free tu suggest any ideas

        Justoverclock very nice! the only thing I may suggest is for it to be displayed as a table, with keywords in one column and definitions in the other. I think it makes it easier to distinguish between them, and may at a later date provide the opportunity of some kind of filtering of the table.

            ctml sure, I’m planning to do a search field and/or a a-z filter on top of the page

              Progress: 60%

              i'm ready to finish, just some tweaks to the UI, and a search function, and i'm thinking about to use "load more" button for website with a lot of terms (i hope load more is a component built in in flarum)

                [deleted] mmmhhh thats could be a solution, or i need to write some code similar to my read more extension.

                  Justoverclock looks pretty great. minor critique and suggestion 🙂

                  • switch search button to use fa icon (like header search)
                    • preferably have behaviour like flarums search where input triggers the search as opposed to pressing a button after typing
                  • I still kind of think the words and definitions should be in separate columns for readability, so you can quickly scan the page for the keywords. It could also allow for different styling of the keyword vs definition, if someone wanted to apply css to bold the term as an example. This is primarily why I had suggested a table view. I don't know if it's the best option for everyone else, but I personally prefer it 🙂

                  Perhaps a future feature idea, which may also play nice with that table display would be adding optional tags or a group to the keywords. So that you could then filter or sort by those. For example if you had some terms like

                  1. flarum-cli
                  2. mithril
                  3. laravel

                  You could assign them or label them as 'development', and a table view would let you search/filter or sort by that column for development keywords. I know flarum team were talking about adding a table component during a 1.x.x release, but it is apparently implemented by @davwheat in the admin dashboard of user management page on 1.0.0 which sounds like it is perhaps the stepping stone to the future component.

                  Writing this made me think of another idea for your cool extension, which would be providing links in this terms/definitions. If it allows for markdown, then it would work. Or if takes raw html. In the above example, you could link flarum-cli to the discussion thread, or laravel to the laravel site.

                      ctml that's why i love partecipation from users. is this what u mean for the search?

                      now, for the table i need to think how could i split the result in 2 different part, but i think this is relatively simple

                          Justoverclock yes exactly, that's great!

                          For table, maybe @davwheat could provide a suggestion since he was the master behind the user mgmt feature. But this could also be a future thing to look at, perhaps if you consider the 'grouping/labelling' feature down the road it would make sense at that point. Not sure exactly, I am just thinking out loud 🙂

                              ctml that is a very nice feauture, honestly i don't know where to start for this 😆 , but i will definitely try to implement this feauture too

                                1.6 (for flarum 1.0 only)

                                • Glossary Page available
                                • Keys sorted alphabetically
                                • Live search through glossary keys

                                Installation

                                Install with composer:

                                composer require justoverclock/flarum-ext-keywords

                                Updating

                                composer update justoverclock/flarum-ext-keywords
php flarum cache:clear
                                6 days later

                                • [deleted]

                                • Post #66

                                This is your community and this extension is also yours 🙂😌 see the screenshot below found a css optimization bug for mobile devices hope you will fix it soon.

                                Thanks,
                                Regards
                                @[deleted]

                                  [deleted] didn’t find a solution for this on mobile. I’m working on it….
                                  maybe @tuxmain can u explain how can i use aria? my last try didn't change anything