Click here to navigate the course.

Drag the edges to resize the window.

In Projects, you can keep track of your progress as you go throught the tasks. Check each item as you complete it!

Code Editor
Web Browser

Sass allows you to pass in multiple arguments in a list or a map format.

For example, take the multiple properties needed to create the college-ruled stripes in the back of our notecard.

@mixin stripes($direction, $width-percent, $stripe-color, $stripe-background: #FFF) { background: repeating-linear-gradient( $direction, $stripe-background, $stripe-background ($width-percent - 1), $stripe-color 1%, $stripe-background $width-percent ); }

In this scenario, it makes sense to create a map with these properties in case we ever want to update or reference them.

$college-ruled-style: ( direction: to bottom, width-percent: 15%, stripe-color: blue, stripe-background: white );

When we include our mixin, we can then pass in these arguments in a map with the following ... notation:

.definition { width: 100%; height: 100%; @include stripes($college-ruled-style...); }

Note: Remember to always prioritize readability over writing less code. This approach is only useful if you find it adds clarity to your codebase.

report a_bug
If you see a bug or any other issue with this page, please report it here.