Partial files with underscore prefix in SASS - Interactive Code Practice

Practice - 5 Tasks

1fill in blank

easy

Complete the code to import a Sass partial file named '_colors.scss'.

SASS

@import '[1]';

Drag options to blanks, or click blank then click option'

Acolors

B_colors.scss

Ccolors.scss

D_colors

Attempts:

3 left

💡 Hint

Common Mistakes

Including the underscore in the import path.

Including the '.scss' extension in the import path.

When importing Sass partials, you omit the underscore and the file extension. So '@import "colors";' correctly imports '_colors.scss'.

2fill in blank

medium

Complete the code to import the partial '_variables.scss' in your main Sass file.

SASS

@import '[1]';

Drag options to blanks, or click blank then click option'

Avariables

B_variables.scss

Cvariables.scss

D_variables

Attempts:

3 left

💡 Hint

Common Mistakes

Writing the underscore before the file name.

Including the '.scss' extension.

To import a Sass partial, you only write the file name without the underscore and extension. '@import "variables";' imports '_variables.scss'.

3fill in blank

hard

Fix the error in the import statement to correctly import the partial '_mixins.scss'.

SASS

@import '[1]';

Drag options to blanks, or click blank then click option'

A_mixins.scss

Bmixins.scss

Cmixins

D_mixins

Attempts:

3 left

💡 Hint

Common Mistakes

Including the underscore in the import path.

Including the '.scss' extension.

When importing Sass partials, omit the underscore and file extension. '@import "mixins";' correctly imports '_mixins.scss'.

4fill in blank

hard

Fill both blanks to import two partials '_reset.scss' and '_base.scss' in one statement.

SASS

@import '[1]', '[2]';

Drag options to blanks, or click blank then click option'

Areset

B_reset

Cbase

D_base

Attempts:

3 left

💡 Hint

Common Mistakes

Including underscores in the import names.

Including '.scss' extensions.

When importing multiple Sass partials, omit underscores and extensions. '@import "reset", "base";' imports '_reset.scss' and '_base.scss'.

5fill in blank

hard

Fill all three blanks to import '_typography.scss', '_layout.scss', and '_theme.scss' partials correctly.

SASS

@import '[1]', '[2]', '[3]';

Drag options to blanks, or click blank then click option'

Atypography

Blayout

Ctheme

D_theme

Attempts:

3 left

💡 Hint

Common Mistakes

Including underscores in any of the file names.

Including '.scss' extensions.

Not separating file names with commas.

To import multiple Sass partials, list their names without underscores or extensions. '@import "typography", "layout", "theme";' imports '_typography.scss', '_layout.scss', and '_theme.scss'.