#scss #css #web-development #frontend

SCSS Partials

• multiple and separated files
• Can be in different folders
• file name of partials starts with _ e.g, _boilerplate.scss

  html {
  	box-sizing: border-box;
  	font-size: 100%;	
  }
  
  *,
  *::before,
  *::after {
  	box-sizing: inherit;	
  }
  
  body {
  	margin: 0;
  	padding: 0;
  	font-family: Arial, Helvetica, sans-serif;
  	background-color: hsl(0,0%, 11%);
  	color: hsl(0,0%,100%)
  }
  

BEM Convention

• Good practice to have one partial for each block
• Easier to debug and work on something specific

Importing the partial in the main scss file

• You can also use the entire filename
• You can also forward entire folders
• Folders should contain _index.scss

@forward 'boilerplate';
@forward 'typography';

file structure