Suggestion for menu : Show Submenu for the primary menu on the left side and expand primary sidebar menu on hover for big screen only

Created on 29 March 2024, 9 months ago
Updated 27 June 2024, 6 months ago

To improve usability on computers, I suggest adding these two features, so that computer users have a better experience.

Expand on hover :
This does in no way change anything on touchscreens, as hover doesn't work on them, but for computer users, it's a significant improvement.

Side for expansion :
When the menu is too close to the edge of the screen, the submenu should open to the other side (see screenshots). I also indicate to the user beforehand on which side the submenu will open by placing the chevron left or right.
Also, I align the edge of the expanded menu to the left or right of the parent element depending on which side the child menu will open.

I believe this makes the menu experience slicker.

Many thanks for your excellent work with W3CSS and subsequent themes, I regularly use them as a basis for my websites.

Feature request
Status

Fixed

Version

1.0

Component

Code

Created by

Live updates comments and jobs are added and updated live.
Sign in to follow issues

Comments & Activities

  • Issue created by @drupaldope
  • Status changed to Closed: works as designed 9 months ago
  • 🇺🇸United States flashwebcenter Austin TX

    Hello,
    Thank you for reaching out and sharing your ideas. The W3CSS Theme doesn't include the feature where the side menu appears when you hover over it. I intentionally decided not to add this feature. My goal was to make the theme more accessible and user-friendly, ensuring that everyone can have a predictable and smooth experience while navigating.

    Regarding the suggestion to automatically adjust the dropdown menu's position based on its location on the screen and the space available, there are indeed several ways to approach and solve this issue and Solo's menu already has a lot of features, and adding more could make things complicated and might cause unexpected issues. To include this new idea, I'd almost have to create a brand new menu system, similar to other features we have like the main menu hover, click actions, or the mega-menu option.

    The Solo theme, like many other themes available for Drupal, is made to help you build a wide variety of websites. It's designed to be flexible and meet lots of different needs. But when it comes to very specific changes like the ones you've mentioned, it often requires custom work. This means looking closely at how the theme is put together and might involve changing the code in several places, including styles (CSS), scripts (JavaScript), and even the programming part (PHP) that works with Drupal's menu system.

    Custom development allows for a degree of specificity and optimization that contributed themes, built to satisfy broader needs, cannot always afford. While I strive to accommodate user feedback into my theme's evolution, certain enhancements fall beyond the scope of updates and are best achieved through tailored development.

    Best wishs,
    Alaa

  • Dear Alaa

    Yes, of course I understand, it's your design decision and I'm merely making suggestions.

    I feel I don't completely understand the accessibility argument, because expand on hover only adds this feature for computers and afaik doesn't change anything on touch devices. But maybe there is something I am missing in my understanding.

    Regarding the side where the menu opens, this could also be toggled via theme options, open submenu left or right, in general the website designer will know which side will be better depending on the site's general layout.

    I did achieve that effect by minimally hacking the JS and adding some CSS, no PHP involved. I'm ready to share the code with you if you aren't afraid of losing brain cells because what you will see ;-)

    Thank you again for your work, I understand "The Solo theme, like many other themes available for Drupal, is made to help you build a wide variety of websites."
    That is exactly my goal also - I hope at some point to have a boilerplate theme that will have a nice standard look by itself, directly usable for simple sites, but also be easily adaptable to build a variety of websites with it.

    My dream would be a W3CSS base theme, a W3CSS boilerplate theme (subtheme of W3CSS base) and then the final website's specific theme (subtheme of W3CSS boilerplate).

    Many thanks again.

  • Assigned to flashwebcenter
  • Status changed to Fixed 9 months ago
  • 🇺🇸United States flashwebcenter Austin TX

    Hello,

    I have completed the implementation of both features you requested into dev version . Regarding the first feature, it is designed exclusively for desktop usage. I have made the necessary adjustments and incorporated the feature, leaving the decision of its utilization to the discretion of the site owner.

    Concerning the second feature, it was added and toggled via theme options.This enhancement, too, has been made configurable for the site owner's preference.

    Best wishes,
    Alaa

  • Status changed to Fixed 9 months ago
  • 🇺🇸United States flashwebcenter Austin TX
  • Wow, thank you very much Alaa, you are amazing !

  • 🇺🇸United States flashwebcenter Austin TX

    You are very welcome!

  • 🇺🇸United States flashwebcenter Austin TX
Production build 0.71.5 2024