[#34117] - [4.0] Global Configuration - Sidebar collapse toggle incorrectly initialized for smaller screens
- Closed
- 24 May 2021
- Medium
- Build: staging
- # 34117
Steps to reproduce the issue
- Visit the Global Configuration page in the Backend.
- Switch to the mobile view using Devtools.
- Refresh the page while being in the mobile view or navigate outside and back to this page to imitate how a mobile user would enter this page.
- Notice that the sidebar dropdown is initially expanded (Contrary to
aria-expanded="false") and when you press the toggle button, it goes through an animation to stay in the expanded state (class changes fromsidebar-navtosidebar-nav collapsingand then tosidebar-nav collapse show)
Expected result
When you resize the screen after it has loaded, then the sidebar is initially hidden and the toggle button behaves as intended.
Actual result
On refreshing the page in mobile view (without resizing), the menu is expanded by default and the first toggle button press doesn't collapse it.
System information (as much as possible)
Google Chrome on Windows 10
joomla-cms-bot
- | Labels |
Added:
?
|
||
4. class changes from
sidebar-navtosidebar-nav collapsingand then tosidebar-nav collapse show
I have tried to add sidebar-nav collapse show to the list initially and it works and doesn't ruin anything, but I don't know whether it is a good solution or not?
IMHO, the "toggle menu" button has to have margin-left.
IMHO, the "toggle menu" button has to have margin-left.
If it does in LTR, then it should have a margin-right in RTL
- class changes from
sidebar-navtosidebar-nav collapsingand then tosidebar-nav collapse showI have tried to add
sidebar-nav collapse showto the list initially and it works and doesn't ruin anything, but I don't know whether it is a good solution or not?
This could be a possible fix but I think the person who wrote this code intended to keep the menu toggled off by default. I think maybe an alternate fix (not sure if better) could be executing the 'resize' JS event handler during page load.
| Status | New | ⇒ | Closed |
| Closed_Date | 0000-00-00 00:00:00 | ⇒ | 2021-05-24 14:10:53 |
| Closed_By | ⇒ | YatharthVyas |
Closing in favour of #33877 (#34158 (comment))
Confirmed on real mobile iPhone 12
Ecamm.Live.Recording.on.2021-05-23.at.13.14.38.mov