2. Basic SASS Features

1. Variables:

Declare Variables with $:
```
$btnColor: blue;
```

2. Nesting Styles:

Organize code with nesting:

div {
  background-color: red;
 
  button {
    background-color: green;
 
    &:hover {
      background-color: blue;
    }
  }
}

3. Importing Styles:

Split styles into separate files:
- Prefix file with an underscore (_), e.g., _header.scss.
- Import the file into another SCSS file:
```
@import "./header";
```

4. Mixins:

Create reusable code blocks with Mixins:

@mixin someStyle {
  // Code block
}
 
@mixin someStyle($color) {
  // Use the $color parameter
}

Using Mixins:
```
@include someStyle(red);
```

Mixins with Default Parameters:

@mixin identifier($param_1: default_value, $param_2: default_value) {
  property: $param_1;
  property: $param_2;
}

5. Functions in SASS:

Define Functions with @function:

@function function_name($parameters) {
  // code block
  @return value;
}

Using the Function in Styles:

.header {
  background-color: function_name($user_type);
}