For style part of the template we are using Scalable and Modular Architecture for CSS/LESS and it has 2 core goals.
- Increase the semantic value of html section and content
- Decrease the expectation of a specific html structure
The purpose of SMACSS categorization is to reduse code repetition, to increse consistent experience, and to make the maintenance easier. Under SMACSS there are 5 general categories of css/less rules:
- colors - (stylesheets for the each theme color)
- welcome - (stylesheets for the theme intro page)
- modules - (stylesheets for the each theme block)
- _about-us.less - (about us section)
- _menu.less - (page navigation)
- _preloader.less - (page preloader)
- _base.less - (global styles and resets for this theme)
- _state.less - (media queries and elements state styles(hover, active...))
- _layout.less - (classes and styles that define the theme layout)
- _module.less - (stylesheet for the each theme component)
- style.less - (all the less files)