Space
sizes are defined and SCSS Variable and they are generating css variables in root that will be used through the entire framework
Space SCSS Variables
Click to copy
$spaces: (
"xs": 2,
"s": 5,
"m": 10,
"l": 25,
"xl": 50,
"xxl": 100,
);
Space Variables that are generated from Space SCSS Variables
Click to copy
:root {
--space-xs: 2px;
--space-s: 5px;
--space-m: 10px;
--space-l: 25px;
--space-xl: 50px;
--space-xxl: 100px;
}
Those values are for all the layout applied sizes in the framework:
- Paddings and Margins
- Flex Gap
- Grid Gap
Paddings and Margins are placed under Layout section. Read more.
Comments Area
No comments have been posted yet. Please feel free to comment first!
Note: Make sure your comment is related to the topic of the article above. Let's start a personal and meaningful conversation!