Learn what architectural design principles does the Victoria UI Kit follow. Its understanding is crucial to be able to build advanced ,
Victoria UI Styles follows Inverted Triangle Cascading StyleSheets (ITCSS) architecture - a set of principles and practices by which developers should group and order their CSS in order to keep the styles scalable, terse, logical, and manageable.
Simply said, ITCSS is building styles in layers from the lowest to highest specificity (~ from most generic rules to least generic rules).
As the specificity of every layer is gradually increasing, styles in every layer can easily build on top of the styles from all the layers before them (top to bottom):
This leads to a cleaner and more maintainable stylesheets:
Theming is handled by completely by SCSS. There is no body class to apply a theme, you must load a different css file. Follow these steps to declare a new theme:
theme: [your-theme-name]at the top of a material file so fabricator/handlerbars can load the new css.
The library separates the styles into following layers, each represented by similarly named folders (ordered from most generic to least generic):