T4 Framework: offcanvas accordion - 'sub-menu-toggle' button bug

ccsupport

T4 Offcanvas Accordion Menu - when user taps/clicks on the main nav link e.g. on T4 BS5 demo's

<a href="#" class="separator nav-link dropdown-toggle" role="button" aria-haspopup="true" aria-expanded="false" data-bs-toggle="dropdown">Layouts</a>

everything is working as expected - sub-menu expands or closes correctly.

But once 'sub-menu-toggle' button is used for the same nav-item e.g. T4 BS5 demo's

the main <a> link (code above) stops expanding or closing the sub menu. Then the only way to expand or close that sub menu is to use:

Gif showing the issue:

Also, tapping <a> should also trigger icon change in  (the CSS pseudo-element) and it doesn't ATM (see gif above).

saguaros

ccsupport

I can't replicate the same issue on our demo site here: https://t4-framework.demo.joomlart.com/

Could you check again? or share the URL + super admin account of your site so I can check.

ccsupport

saguaros

I think you can't replicate this on https://t4-framework.demo.joomlart.com because it uses Drilldown sub-menus, not accordion. The bug we reported in our original post can be replicated on downloadable T4 BS5 demo once you set Offcanvas sub-menu to Accordion.

saguaros

ccsupport I will share with our T4 team for further checking on this.

Thanks for your report!

ccsupport

saguaros

Is there an update on this?

saguaros

ccsupport In this case, it depends on the menu item types:
- Item with no link
- Item with link
- Item with anchor link

The idea in off-canvas menu here is that you should only click the toggle arrow button to open the dropdown, should not click the text of parent menu as it may be linkable.

Our dev team updated this and it will be available in the next release of T4 (maybe today)

ccsupport

saguaros

Thanks. It has been 3 weeks. When you do plan to release this fix?

saguaros

ccsupport The new version was released in July, could you backup your site and update it?

ccsupport

saguaros

Our template version is 1.1.6 T4 Blank Template Bs5 template, release date 17 Jun 2022.
Our T4 plugin version is 2.2.1, release date 8 Jul 2022.
Both are up-to-date.

The fix is not included in these.

saguaros

ccsupport With menu item with no link like the 'Layouts' item, you should not be able to click to show the accordion. Could you share the URL + super admin account of your site? I will take a look.

ccsupport

saguaros

When we said the fix is not included in these we were partially wrong as now with menu item with no link like the 'Layouts' item, user is not be able to click to show the accordion.

But the hovering and click/tap effects are still there (please check the T4 BS5 demo), which made us think the fix for this has not been done.

e.g. hovering CSS is:

.t4-offcanvas .t4-off-canvas-body .navbar .nav-link:hover, .t4-offcanvas .t4-off-canvas-body .navbar .nav-link:focus, .t4-offcanvas .t4-off-canvas-body .navbar .nav-link:active, .t4-offcanvas .t4-off-canvas-body .navbar .separator:hover, .t4-offcanvas .t4-off-canvas-body .navbar .separator:focus, .t4-offcanvas .t4-off-canvas-body .navbar .separator:active {
    background-color: transparent;
    color: var(--body-link-hover-color);
}

So to summarise...

Fixed:

user is not able to click on menu item with no link like the 'Layouts' item to show the accordion

Not fixed:

hovering and click/tap CSS effects are still there, which makes user think the accordion should expand on click or tap

saguaros

ccsupport You meant that you want to remove this css for item that has no link?

ccsupport

saguaros

Yes. In offcanvas, for menu item with no link like the 'Layouts' item where the link is not be clickable to show the accordion, there should be no CSS effects for that menu link that make a user think they can click/tap on it to show the accordion because it doesn't.

saguaros

ccsupport I will share with team for further checking on this.