At it’s core, Zap organises your CSS files into 5 different folder categories. Learn the basics on how to keep your CSS better organized and to extend Zap to fit into your project.
The Base category contains everything that is set at the beginning your project this includes CSS Normalize/Resets, HTML/body declarations, global pre-processor variables, mixins etc.
The Layout folder contains grids or anything related to positioning or containerizing of large content such as grids and wrappers.
The Module folder contains common repeating components that are made up of smaller child elements but are treated as a single entity. These include tables, cards, lists, forms and etc.
The Single folder contains small and singular components that are styled independent of its parent container such as buttons, headings, lines and etc.
The Utility folder contains any useful single behaviour components such as hiddens, floats and aligns etc.