General

variables

cyanotype-generate-classes

$cyanotype-generate-classes: true !default;

Description

Controls whether or not helper classes are generated. If set to false, only the mixins will be available. In order for your setting to take effect, ensure the variable is set before importing Cyanotype.

Type

Boolean

mixins

flex

@mixin flex($grow: 1) { ... }

Description

Provides a shorthand for creating flexible elements. It sets the flex property to the $grow parameter, and it also sets min-height and min-width to zero, which is usually what you want.

The CSS flexbox module sets flexible elements’ minimum sizes to auto, which can have unintended side effects when elements shrink. If you do not want this behavior, just use flex directly.

Parameters

parameterNameparameterDescriptionparameterTypeparameterDefault value
$grow

value for flex-grow

Number1

flex-pad

@mixin flex-pad($before: 0, $after: 0) { ... }

Description

Provides a way to add weighted padding to the beginning and end of a flexbox container without polluting the DOM. It uses pseudoelements to create the padding. The values for $before and $after will be used as the weights for flex-grow for each pseudoelement.

Parameters

parameterNameparameterDescriptionparameterTypeparameterDefault value
$beforenoneNumber0
$afternoneNumber0

See

flexible-container

@mixin flexible-container($direction: horizontal, $justify: flex-start) { ... }

Description

Sets display: flex on an element, turning it into a flexbox container.

Parameters

parameterNameparameterDescriptionparameterTypeparameterDefault value
$direction

controls the axis upon which the container lays out its children

'horizontal' or 'vertical'horizontal
$justify

value for justify-content

Stringflex-start

full-size

@mixin full-size() { ... }

Description

A helper mixin for setting width and height to 100%. This should be used sparingly—most of the time, the same effect can be accomplished via flexbox, and explicitly setting the size of an element can mess with how flexbox lays out elements.

Parameters

None.