_light()

  • /src/css/core/function/_color.scss

A little brighten

scss

//
// @param   hex  $hex
// @return  hex
//

color: _light(#000);

_lighter()

  • /src/css/core/function/_color.scss

Brighten

scss

//
// @param   hex  $hex
// @return  hex
//

color: _lighter(#000);

_lightest()

  • /src/css/core/function/_color.scss

To very brighten

scss

//
// @param   hex  $hex
// @return  hex
//

color: _lightest(#000);

_dark()

  • /src/css/core/function/_color.scss

A little darken

scss

//
// @param   hex  $hex
// @return  hex
//

color: _dark(#fff);

_darker()

  • /src/css/core/function/_color.scss

Darken

scss

//
// @param   hex  $hex
// @return  hex
//

color: _darker(#fff);

_darkest()

  • /src/css/core/function/_color.scss

To very darken

scss

//
// @param   hex  $hex
// @return  hex
//

color: _darkest(#fff);

_is-int()

  • /src/css/core/function/_condition.scss

Checks for a valid int

scss

//
// @param   mixed  $value
// @return  bool
//

@if (_is-int($value)) {
  z-index: $value;
}

_is-length()

  • /src/css/core/function/_condition.scss

Checks for a valid CSS length

scss

//
// @param   mixed  $value
// @return  bool
//

@if (_is-length($value)) {
  width: $value;
}

_is-null()

  • /src/css/core/function/_condition.scss

Checks for a valid null

scss

//
// @param   mixed  $value
// @return  bool
//

@if (not _is-null($value)) {
  width: $value;
}

_is-number()

  • /src/css/core/function/_condition.scss

Checks for a valid number

scss

//
// @param   mixed  $value
// @return  bool
//

@if (_is-number($value)) {
  z-index: $value;
}

_font-size()

  • /src/css/core/function/_deprecated.scss

Return rem font-size

scss

//
// @param  int  $scale-or-font-size  Font size scaling factor.
// @return  rem
//

font-size: _font-size(1); // => 16px

_line-height()

  • /src/css/core/function/_deprecated.scss

Return line-height for vertical rhythum

scss

//
// @param  int  $scale-or-font-size  Font size scaling factor.
// @return  int
//

.c-foo {
  line-height: _line-height(1); // line-height for 1rem
}

_space()

  • /src/css/core/function/_deprecated.scss

Return the margin conforming to the rhythm

  • When coefficient is lenght return it as is

scss

//
// @param   number   $coefficient
// @param   boolean  $apply-space-scale
// @param   boolean  $apply-margin-scale
// @return  length
//

padding: _space(1);
padding: _space(1, true);
padding: _space(1, true, true);

_gcd()

  • /src/css/core/function/_gcd.scss

Return greatest common divisor

scss

//
// @param   int  $a  The number to be divided
// @param   int  $b  The number to divide
// @return  int  The number of the remainder
//

$gcd: _gcd(4, 8);

_min()

  • /src/css/core/function/_media-query.scss

Return min size.

  • If $size is key of $_size, return that value.
  • If $size is number, return this.

scss

//
// @param  size|length  $size
// @return length|false
//

@media (min-width: _min(md)) {
  ...
}

_max()

  • /src/css/core/function/_media-query.scss

Return max size.

  • If $size is key of $_size, return that max value.
  • If $size is number, return this.

scss

//
// @param  size|length  $size
// @return length|false
//

@media (max-width: _max(md)) {
  ...
}

_prev-size-key()

  • /src/css/core/function/_media-query.scss

Return prev key of $_size

scss

//
// @param  size  $size
// @return size
//

$prev_size_key: _prev-size-key(md); // => sm

_next-size-key()

  • /src/css/core/function/_media-query.scss

Return next key of $_size

scss

//
// @param  size  $size
// @return size
//

$next_size_key: _next-size-key(md); // => lg

_px2em()

  • /src/css/core/function/_px2em.scss

Return em from px

scss

//
// @param   px  $px
// @param   px  $base-font-size-px
// @return  em
//

font-size: _px2em(16px);

_px2rem()

  • /src/css/core/function/_px2rem.scss

Return rem from px

scss

//
// @param   px  $px
// @param   px  $base-font-size-px
// @return  rem
//

font-size: _px2rem(16px);

_rem2px()

  • /src/css/core/function/_rem2px.scss

Return px from rem

scss

//
// @param   rem  $rem
// @param   px   $base-font-size-px
// @return  px
//

font-size: _rem2px(2rem);

_replace()

  • /src/css/core/function/_replace.scss

Replace in a string

scss

//
// @param   string|list  $substr
// @param   string       $newsubstr
// @param   string       $string
// @return  string
//

$value: _replace('p', 'a', 'apple'); // => aaale

_sanitize-animation-name()

  • /src/css/core/function/_sanitize-animation-name.scss

Sanitize animation name

scss

//
// @param   string  $name
// @return  string
//

$animation-name: _sanitize-animation-name($name);
animation: $animation-name .2s ease-in 0s;

_size-prefix()

  • /src/css/core/function/_size-prefix.scss

Return prefix for the device size

scss

//
// @param   string  $size  sm|md|lg
// @return  string
//

$prefix: _size-prefix(md); // -> --md

_strip-unit()

  • /src/css/core/function/_strip-unit.scss

Return numeric value that doesn't have the unit.

scss

//
// @param   length  $value  numeric value
// @return  int
//

$value: _strip-unit(10px); // => 10