somewebmedia / hc-offcanvas-nav

JavaScript library for creating toggled off-canvas multi-level navigations, allowing endless nesting of submenu elements, supporting swipe gestures, keyboard interactions and ARIA attributes.
https://somewebmedia.github.io/hc-offcanvas-nav/
MIT License
336 stars 82 forks source link

Refactor default theme #60

Open ronilaukkarinen opened 3 years ago

ronilaukkarinen commented 3 years ago

First of all, good work! This navigation is beautiful and really works out of the box with WordPress and our ultra minimal and modern air-light theme.

I'd like very much to contribute with my first issue. I noticed theme default base is really hard to understand because it contains

Stylelint with our pretty reasonable standards causes 631 errors. Had to put in stylelint-disable sh-waqar/declaration-use-variable, no-descending-specificity, selector-max-combinators, selector-max-pseudo-class, selector-max-class, selector-max-compound-selectors, selector-max-specificity, declaration-no-important, max-nesting-depth, no-duplicate-selectors for now.

For example selectors of this next secenario should be in one line because in-between there's no specifications, it's also way too specific:

carbon (7)

So my suggestion is to simplify default theme structure by refactoring it completely. This would ensure people should have easy time creating their own themes. I personally had to do overrides because this overkill at the moment.

I used to nest too much in my past as well so I'm not blaiming anyone, we've all been there. I can gladly help in some point in the future, but right now I don't have enough time for anything else to bring this to your attention.

somewebmedia commented 3 years ago

The problem is that the menu has many features and subnav possibilities and options, which are targeted by these very specific complex selectors. I understand you, at one time I've completely lost it and didn't know what is what anymore (I still don't) :D

The problem with these out of the box solutions that (try to) fit all situations is that there are just too many variations that could happen that we have to cover. I tried refactoring it once and this is what I've ended up with. I had to have opened like 10 tabs for all different situations to test against, it wasn't fun at all :D

I'm open for suggestions about the workflow.

ronilaukkarinen commented 3 years ago

Haha I understand your pain, I've been there myself as well. I may have some thoughts to this later...