What are partials in Sass?
Experience Level: Junior
Tags: Sass
Answer
The partials are Sass snippets that are stored in standalone .scss files.
The file names of Sass partials are prefixed by underscore character. This way it is clear what file is full Sass stylesheet and what file is Sass partial.
The partials can be included into Sass stylesheets and are great for code organization.
You can for example store stylesheets for standalone components into standalone partials and then merge them into the main Sass stylesheet.
_buttons.scss
$primary: blue;
$error: red;
button {
background-color: $primary;
color: white;
border: none;
}
button.error {
background-color: $error;
color: white;
border: none;
}
_dialogs.scss
.dialog {
border: solid 1px gray;
border-radius: 15px;
padding: 15px;
}
styles.scss
@import 'buttons';
@import 'dialogs';
Related Sass job interview questions
How do you modularize your project stylesheets using Sass?
Sass JuniorWhat is @import keyword good for in Sass?
Sass JuniorWhat is a difference between Sass and CSS?
Sass JuniorWhat is scale-color() function good for in Sass?
Sass JuniorWhat are lighten() and darken() functions good for in Sass?
Sass Junior