Mixins

Has some mixins that will help you.

Usage

@import "mussarela/mussarela/addons";

Functions

Border radius

Provide an easy way to set border radius to some directions.

Params

border-radius($radius);

.element {
  @include border-top-radius(50px);
  @include border-bottom-radius(50px);
  @include border-left-radius(50px);
  @include border-right-radius(50px);
}

Clearfix

Include clearfix.

.element {
  @include clearfix;
}

Coverer

Force an element to fill the screen or parent element.

.element {
  @include coverer;
}

Horizontal center

Center an element horizontaly.

.element {
  @include h-center;
}

Media

This mixins is a little bit big, so we've a page for him.

Position

Params

position($position, $cordinates);

.element {
  @include position(absolute, 10px 10px);
}

Triangle

Provide an easy way to do CSS triangle.

Params

triangle($direction, $color, $size)

.element {
  @include triangle(top, red, 10px);
}

Params

truncate ($width);

Truncate

This mixin will truncate text, adding an ellipsis to represent overflow.

.element {
  @include truncate(200px);
}

Vertical center

Align an element verticaly

.element {
  @include v-center;
}