SCSS Code Style
ScandiPWA follows a strict SCSS style guide for maintainability and consistency
ScandiPWA follows the BEM methodology to write styles. In addition, there are some guidelines to help you write more maintainable stylesheets.
In some cases, you might need to style one Block differently depending on whether it is a child of another block.
Mobile-first styling means that you are encouraged to start with mobile styles. When mobile styles are complete, you can use the
@include desktopdirective and other breakpoints to adjust the styling for larger viewports.
You should avoid hard-coding numbers when their reasoning is not obvious. Make values re-usable and understandable by using CSS variables.
Unless you need to produce a pixel-perfect design, we recommend using values rounded to the nearest 5px, avoid unnecessary decimal digits, and consider how much precision browsers can actually display.