Use a front-end framework
Using a third-party modular front-end framework (e.g. http://foundation.zurb.com/) would provide design pack developers with a well documented and easily expandable system. The current system's functionality is restricted to the default design pack's use case. It's not modular; overwriting store.css in a custom design pack basically overwrites all styles; it's not possible to overwrite just a single component. It's badly structured; styles are spread over store.css and z-mobile.css. It's confusing; z-mobile.css contains styles for mobile but also desktop and tablet (this was fixed in Sana v9.2.0 though). Using a third-party framework would fix all this. These are generally well documented, under active development and well tested. The default design pack could include just the modules it requires but design pack developers could expand it with other available or custom modules. The well structured nature of the framework would also encourage developers to expand on it in the same well structured manner.
[SANA PRODUCT] We are currently implementing ReactJS as our front-end framework. We expect to have a full re-implementation of our front-end by the end of 2019. We are spending a significant portion of our development capacity to this project.
It’s a big and ambitious project, but we are confident that it will add a lot of value in terms of stability and performance. I recommend you following our Roadmap Portal (roadmap.sana-commerce.com) for the latest updates.
kelvin ricafort commented
The current structures for css and views are very confusing.